آموزش رایگان برنامه نویسی در کانال یوتیوب yasharhabibimedia
سبد خرید
0

هیچ محصولی در سبد خرید نیست.

نقشه راه تبدیل شدن به برنامه نویس فرانت اند

نقشه راه تبدیل شدن به برنامه نویس فرانت اند

مطلب پیشنهادی:آموزش رایگان برنامه نویسی
نقشه راه تبدیل شدن به برنامه نویس فرانت‌اند مثل یک راهنما بهتون کمک میکنه تا قدم به قدم مسیر برنامه نویس شدن رو طی کنید. به همین دلیل این پست رو برای شما آماده کردم تا بهتون نشون بدم که چطور می‌تونید برنامه نویس فرانت اند بشید؟

نقشه راه تبدیل شدن به برنامه نویس فرانت اند

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

آمادگی برای شروع

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

آمادگی برای شروع

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

یه ایده دیگه این هست که با استفاده از API های گیت‌هاب، یک صفحه بسازید که ۱۰ تا از برترین مخازن گیت در هفته گذشته رو نشون بده. یا می‌تونید یک برنامه to-do لیست بسازید. همگی این پروژه ها میتونن به عنوان نمونه کار استفاده بشن و در نهایت کارفرما با دیدن نمونه کار مطمئن میشه که شما برنامه نویسی فرانت‌اند رو بلدید. بعد از این که تمامی این موارد رو یادگرفتید، می‌تونید سراغ مبحث مهم کار با ورژن کنترل یعنی گیت برید. توی گیت‌هاب پروفایل خودتون رو بسازید و کاملش کنید.

گیت

نوشتن بهتر کدهای CSS

وقتی که اصول و مفاهیم اصلی رو به صورت کامل پوشش دادید و یادگرفتید، میتونید برید سراغ قدم بعدی یعنی نوشتن css. برای نوشتن css به صورت حرفه‌ای می‌تونید از فریم‌ورک‌ها استفاده کنید که در تصویر نشون داده شدن.

نوشتن بهتر کدهای CSS

مثل مرحله قبلی برای تقویت خودتون چندتا پروژه انجام بدین. برای مثال می‌تونید بوتسترپ رو با استفاده از npm یا yarn به پروژه‌های خودتون اضافه کنید. پروژه‌های قبلی خودتون رو برای استفاده BEM تبدیل کنید. همچنین می‌تونید CSS رو با کمک SASS بنویسید. یه ایده دیگه این هست که با استفاده از npm تبدیل SASS به CSS رو خودکار کنید.

قدم بلند بعدی

بعد از پشت سرگذاشتن مراحل قبلی، به مرحله سوم می‌رسید که کمی زمان میبرد. در این مرحله باید زبان جاوااسکریپت</a > رو یادبگیرید. یکی از مهم ترین عواملی که باعث تبدیل شدن شما به برنامه نویس فرانت‌اند میشه، همین زبان جاوااسکریپت است. علاوه بر یادگرفتن این زبان، باید با webpack آشنا بشید. همچنین باید درک کنید که babel چیه؟ باید درک کنید که چرا از اون استفاده می‌کنیم و ضرورتش چیه؟ همچنین باید بدونید چطور کدهاتون رو با ESLint تجزیه و تحلیل کنید؟ در تصویر زیر میتونید همه اینارو توی یک نمودار ببینید.

babel webpack

بعد از یادگرفتن همه این موارد، باید چندتا پروژه برای این مرحله انجام بدین. یک پروژه این هست که یک پکیج npm درست کنید که نام کاربری رو بگیره و بعد لینک‌های اون نام کاربری در شبکه‌های اجتماعی رو برگردونه. (در صورتی که توی اون شبکه‌‎های اجتماعی پروفایل داشته باشه). این پروژه باید توی مرورگر کار کنه و اونو با webpack باندل کنید. بعد با babel اونو منتقل کنید و در نهایت اونو با ESLint تجزیه و تحلیل کنید.

یه پروژه دیگه هم این هست که یک پروژه to-do لیست ساده درست کنید که در اون پروژه از SASS استفاده کرده باشید. همچنین از بوتسترپ هم کمک گرفته باشید. و برای باندل کردن و ارسال اون از webpack و babel استفاده کنید. در نهایت محصول بهینه خودتون رو توی گیت‌هاب بزارید.

آموزش پیشنهادی:آموزش جاوااسکریپت</a >

اپلیکیشن‌های مدرن فرانت‌اند

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

  • React
  • Angular
  • Vue

پیشنهاد من این هست که اول سراغ فریم‌ورک React برید. تصویر زیر یک نمودار مفید برای یادگرفتن فریم‌ورک‌هاست.

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

یه ایده پروژه این هست که یک برنامه ساده درست کنید که به شما این امکان رو به شما میده تا هشتگ انتخاب کنید و با استفاده از API های توییتر پست‌های مربوط به اون هشتگ رو بهتون نشون میده. یه ایده دیگه این هست که شمارنده‌ای رو بسازید و کاربر بتونه مدت زمان کار و وقفه رو پیکربندی کنه و سر وقت شروع به صدا دادن کنه.

تست خودکار

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

Static Type Checkers

Type Cheker ها به شما این امکان رو میدن که قابلیت نگهداری کدتون رو در حین رشد پروژه بیشتر کنید. همچنین میزان سرعت و چابکی کار رو هم زیاد میکنه. در ویرایشگرها پشیبانی بهتری داره و داکیومنت‌های بهتری رو میتونید داشته باشید. در تصویر زیر انواعشون رو می‌بینید که توصیه من TypeScript هست.

تایپ اسکریپت

یک قدم فراتر

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

نکست

همونطور که در تصویر می‌بینید، اگر فریم ورک React رو انتخاب کرده باشید، برای سمت سرور می‌تونید سراغ Next.js و After.js برید. برای بقیه فریم‌ورک‌ها هم همینطوره.

جمع بندی

نقشه راه تبدیل شدن به برنامه نویس فرانت‌اند شامل یک سری نکات میشه که در این پست بهشون اشاره کردم. قدم به قدم هر چیزی که لازم بود با رعایت پیش نیازها بهتون گفتم. همچنین یک سری پروژه برای هر مرحله از یادگیری بهتون معرفی کردم که با انجام دادن اونا می‌تونید مهارت خودتون رو تقویت کنید.

نقشه راه تبدیل شدن به برنامه نویس فرانت اند

امتیاز 5 از 2 رای

14

من یاشار حبیبی 15 سال تو حوزه برنامه نویسی وب در حال فعالیت هستم و اینجا قراره تجربیاتم رو باشما به اشتراک بزارم و باهم کلی چیز یادبگیریم و لذت ببریم

دیدگاه کاربران
  • ahmadreza.shamimi 16 خرداد 1400 / 7:59 ق.ظ

    عالی بود و کامل یاشار جان و به نظرم فقط ترس نداشتن و کد زدن کد زدن خیلی مهمه مثل خلبانی که هرچقدر بیشتر بپره تجربه اش بیشتر و اجازه بهش میدن که هواپیما های بزرگتر و بپرونه
    ممنون یاشار جان
    مثل همیشه عالی هستی

    • یاشار حبیبی 16 خرداد 1400 / 3:22 ب.ظ

      فدای تو احمد رضای عزیز، مرسی که مثل همیشه انگیزه میدی و حضور دوستای خوبی مثل شما باعث قوت قلبه.
      دقیقا همینیه که میگی. زمان و استمرار معجزه می کنه.

ارسال دیدگاه

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

توسط
تومان