سلام دوستای برنامه‌نویس آینده. سلام به آدمایی که میخوان توسعه‌دهندة فرانت‌اند(frontend) بشن. حتما دنبال این بودین که برای رسیدن به هدفتون، بتونین یه مسیر درست پیدا کنین. باید بگم جای درستی اومدین. اینجا نقشة راه برای یه توسعه‌دهندة فرانت‌اند ترسیم شده. شما فقط باید همین مسیر رو طی کنید. حوصله و وقت بذارید، تلاش کنید و ذهنتون رو آماده کنید تا بتونید یه برنامه‌نویس خفن بشید. تا اینجای کار حتما دیگه مطمئن شدین که می‌خواین برنامه‌نویس بشین و فرانت‌اند رو هم به عنوان حوزة کاریتون مشخص کردین و فعلا کاری با بک‌اند که بخش دیگة ماجرای توسعة وبه، کاری ندارین.
اصلا توسعه‌دهندة فرانت‌اند یعنی چی؟
توی شروع کار و با وضعیت کسی که کاملا توی این حوزه تازه‌وارده، سؤالای زیادی وجود داره. مثلا یه سؤال مشخص اینه که برنامه‌نویسی فرانت‌اند چیه؟ کسی که برنامه‌نویس فرانت‌انده، کارش چیه؟ البته که از اسمشم پیداست؛ یه برنامه‌نویس فرانت‌اند همون دست پشت پرده‌ایه که تمامی محتوایی رو که کاربر روی یه وبسایت یا اپلیکیشن و برنامه می‌بینه، ایجاد و طراحی کرده است.
به عبارتی، کار برنامه‌نویس فرانت‌اند اینه که:
۱. رابط کاربری استاتیک یا همان UI برای سایت یا اپلیکیشن بسازه.(آپشن محسوب میشه )
۲. به تعامل کاربران سایت یا اپلیکیشن رسیدگی می‌کنه؛ مثلا پر کردن فرم، زدن یه کلید خاص توی برنامه و کارهایی از این دست.
۳. رابط‌های میانجی برنامه‌های کاربردی را که با تیم بچه‌های بک‌اند به صورت مشترک داشتن با رابط کاربری (UI) یکپارچه می‌کنه.
۴. برای این‌که کاربرهای سایت یا اپلیکیشن بتونن راحت‌تر و بهتر از صفحه‌ای به صفحة دیگه برن، صفحات رو بهم پیوند می‌زنه.
برنامه‌نویس فرانت‌اند وظایف دیگه‌ای جدای از این موارد، وظایف دیگه‌ای هم داره که می‌تونه اونها رو به بقیة افراد تیم محول کنه.
برای ترسیم شفاف‌تر مسیر کامل برنامه‌نویس فرانت‌اند شدن، یه نقشه یا بهتر بگم، یه چارت تهیه شده که میتونین توی این سایت اون رو ببینین.
اما اینجا در مورد سه قدم اصلی و اول فرانت اند صحبت میکنیم یعنی html , css , javascript
حالا که یه دید کلی نسبت به مسیر تبدیل به فرانت‌اند شدن پیدا کردیم، می‌ریم سراغ مهارت‌هایی که یه برنامه‌نویس توی این حوزه باید بهشون مسلط باشه.
اولین مهارت، تسلط روی HTML یا (HyperText Markup Language) همون زبان نشانه‌گذاری ابرمتنی است که زبان استاندارد طراحی صفحات وب محسوب میشه. اساس و مبنای طراحی وب HTML است. HTML زبان برنامه‌نویسی نیست؛ اشتباه نکنید.ب یک زبان نشانه‌گذاریه، اما باعث نمی‌شه ارزشی کمتر از زبان‌های برنامه‌نویسی مثل پایتون و جاوا داشته باشه.
HTML از عناصر سازنده‌ای به نام تگ تشکیل شده. تگ‌ها معنا و مفهوم خودشون رو دارن. این زبان نشانه‌گذاری به شما کمک می‌کنه ساختار ابتدایی سایت و عناصری که می‌خواید توی سایتتون نمایش داده بشه، ایجاد بشه.
مهارت بعدی CSS یا Cascading Style Sheets است که به برگه‌های آبشاری مشهورن. با کمک CSS یا برگه‌های آبشاری می‌تونید بعد از نوشتن عناصر HTML، سبک و سیاق صفحة وب خودتون رو بسازید و بهش استایل بدین.
توی فایل‌های CSS ویژگی‌هایی مثل رنگ، اندازة متن و تصویر پس‌زمینه و بزرگی اون و فونت مورد نظرتون و خیلی موارد دیگه رو مشخص می‌کنید. توی همین بخشه که خلاقیتتون رو رو می‌کنید و وبسایتی رو طراحی می‌کنید که سلیقة خودتونه، اما عملکردش رو هم در نظر گرفتید.
جاواسکریپت یا JS(با جاوا فرق داره) محبوب‌ترین زبان برنامه‌نویسی موجوده. شواهد و تحقیقات سال ۲۰۲۱ نشون داده که زبان جاوا اسکریپت ۹ سال متوالی محبوب‌ترین زبان بین برنامه‌نویس‌ها و برای طراحی وبسایت بوده. دلیلش هم اینه که این زبان هم توی بک‌اند کاربرد داره، هم توی فرانت‌اند
خب، حالا این‌هایی رو که گفتیم، می‌خوایم توی یه مثال بیاریم تا درک روند کار ساده‌تر و بهتر بشه.
فرض می‌گیریم بدن ما یه وبسایت یا اپلیکیشنه که باید بسازیمش. برای ساختن این بدن به عناصری مثل استخون، امعا و احشا و پوست و مو و غیره نیاز داریم. این وسط، مثل همون کاری که با اعضای بدنمون کردیم، از HTML استفاده میکنیم تا عناصر سایتمون رو بسازیم. این عناصر ساخته می‌شن تا روی سایتمون ازشون استفاده کنیم. مثلا، عنوان اصلی سایت میاد بالای سایت و پانویس هم اون پایین.
حالا این عناصری که نیاز داشتیم رو ساختیم و باید ظاهر و جای قرارگیریشون رو مشخص کنیم. مثل همون کاری که با بدنمون میکنیم تا ظاهر متفاوت و خوشگل‌تری داشته باشیم؛ مدل مو عوض میکنیم، لباس‌های جور و واجور می‌پوشیم و آرایش رنگ و وارنگ و از این دست کارها. حالا اگر بخوایم همین کارها رو روی سایت پیاده کنیم تا ظاهرش عوض بشه، پای CSS میاد وسط.
CSS ظاهر سایت ما رو که به چشم کاربرهای سایت میاد مشخص می‌کنن. از CSS استفاده میکنیم تا اندازة تصاویر، رنگ متن و پس‌زمینة سایت رو معلوم کنیم.
خب. تا اینجای کار، ساختار، استخوان‌بندی، عضلات و پوست و موی بدن مشخص شدن. حالا وقتشه که این بدن کار کنه. دستا بنویسن، چشما ببینن و پاها کمک کنن این بدن راه بره.
اگه درس علوم رو خوب یا نه حتی معمولی خونده باشید، می‌دونید که این مغزه که فرمان همة این کارها رو می‌ده و این سیستم عصبی ماست که بهمون کمک می‌کنه دنیای اطرافمون رو درک و حس کنیم و باهاش ارتباط بگیریم و تعامل برقرار کنیم.
جاوا اسکریپتم (JS) هم دقیقا نقش همون مغز رو برای وبسایت ما داره. وقتی کاربر یا بازدیدکننده‌ای روی سایت کلیک می‌کنه، به سایت دستور می‌ده که باز شو، وقتی روی دکمة خروج می‌زنه، دستور می‌ده که بسته شو.
حالا که با اصول و مفاهیم کلی آشنا شدید، وقت اینه که در مورد هر کدوم از موارد بالا اطلاعات کسب کنید و اطلاعات خودتون رو غنی کنید و بعد گام به گام شروع کنید به یاد گرفتن هر کدوم و تمرین کردن تا بتونید یه برنامه‌نویس فرانت‌اند بشید و سایت‌هایی طراحی کنید که کاربرها از دیدن و کار کردن باهاشون لذت ببرن.
توی این مسیر هنوز کارهای زیادی مونده و باید حسابی تمرین کنین اما سه قدم اول همیناس که گفتم . برای اونایی که مقاله خارجی میخوان سایت simplelearn ، از سایت‌های اموزشی در مورد برنامه نویسیه که توی لینکی که من گذاشتم کلی کامل توضیح داده و در مورد فرانت اند میگه میگه
