وب‌سایت‌هایی که مرور می‌کنی، اخباری که مرور می‌کنی و محصولات که به شکل آنلاین خریداری می‌کنی توسط افرادی ایجاد می‌شوند که به آن‌ها توسعه دهنده فرانت اند می‌گوییم. توسعه‌دهندگان فرانت اند افرادی هستند که مسئولیت طراحی نمای ظاهری یک وب‌سایت را عهده‌دار هستند. توسعه‌دهندگان فرانت اند نقش مهمی در توسعه وب دارند. اگر علاقه‌مند هستید به دنیای توسعه فرانت اند وارد شوید، اما مسیر درست را نمی‌دانید در این مقاله، سایت دانش و فناوری بامداد نقشه راه تبدیل شدن به یک توسعه دهنده فرانت اند را شرح می‌دهد.

توسعه دهنده فرانت اند کیست؟

یک توسعه دهنده فرانت اند (Front-End) متخصصی است که وظیفه اصلی آن  طراحی و پیاده‌سازی رابط کاربری است. برای آن‌که کاربران بتوانند از یک برنامه وب‌محور یا یک وب‌سایت استفاده کنند به یک رابط خوش ساخت نیاز دارند که  تعامل با سایت را میسر می‌کند. به بیان ساده‌تر توسعه‌دهندگان فرانت اند باید به گونه‌ای از جاوااسکرپیت، CSS و HTML استفاده کنند تا کاربران بدون مشکل از خدمات سایت استفاده کنند و از طرفی موتورهای جست‌وجو نیز صفحات سایت را بدون هیچ مشکلی شاخص‌گذاری کنند.

اگر در کدنویسی فرانت اند بی دقتی انجام شود و کدها کیفیت پایینی داشته باشند، موتور‌های جست‌وجو صفحات سایت را در صفحات سوم یا چهارم جست‌وجو قرار می‌دهند و اصطلاحاً سئوی سایت شما با مشکل مواجه می‌شود.

شش مهارت مهم و زیربنایی مرتبط با فرانت اند

شش مهارت مهم و زیربنایی مرتبط با فرانت اند

پیشنهاد مقاله: تفاوت برنامه‌نویسی بک اند و فرانت اند

مهندس فول‌استک حد آخر فرانت اند و بک اند است و انقدر مهارت و تجربه دارد که وقت نمی‌کند خودش کدنویسی کند و فقط چراغ را برای توسعه‌دهنده‌ها روشن می‌کند تا از جاده اصلی منحرف نشوند. جالب است که مهندس فول‌استک تجربه مدیریت پروژه را دارد و حتی در زمینه پیکربندی، مدیریت و نگهداری شبکه‌ها و سیستم‌های رایانه‌ای کلی مهارت دارد. به همین دلیل است که حقوق خیلی خوبی هم دریافت می‌کند! البته این را هم بدانید که یک مهندس فول‌استک واقعی را نمی‌توان به این سادگی‌ها پیدا کرد و شاید دست‌کم از هر 100 نفری که ادعا می‌کنند مهندس فول‌استک وب هستند، فقط یک نفر به معنای واقعی کلمه صاحب این تخصص‌هاست.

طراحی واکنش گرا یکی از مفاهیم مهمی است که نباید از یادگیری آن غافل شوید

طراحی واکنش گرا یکی از مفاهیم مهمی است که نباید از یادگیری آن غافل شوید

پیشنهاد مقاله: آموزش برنامه نویسی – شروع آموزش برنامه نویسی

توسعه‌دهنده فرانت اند چه کاری انجام می‌دهد؟

خوب الان که فهمیدیم توسعه دهنده فرانت اند چه کاری انجام می‌دهد باید به این نکته هم اشاره کنیم که برخی سایت‌ها توسعه دهنده فرانت اند را توسعه‌دهنده سمت کلاینت (client-side developers) توصیف می‌کنند که خوب، ایرادی هم ندارد. در هر صورت، یک توسعه دهنده فرانت اند باید تخصصی در کار با زبان‌های برنامه‌نویسی و فناوری‌هایی مثل جاوااسکریپت، HTML و CSS داشته باشد (البته همان‌طور که تا چند دقیقه دیگر می‌خوانید کار به این سادگی‌ها هم نیست!). یک توسعه‌دهنده فرانت اند حسابی با جنبه‌های بصری وب‌سایت بازی می‌کند تا شما بتوانید به بخش‌های مختلف سایت خیلی ساده دسترسی پیدا کنید. خوب وظیفه اصلی یک توسعه‌دهنده فرانت اند چیست؟ این که یک تجربه کاربری یکتا برای ما رقم بزند تا بتونیم محتوای یک سایت را راحت ببینیم. مثل همین کاری که الان داریم انجام می‌دیم! اما یکسری مسئولیت‌های مهم هم دارد که مهم‌ترین آن‌ها به شرح زیر هستند:

  • تعامل مستمر با گرافیست‌ها تا بالاخره ایده‌های بالقوه به بالفعل تبدیل شوند.
  • طراحی و پیاده‌سازی جنبه‌های بصری سایت.
  • نظارت بر عملکرد سایت و رفع مشکلات مربوط به قابلیت استفاده.
  • ساخت ابزارهایی که تجربه کاربری را بهبود می‌بخشند.
  • تعامل با تیم توسعه وب تا مالک سایت مطمئن بشه سایت در مراحل توسعه مطابق با انتظارات در حال ساخت است.

به‌طور معمول  توسعه‌‌دهندگان فرانت اند به شکل تمام وقت در محل کار حضور دارند، هرچند برخی از آن‌ها فریلنسری کار می‌کنند که خودش یک داستان مفصل دارد.

توسعه‌دهندگان فرانت اند چقدر حقوق دریافت می‌کنند و بازار کار فرانت اند چگونه است؟

حقوق و دستمزدی که توسعه‌دهندگان فرانت اند دریافت می‌کنند بر اساس صنعت و کسب‌وکاری که در آن مشغول به کار هستند متغیر است، اما به‌طور میانگین دستمزدی که این افراد در ایالات متحده دریافت می‌کنند ۱۰۱ هزار دلار در سال است که ظاهرا بازار کارشان آن‌ور آب حسابی داغ است.

اوضاع این متخصصان در ایران چطوری است؟ خوب اگر قرار باشد صادقانه بگویم، وضعشان در ایران هم خوب است! در ایران بسته به تجربه و تخصصی که افراد دارند حقوقشان متغیر است، اما به عنوان یک محدوده کلی توسعه‌دهندگان جونیور در ایران ۵ تا ۶ میلیون تومان در ماه حقوق دریافت می‌کنند که البته در سال جدید این رقم بیشتر می‌شود. آن توسعه‌دهندگانی که تجربه بیشتری دارند و حسابی در مورد فناوری‌های مختلف دانش و تجربه کسب کرده‌اند تا ۱۱ میلیون تومان در ماه هم حقوق دریافت می‌کنند که بازهم این قیمت در سال جدید افزایش پیدا می‌کند! با این حساب فکر نمی‌کنید بهتر است برویم سراغ یادگیری فرانت اند؟ خوب از کجا شروع کنیم و چه چیزی یاد بگیریم؟

پیشنهاد مقاله: بوتکمپ برنامه‌نویسی بامداد، کوتاه‌ترین مسیر برای ورود به حرفه برنامه نویسی

مسیر یادگیری فرانت اند چیست؟

  • در اولین گام به فکر دریافت یک مدرک دانشگاهی مرتبط با علوم کامپیوتر باشید، اما مدرک قرار نیست شما را توسعه دهنده فرانت اند کند، بلکه اطلاعات زیربنایی لازم در زمینه برنامه‌نویسی و فناوری‌های زیربنایی را به شما ارائه می‌کند. البته اگر مدرک دانشگاهی مرتبط با علوم کامپیوتر نداری، صبر کن یک روش دیگر هم برای دریافت این تخصص‌ها هست. آموزشگاه‌ها و موسسات آموزشی هم این اطلاعات را ارائه می‌کنند. البته به شرطی که خودت هم حسابی تلاش کنی.
  • در مرحله بعد باید روی یادگیری فناوری‌های زیربنایی وب تمرکز کنی. HTML، CSS و جاوااسکریپت را باید حسابی یاد بگیری.
  • یک نکته‌ای که خیلی از سایت‌ها به آن اشاره نمی‌کنند، اما دوست دارم بدانی این‌که جاوااسکریپت یک زیرمجموعه حسابی مفصل دارد که باید فناوری‌های مشتق از آن را هم بلد باشی. به‌طور مثال، بهتر است روی TypeScript و ES6 تمرکز کنی و در کنار آن‌ها حسابی در مورد فرآیندهای آزمایشی مثل Enzyme، Jest و Mocha کار کنی. npm و Grunt هم که نیازی به تعریف ندارند و تسلط بر آن‌ها حسابی به شما کمک می‌کنند.
  • اگر قرار است توسعه دهنده فرانت اند بشوی باید با یکسری چهارچوب‌ها هم بتوانی کار کنی که آنگولار و ری‌اکت در صدر آن‌ها قرار دارند. گزینه‌های بعدی دیگر بستگی به بازار کار دارد. به‌طور مثال،js خیلی خوب است، Ember JS هم خیلی از کارها را ساده می‌کند و در انتها هم باید در مورد باندرهای معروف مثل Webpack، Browseify و نمونه‌های مشابه اطلاعات داشته باشی. این‌هایی که گفتم تنها زیرمجموعه جاوااسکریپت هستند، اما بازهم هست.
  • خوب همه سایت‌ها تنها به این نکته اشاره می‌کنند که CSS یاد بگیر و تمام! من به شما می‌گویم یادگیری CSS را باید با پیش‌پردازنده‌هایش مثل PostCSS یا Stylus یاد بگیری و چون‌که دوست داری توسعه دهنده فرانت‌اند بشوی باید یادگیری چارچوب Bootstrap را هم جدی بگیری. البته گزینه‌های دیگر هم هست، اما به جای این‌که در چهارچوب‌های دیگر غرق بشوی در مورد طراحی وب واکنش‌گرا تحقیق کن که خودش چهارچوب‌های دیگر را معرفی می‌کند! در مورد CSS یک نیم نگاهی هم به روش‌شناسی‌های (همان متدولوژی) رایج مثل OOCSS، BEM و…. داشته باش.
  • یک نکته خیلی مهم که نباید نادیده بگیری، تمرکز روی الگوهای طراحی مثل Regex و تکنیک‌های مختلفی است که برای آزمایش الگوها وجود دارد.
  • یک چیز دیگر که شاید بعضی‌ها با من هم عقیده نباشند این‌که jQuery دیگر مثل قبل یکه‌تاز نیست و خیلی از شرکت‌ها دیگر دنبال آن نیستند.
  • چون‌ توسعه دهنده فرانت‌اند هستی بهتر است با نرم‌افزارهای گرافیکی مثل فتوشاپ یا ایلاستریتور هم آشنا باشی تا بتوانی زبان طراحان گرافیک را متوجه بشوی.
  • همه دوست داریم در تیم‌های بزرگ و شرکت‌های بزرگ در کنار توسعه‌دهندگان بزرگ کار کنیم. یکی از پیش‌شرط‌های ورود به این تیم‌ها تسلط بر فناوری‌های کنترل نسخه پروژه مثل گیت است که تسلط بر زیر و بم گیت و گیت‌هاب به زمان نیاز دارد!

 

خوب همان‌طور که دیدی یک توسعه دهنده فرانت اند شدن آن هم به معنای واقعی کلمه، به کار شبانه‌روزی نیاز دارد تا بتوانی یک جایگاه خوب در بازار به شدت رقابتی امروز پیدا کنی. اما اگر روی این فناوری‌ها حسابی کار کنی، شانس بی‌کار شدنت اگر به صفر نرسد خیلی به صفر نزدیک می‌شود!

موفق باشی و اگر نظر یا سؤالی داشتی، زیر همین مطلب، برای ما ارسال کن تا در اولین فرصت، جوابگوی سؤالات و شنوای نظراتت باشیم.