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



visibility  
mode_comment   ۰

Frontend یا فرانت اند، به قسمت قابل مشاهده وب سایت (نرم افزار) توسط کاربران می گویند. فرانت اند کدهای غیر قابل فهم برای کاربران را در قالب ظاهری گرافیکی و بصری به آن ها نمایش می دهد تا بتواند به راحتی از بخش های مختلف سایت استفاده کنند. در این بخش فرم های ورودی اطلاعات، صداها، تصاویر، ویدیوها و به صورت کلی هر چیز دیگری که برای کاربر قابل درک باشد، قرار می گیرند. فرانت اند به دو بخش اصلی طراحی وب و توسعه رابط کاربری تقسیم می شود.

فرانت اند چیست

در بخش طراحی وب طراحان با نرم افزار های گرافیکی مانند فتوشاپ ظاهر سایت را طراحی می کنند. بخش توسعه رابط کاربری مربوط به پیاده سازی ظاهر سایت در قالب کدهای HTML ،CSS و Javascript است. زبان های برنامه نویسی که در فرانت اند به کار می روند، سمت کاربر یا Client Side می باشند. بنابراین کدهای نوشته شده در فرانت اند در مرورگر کاربر پردازش و اجرا می شوند. کاربر به راحتی به این کدها دسترسی مستقیم دارد و می تواند آن ها را مشاهده کند. فرانت اند با بخش بک اند (Backend) در ارتباط مستقیم است و تاثیر بسیاری بر روی تجربه کاربری (UX) دارد.

ویژگی ها و  مهارت های مورد نیاز برای فرانت اند

کسانی که قصد دارند طراح و توسعه دهنده فرانت اند شوند باید ویژگی ها و مهارت های مختلفی را داشته باشند، از جمله :

  • زبان HTML : یک زبان برنامه نویسی نیست بلکه یک زبان نشانه گذاری است که به عنوان هسته و بدنه اصلی صفحات وب به حساب می آید. این زبان برای ایجاد ساختار صفحات وب استفاده می شود.
  • زبان CSS : مخفف عبارت Cascading Style Sheets است که به منظور فرم دهی صفحات وب و اجزای مختلف صفحات وب سایت مانند متن، تصویر، کادرها و ... ساخته شده است. CSS طراحان سایت را قادر می سازد که بدون محدودیت خلاقیت های خود را در طراحی صفحات سایت پیاده سازی کنند.
  • زبان برنامه نویسی Javascript : این زبان برنامه نویسی در سمت کاربر پردازش می شود. برنامه نویس فرانت اند به کمک Javascript می تواند به پویانمایی صفحاتی که با HTML و CSS طراحی کرده است بپردازد.
  • کتابخانه ها و فریم ورک های فرانت اند Javascript : فریم ورک های Javascript امکانات بسیار زیادی و پشرفته ای را در اختیار طراحان فرانت قرار می دهند. از جمله این فریمورک ها می توان به Vu.js، Angular و... اشاره کرد.
  • اصول طراحی واکنشگرا: یک رابط کاربری استاندارد باید به گونه ای باشد که در دستگاه ها و پلتفرم های مختلف، عملکرد اپلیکیشن را دچار اختلال نکند. بنابراین باید بتواند متناسب با نوع دستگاهی که در حال اجرای آن است، واکنش مناسب نشان دهد.
  • نرم افزارهای گرافیکی مانند فتوشاپ : نرم افزارهای گرافیکی مانند فتوشاپ، ایلوستریتور و... در بیشتر مراحل طراحی یک رابط کاربری توسط طراحان فرانت اند مورد استفاده قرار می گیرند.
  • سلیقه و خلاقیت : طراح فرانت اند باید از طرح هایی خلاقانه، کاربرپسند و چشم نواز برای ظاهر یک اپلیکیشن استفاده کند. یک طراح موفق کسی است که بتواند رابط کاربری زیبا منطق بر استانداردهای ظاهری و تجربه کاربری ایجاد کند.
  • آشنایی با اصول تجربه کاربری : توسعه دهنده فرانت اند باید به خوبی نیازهای کاربران را بشناسد. او باید بتواند رابط کاربری یک اپلیکیشن را به گونه ای طراحی کند که کاربران بهترین تجربه را از استفاده از آن به دست آورند.

فرانت اند در دنیای واقعی

front end

برای اینکه مفهوم Frontend را بهتر درک کنید، یک فیلم سینمایی را در نظر بگیرید. ظاهر سایت حکم فیلم سینمایی را دارد که شما مشاهده می کنید.  بازیگران و صحنه های فیلمبرداری شده اجزایی هستند که فرانت اند را تشکیل می دهند و بر اساس دستورات کارگردان در جای مورد نظر قرار می گیرند و به بازیگری می پردازند. دستورات کارگردان، همان کدهای HTML، CSS و Javascript می باشند که رابط کاربری را ایجاد می کنند. البته برای اینکه این فیلم ساخته و اکران شود، عوامل پشت صحنه زیادی مانند تصویر بردار، صدا بردار، کارگردان و... داشته است که شما آن ها را در فیلم نخواهید دید. کدهایی که در پس زمینه سایت در حال اجرا شدن هستند، مانند عوامل پشت صحنه فیلم می باشند که مربوط به بک اند (Backend) هستند.

متخصص جاوا اسکریپت
با جاوا اسکریپت جادوگری کنید! آیا می دونید با زبان جاوااسکریپت می تونید، برای فرانت اند و بک اند وبسایت ها برنامه نویسی کنید؟ همینطور اپلیکیشن دسکتاپ و موبایل بسازید؟ اگر دوست داری اینکارها رو انجام بدی و React, ElectronJS, ReactNative, NodeJS,MongoDB و ... رو تو یه دوره یاد بگیری، متخصص جاوااسکریپت سون لرن رو حتما ببین : متخصص جاوا اسکریپت arrow_back
7Learn Experts
comment دیدگاه کاربران

add_circle ارسال دیدگاه

خوشحال میشیم دیدگاه و یا تجربیات خودتون رو با ما در میون بذارید :