برنامه نویسی فرانت اند چیست؟

شما اکنون یک صفحه وب را باز کرده اید، آنچه می بینید فارغ از محتوای آن، محصول کار Front end است. برای رسیدن به یک وب سایت پویا، دو نوع تخصص اصلی لازم است که یکی از آنها Front end و دیگری Back end است.

کدنویسیِ هر آن چیزی که مربوط به رویه وب سایت می شود، یعنی همان چیزی که کاربر آن را می بیند، کاری است که شما به عنوان یک Front End Developer انجام می دهید. در واقع شما با نوشتن کدهایی که برای کاربران یک وب سایت مفهوم نیست -اما قابل دسترسی است- سایتی را می سازید که کاربر به راحتی از بخش های مختلف آن استفاده می کند. شما یک قالب گرافیکی و احتمالا به لحاظ بصری چشم نواز و کاربرپسند را با کدهایتان ساخته اید.

ابزار موردنیاز یک فرانت اند کار

طراحی وب شامل دو بخشclient و server است. ما وقتی نیاز به صفحه وب داریم، در مرورگر خود یعنی در بخش client آدرسی را تایپ می‌کنیم. آدرس به سمت server می رود. Server چک می کند و می بیند فایل های موردنیاز برای پاسخ به این درخواست کدامها هستند، آن فایل ها را برای نمایش به سمت client می فرستد. تصویری که به شما نشان داده می شود در واقع تصویری است که از تفسیر زبان html به وجود آمده است و با css رنگ و لعاب گرفته و javascript آن را پویا و تعاملی کرده است.

بنابراین برای Frontend دست‌کم به این سه ابزار نیاز دارد.

زبان html مخفف HyperText Markup Language یا زبان نشانه‌گذاری فرامتنی (ابرمتنی) است و با آن می توان ساختار یک صفحه وب را نوشت. همان‌طورکه از اسمش پیداست،html یک زبان نشانه‌گذاری است نه زبان برنامه نویسی. یک سند html شامل عناصری مثل تیتر، پاراگراف متنی، جدول و عکس است.

زبان Css مخفف Cascading Style Sheets و زبانی برای مشخص کردن ویژگیهای ظاهری یک وب سایت است. نزدیک‌ترین معنایی که می‌شود برایش درنظرگرفت «برگه‌های سبک‌دهی آبشاری» یا «شیوه‌نامه‌های آبشاری» است. CCS هم زبان برنامه نویسی به حساب نمی‌آید بلکه همان‌طور که از اسمش پیداست یک زبان سبک‌دهی است.

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

با کمک زبان‌های نشانه‌گذاری CCS و HTML می‌توانید یک سایت ساده‌ استاتیک طراحی کنید. سایتی که کاربر نمی‌تواند تعاملی با آن برقرار کند. به همین دلیل فرانت اند کارها دست به دامن زبان جاوا اسکریپت می‌شوند.

در کنار اینها بهتر است به خوبی با کتابخانه های Css مثل فریمورک Bootstrap آشنایی داشت. آشنایی با Jquery نیز استفاده از Js را راحت تر می کند. همچنین یادگیری فریم‌ورک‌هایی مثل React، Angular، Vue.js بسیار مهم و کاربردی است.

کار فرانت اند کجا شروع می شود؟

در بخش طراحی وب، طراحان (UI Designer ها) با نرم افزار‌های گرافیکی مانند فتوشاپ (Photoshop) یا (Sketch) ظاهر سایت را طراحی می‌کنند. آنها دست به کد نمی شوند و پس از آن نوبت به فرانت اند دولوپرها می رسد که این طراحی را با زبان های برنامه نویسی یادشده، پیاده سازی کند.

تفاوت فرانت و بک

یک Front End Developer برای تکمیل کارش در طراحی سایت به Back End Developer نیاز دارد. برنامه نویسی بک اند Back End) ) مربوط به کدنویسی و برنامه نویسی هر آن چیزی است که کاربر آن را نمی بیند یعنی کارهای پشت صحنه وب سایت است. وظیفه‌ یک برنامه نویس بک اند، برنامه نویسی چیزهایی است که هسته اصلی یک وب سایت هستند به عنوان مثال وقتی که یک وب سایت، مقالات را از دیتابیس دریافت می کند، یک امر مربوط به بک اند است. بسیاری برای توضیح بیشتر درباره کار بک اند از سینما یا تئاتر کمک می گیرند و بک اند در طراحی سایت را معادل «پشت صحنه» سینما یا تئاتر می دانند و «بازیگران» معادل فرانت اند.

فعاليت بک اند نحوه کارکرد، به روز رساني و تغييرات سايت است یعنی همان چيزهايي است که براي کاربران سايت قابل مشاهده نيست چون مستقيما با سرور در ارتباط است مثل پايگاه داده هاي سایت و سرور و راه هاي ارتباطي آنها.