علی عمرایی
Senior Frontend Engineer
معماری فرانتاند · Performance · تجربه کاربریبرای محصولات سازمانی و مقیاسپذیر
بیش از ۵ سال است که سامانههای وب واقعی را طراحی، توسعه و بهینه میکنم؛ از BPMS و BOSS و پلتفرمهای ویدیویی تا PWA، داشبوردهای سازمانی و CRM. تمرکز من روی معماری تمیز، Performance قابلاندازهگیری و تجربه کاربری روشن است.
علی عمرایی
Senior Frontend Engineer
موقعیت
تهران، ایران
تلفن
+98 918 954 5716
استک اصلی
کاهش حجم Bundle
در بهینهسازی نسخه قدیمی BPMS
بهبود بهرهوری CRM
در مدیریت مشتریان با React و TypeScript
سال تجربه
در فرانتاند و محصولات سازمانی
فرانتاند برای من فقط پیادهسازی رابط کاربری نیست.
در محصولهایی کار کردهام که فرانتاند در آنها فقط چند صفحه ساده نیست؛ بلکه بخش مهمی از منطق محصول، تجربه کاربر، workflow، دریافت داده، احراز هویت و مجوزدهی، فرمهای پیچیده، Performance و نگهداشت بلندمدت را مدیریت میکند.
در چنین محصولهایی، تصمیمهای کوچک فنی میتوانند بر سرعت توسعه، کیفیت خروجی و هزینه نگهداشت اثر جدی بگذارند. به همین دلیل، در کنار توسعه Feature به معماری، مرزبندی کامپوننتها، مدیریت state، راهبرد رندرینگ، دسترسپذیری و تجربه توسعهدهنده هم توجه میکنم.
تمرکز اصلی
- تحصیلات
- کارشناسی مهندسی کامپیوتر
- دانشگاه
- دانشگاه آزاد اسلامی، تهران
- زبانها
- فارسی · انگلیسی
- موقعیت
- تهران، ایران
- تلفن
- +98 918 954 5716
کارهایی که شیوه فکر و اجرایم را نشان میدهند
هر پروژه با مسئله، نقش من و خروجی فنی خلاصه شده است تا فقط یک فهرست از فناوریها نباشد.
بازنویسی کامل BPMS از AngularJS به React/NX
روی یک BPMS چندزبانه و قدیمی مبتنی بر AngularJS کار کردم که به بهینهسازی جدی نیاز داشت؛ سپس در طراحی و بازنویسی کامل آن از صفر با معماری مدرن NX Monorepo نقش اصلی داشتم.
پروژه سازمانی — Samim Engineering Group
پلتفرم سازمانی انتشار و پخش ویدیو
معماری و توسعه یک پلتفرم سازمانی برای انتشار و پخش ویدیو با پشتیبانی از VOD، UGC و Reels. در این پروژه SSR، ISR، SSG و CSR، لایه BFF، پخش تطبیقی با Video.js، چندزبانهبودن و چندتمیبودن و استقرار Dockerized را پیادهسازی کردم.
پروژه سازمانی — Samim Engineering Group
اپلیکیشنهای سازمانی BOSS، mySME، PRM، Cartable و Customer Portal
توسعه و نگهداشت چند اپلیکیشن سازمانی برای ایرانسل. در این پروژه Frontend پلتفرم BOSS را برای بهبود نگهداشتپذیری و Performance بازآرایی کردم، تست E2E را با Cypress پیادهسازی کردم و Webpack را برای کاهش زمان Build بهینهسازی کردم.
پروژه سازمانی — RashaSoft (برای ایرانسل)
پلاگینهای سفارشی Form.io و FormJS
توسعه پلاگینها و کامپوننتهای سفارشی برای Form.io و FormJS؛ شامل Calendar، Chart و Diagram برای استفاده در فرمسازهای سازمانی و workflowهای پیچیده.
پروژه سازمانی — Samim Engineering Group
آخرین نوشتهها
تجربههای فنی از پروژههای واقعی؛ از بهینهسازی و معماری تا ابزارها و درسهایی که در عمل یاد گرفتهام.
SemVer در npm به زبان ساده
در این مقاله میبینیم علامتهای ^ و ~ در نسخهگذاری npm چه معنایی دارند و npm install چگونه با آنها رفتار میکند.
خواندن نوشتهمشکل Memory Leak هنگام استفاده از hash در Webpack
در این مقاله یک مشکل رایج Memory Leak در Webpack هنگام استفاده از contenthash در محیط توسعه بررسی میشود و راهحلی عملی ارائه میشود.
خواندن نوشتهنسخهبندی معنایی (Semantic Versioning)
مروری سریع بر نسخهبندی معنایی و دلیل استفاده از آن در پروژههای نرمافزاری.
خواندن نوشتهمسیر حرفهای
سالها فعالیت در محصولهای سازمانی، از بازنویسی سیستمهای قدیمی تا ساخت پلتفرمهای جدید.
Samim Engineering Group
Senior Frontend Engineer
آبان ۱۴۰۳ — اکنونتهران، ایرانتوسعه و مدرنسازی همزمان BPMS سازمانی؛ بازنویسی تدریجی بخشهای legacy مبتنی بر AngularJS با React/NX و توسعه قابلیتها و ماژولهای جدید با معماری و تکنولوژیهای مدرن، در کنار توسعه یک پلتفرم سازمانی انتشار و پخش ویدیو و پلاگینهای فرمساز.
- بازنویسی کامل BPMS قدیمی مبتنی بر AngularJS به یک NX Monorepo مدرن با React، TypeScript، Vite و Ant Design؛ طراحی معماری مقیاسپذیر و منتورینگ توسعهدهنده جونیور در طول مهاجرت.
- توسعه و نگهداری همزمان قابلیتهای BPMS موجود و توسعه ماژولها و قابلیتهای جدید با React، TypeScript و معماری NX، در کنار مهاجرت تدریجی بخشهای legacy از AngularJS به معماری مدرن.
- کاهش ۴۰٪ حجم Bundle نسخه قدیمی از طریق بهینهسازی Webpack، ماژولارکردن کد و Code Splitting.
- معماری و توسعه یک پلتفرم سازمانی برای انتشار و پخش ویدیو با پشتیبانی از VOD، UGC و Reels با Next.js.
- پیادهسازی SSR، ISR، SSG، CSR و لایه BFF، استقرار Dockerized، پشتیبانی چندزبانه و چندتمی، پخش تطبیقی ویدیو با Video.js و بهینهسازی مستمر SEO و Performance.
- توسعه پلاگینهای سفارشی Form.io و FormJS شامل کامپوننتهای تقویم (FullCalendar)، نمودار (ECharts) و دیاگرام (Mermaid) برای گسترش قابلیتهای workflow سازمانی.
- بومیسازی و پایدارسازی یک ماژول Analytics در BPMS، مشابه Camunda Optimize، با پشتیبانی کامل از RTL و فارسی و رفع مشکلات کلیدی عملکردی.
- یکپارچهسازی و شخصیسازی جریانهای احراز هویت و قالبهای ورود Keycloak در اپلیکیشنهای سازمانی.
- همکاری نزدیک با تیمهای محصول، طراحی و backend در محیط Agile، انجام Code Review و منتورینگ اعضای تیم.
Bardin Tech
توسعهدهنده فرانتاند (پارهوقت)
آبان ۱۴۰۴ — اسفند ۱۴۰۴دورکاریتوسعه پروژهای پارهوقت روی پلتفرم سازمانی BOSS؛ رفع بدهی فنی، ارتقای PWA و بهروزرسانی زیرساخت فرانتاند.
- مدرنسازی فرانتاند پلتفرم BOSS با رفع مشکلات قدیمی و بهبود پایداری اپلیکیشن.
- بهبود پیادهسازی PWA از طریق پیکربندی بهتر Service Worker، راهبردهای Caching و پشتیبانی آفلاین.
- ارتقای Dependencyها و ابزارهای فرانتاند برای بهبود نگهداشتپذیری و سادهترشدن توسعه در آینده.
- انجام Code Review و کدنویسی تمیزتر برای افزایش یکپارچگی در Codebase.
RashaSoft (Rasha Communications Development)
توسعهدهنده فرانتاند
شهریور ۱۴۰۰ — شهریور ۱۴۰۳تهران، ایرانتوسعه و نگهداشت اپلیکیشنهای سازمانی ایرانسل شامل BOSS، mySME، PRM، Customer Portal و Cartable با React، Next.js و TypeScript.
- توسعه و نگهداشت اپلیکیشنهای سازمانی BOSS، mySME، PRM، Customer Portal و Cartable برای ایرانسل با React، Next.js و TypeScript.
- بازآرایی فرانتاند BOSS برای بهبود نگهداشتپذیری، مقیاسپذیری و عملکرد کلی، با همکاری نزدیک تیمهای backend، طراحی و کسبوکار.
- پیادهسازی تستهای End-to-End با Cypress برای افزایش قابلیت اطمینان اپلیکیشن و کاهش مشکلات Regression.
- بهینهسازی پیکربندی Webpack برای بهبود سرعت Build و کاهش زمان بارگذاری اپلیکیشن.
- انجام Code Review، راهنمایی کارآموزان و توسعهدهندگان جونیور و مشارکت در مصاحبههای فنی فرانتاند.
- همکاری با تیم Business Analytics برای ارزیابی امکانپذیری فنی و برآورد میزان پیادهسازی Featureهای جدید.
Digiwash
توسعهدهنده فرانتاند
آبان ۱۳۹۹ — آبان ۱۴۰۰تهران، ایرانمشارکت در ساخت سه اپلیکیشن موبایل بههممرتبط (Factory، Driver و Customer) با React Native و یک سیستم CRM با React.
- مشارکت در توسعه سه اپلیکیشن موبایل بههممرتبط (Factory App، Driver App و Customer App) با React Native و TypeScript برای Android و iOS؛ نسخه وب این اپلیکیشنها نیز با React Native Web و یک Codebase مشترک ارائه شد.
- توسعه بخشهایی از یک سیستم CRM با React و TypeScript که به بهبود ۳۰٪ بهرهوری مدیریت مشتریان کمک کرد.
- یکپارچهسازی و مصرف REST APIهای backend با TanStack Query برای مدیریت Data Fetching و همگامسازی داده بین اپلیکیشنهای کارخانه، راننده و مشتری.
ابزارهایی که بیشتر با آنها کار میکنم
فناوریهایی که در طول این سالها با آنها سامانههای واقعی ساختهام.
زبانها و فریمورکها
مدیریت State و داده
معماری و ابزارها
رابط کاربری، استایل و Design System
Performance و فناوریهای تخصصی
تست و کیفیت
اصولی که به آنها پایبندم
عملکرد از ابتدا
ترجیح میدهم Performance، راهبرد رندرینگ، Bundle و دریافت داده از ابتدا درست طراحی شوند.
کد قابل نگهداشت
کدی که تیم بتواند در آینده با اطمینان تغییرش دهد؛ با ساختار روشن، کامپوننتهای هدفمند و نامگذاری قابلفهم.
فرانتاند محصولمحور
فرانتاند باید مسئله محصول، نیاز کاربر، محدودیت backend و تجربه نهایی را همزمان ببیند.
رشد تیم
Code Review، منتورینگ و استانداردسازی کمک میکنند تیم سریعتر، سالمتر و قابلاعتمادتر توسعه دهد.
ارتباط با من
برای گفتوگو و تبادل تجربه در ارتباط باشیم.
اگر پرسش فنی دارید یا دوست دارید درباره چالشهای توسعه صحبت کنیم، از طریق ایمیل، تلفن یا LinkedIn با من در ارتباط باشید.