جواد مراد خواه
جواد مراد خواه
خواندن ۴ دقیقه·۳ سال پیش

نقشه راه یادگیری Frontend برای مبتدی ها

هر وبسایتی از دو قسمت تشکیل شده: Frontend و Backend, قسمت Frontend ظاهر وبسایته که در مرورگر خودتون مشاهده می کنید و باهاش سرو کله میزنید. قسمت Backend قسمتی هست که در پشت صحنه هست. وقتی در یک وبسایت ثبت نام می کنید وظیفه ذخیره اطلاعات شما در دیتابیس به عهده Backend هست. تصاویر و متون و تمام داده ها و اطلاعاتی که در قسمت Frontend یک وبسایت مشاهده می کنید توسط Backend ذخیره , تهیه و تولید میشن. در قسمت Frontend درخواستی به Backend برای دریافت داده ها ارسال میشه و Backend داده های درخواستی رو به قسمت Frontend ارسال می کنه و قسمت Frontend این داده ها رو به نمایش میذاره و شما اون ها رو میبینید.

توسعه وب یا Web Development به سه شاخه تقسیم میشه: Frontend Development و Backend Development و Fullstack Development .

برنامه نویس های Frontend از HTML و CSS و Javascript برای ساخت قسمت Frontend استفاده می کنند.

برنامه نویس های Backend هم ممکنه از ابزار و زبان های برنامه نویسی مختلفی مثل: PHP و #C و Python و ... استفاده کنند.

برنامه نویس ها یا توسعه دهنده های Fullstack بر هر دو قسمت Frontend و Backend مسلط هستند و هر دو قسمت یک وبسایت رو طرحی میکنن و می نویسن.

زبان نشانه گذاری HTML مخفف Hypertext Markup Language هست که فارسیش میشه: زبان نشانه گذاری ابر متن! ما از زبان HTML برای ساخت ساختار ظاهر یک وبسایت استفاده می کنیم. زبان HTML یک زبان برنامه نویسی نیست بلکه یک زبان نشانه گذاری هست.

زبان استایل دهی CSS مخفف Cascading Style Sheets هست که یک زبان استایل دهی هست و ما ازش برای استایل دهی و خوشگل کردن ظاهر یک وبسایت استفاده میکنیم. زبان css هم مثل زبان HTML یک زبان برنامه نویسی نیست.

زبان Javascript یا جاوا اسکریپت یک زبان برنامه نویسی هست که ما ازش برای تعریف رفتار برای یک وبسایت استفاده میکنیم. می پرسید رفتار یعنی چی؟ مثلا با زبان جاوا اسکریپت هست که ما تعیین میکنیم وقتی کاربر روی یک دکمه کلیک کرد چه اتفاقی بیفته یا وقتی صفحه وبسایت ما توسط مرورگر بارگذاری شد چه اتفاقی بیفته و ...

به یک ساختمان فکر کنید, یک ساختمان در دنیای واقعی مثل یک صفحه وب در اینترنت هست. یک ساختمان اسکلت داره, دیوار داره, پنجره داره, آسانسور داره و ...

زبان HTML اسکلت و ساختمان یک وبسایت رو تشکیل میده, زبان CSS نما و ظاهر وبسایت رو تعریف میکنه و زبان جاوا اسکریپت مثل دکمه های آسانسور می مونه که تعیین میکنه وقتی فلان دکمه رو زدیم آسانسور مارو یه کدوم طبقه ببره.

قسمت Frontend تمام وبسایت های های دنیا با سه زبان HTML و CSS و Javascript نوشته شده. وقتی می گم همه یعنی 100%. پس اگه می خواهید یک فرانت اند دولوپر بشید باید این سه زبان رو یاد بگیرید و بهشون مسلط بشید.

مسیر یادگیری:


1- یادگیری HTML و CSS

برای یادگیری توسعه Frontend باید با زبان HTML و CSS شروع کنید. اگر روزی 3 الی 5 ساعت وقت بگذارید در حدود 1 الی 1.5 ماه درک مناسبی از این زبان ها خواهید داشت.

2- یادگیری جاوا اسکریپت

وقتی احساس کردید HTML و CSS رو در حد قابل قبولی یاد گرفتید وقتشه یادگیری جاوا اسکریپت رو شروع کنید. به طور عادی برای یادگیری جاوا اسکریپت در سطح مبتدی 1 الی 2 ماه باید زمان بذارید. لطفا توجه کنید که گفتم در سطح مبتدی! جمعا حداقل باید 3 ماه برای یادگیری HTML و CSS و Javascript زمان بذارید.

3- یادگیری یک فریمورک

یک فریمورک توسعه بخش فرانت اند رو برای برنامه نویس ها آسان تر و سریع تر میکنه (اگر نمیدونید فریمورک چیه گوگل کنید کلی منبع هست براش). 3 تا از محبوب ترین فریمورک ها در سطح جهان: React و Vue و Angular هستند که React از همه محبوب تر و ساده تر هست. از لحاظ فنی React یک کتابخونه هست نه فریمورک ولی در همه مقالات و مطالب در سطح اینترنت از React و Vue و Angular در کنار هم به عنوان فریمورک نام برده میشه چون هدف هر سه تاشون یکیه. برای شروع لازم نیست همه این سه تا رو با هم یاد بگیرید. از نظر من و خیلی از برنامه نویس ها اگر تازه کار هستید با کتابخونه React شروع کنید چون نسبت به بقیه فریمورک ها برای یادگیری ساده تر ست. برای یادگیری React به طور میانگین 2 ماه یا بیشتر باید زمان بذارید.

4- یادگیری یک ورژن کنترل سیستم

ما از Version Control System برای ذخیره و نگهداری نسخه های متخلفی از پروژه هامون استفاده می کنیم و با دیگران همکاری می کنیم. سه تا از محبوب ترین ورژن کنترل سیستم ها Git و Subversion و Mercurial هستند که در این بین Git از همه محبوب تر هست و در بیش از 70% کمپانی ها از Git استفاده میشه. امروزه تقریبا در همه آگهی های استخدامی مسلط بودن بر Git الزامیه و شما حتما باید یادش بگیرید. برای یادگیری Git باید 2 هفته زمان بذارید.


جمعا باید به طور میانگین 6 ماه برای یادگیری این 4 مهارت در سطح مبتدی زمان بذارید. توصیه میکنیم عجله نکنید و سعی نکنید خیلی چیز ها رو در مدت زمان کمی یاد بگیرید, در نهایت هیچی یاد نمیگیرید و فقط وقتتون رو تلف میکنید.

پیروز و موفق باشید

htmlcssjavascriptreactfrontend
از شهریور 1400 به توسعه وب علاقه شدیدی پیدا کردم و در حال یادگیری و آموزش توسعه وب هستم.
شاید از این پست‌ها خوشتان بیاید