Front End  (فرانت اند)

Front End یا فرانت اند در یک وب‌سایت یا وب‌اپلیکیشن به بخش‌هایی اتلاق می گردد که کاربران به طور مستقیم با آن‌ها در تعامل هستند. مواردی مثل رنگ‌ها و استایل متن‌ها، تصاویر، جداول و گراف‌ها، دکمه‌ها، رنگ‌ها و نوار وضعیت صفحات وب، همگی مربوط به Front End یا سمت کلاینت اپلیکیشن هستند.

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

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

پیش نیازهای برنامه نویسی فرانت اند یا Front End

  • یادگیری زبان‌های برنامه نویسی HTML ،CSS و جاوا اسکریپت
  • آشنایی با کتابخانه‌ها و فریمورک‌های فرانت اند Javascript
  • آشنایی با اصول طراحی واکنش‌گرا
  • یادگیری نرم افزارهای گرافیکی مانند فتوشاپ
  • داشتن سلیقه و خلاقیت
  • آشنایی با اصول تجربه کاربری

مزایای Front-End :

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

معایب برنامه نویسی Front End

  • تغییرات متعدد و مشکلات مربوط به روز‌ نگه‌داری دانش
  • عدم امکان مرزبندی میان توسعه فرانت اند و دیگر زمینه‌ها
  • توسعه شخصی‌سازی شده
  • عدم هم‌ترازی با سیستم‌های دارای محاسبات

مشاغل مهم Front End  (فرانت اند)

  • Front-End Developer
  •  Front-End Engineer با نام مستعار JavaScript Developer یا Full Stack JavaScript Developer))
  • CSS / HTML Developer
  • Front-End Designer Web
  • توسعه دهنده / مهندس UI (User Interface)
  • Mobile / Tablet Front-End Developer
  • Front-End Expert SEO
  • Front-End DevOps
  • Test-End Testing / Q
برنامه نویسی فرانت اند

زبان‌های برنامه‌نویسی فرانت اند

زبان HTML

HTML  یکی از زبان‌های برنامه‌نویسی نشانه‌گذاری است که برای توسعه فرانت اند سایت‌ها و وب اپلیکیشن‌ها کاربرد دارد. این زبان به اختصار از عبارت Hypertext Markup Language برگرفته شده است.

مزایای استفاده از HTML در فرانت اند
  • به صورت گسترده در صفحات وب استفاده می‌شود.
  • در اکثر مرورگرهای رایج پشتیبانی می‌شود.
  • مدت زمان لازم برای یادگیری آن کوتاه است.
  • در ویندوز قابل استفاده است و هیچ نیازی به خرید نرم‌افزارهای اضافی وجود ندارد.
  • سینتکس بسیار انعطاف‌پذیری دارد.
  • امکان استفاده از انواع قالب را دارد.
  • خدمات آن بدون هزینه اضافی و رایگان است.
معایب استفاده از HTML در فرانت اند:
  • امکان ساخت صفحات پویا بااستفاده از HTML وجود ندارد.
  • ایجاد ساختار برای اسناد HTML با چالش‌های متفاوتی همراه است.
  • باتوجه به ابتدایی و ساده بودن این زبان، امکانات امنیتی محدودی برای آن وجود دارد.

زبان برنامه‌نویسی CSS

CSS برگرفته از عبارت Cascading Style Sheets می باشد و به وسیله آن امکان ایجاد یک ظاهر مناسب و کاربرپسند برای استایل وبسایت خود وجود دارد.

مزایای استفاده از CSS در فرانت اند
  • صرفه‌جویی در زمان
  • نگهداری و بقای آسان
  • امکان تغییر استانداردهای وب
معایب استفاده از CSS در فرانت اند
  • احتمال بروز مشکلات میان مرورگرها
  • معماری چند سطحی و ایجاد سردرگمی

 جاوا اسکریپت  Javascript

Java Script که به طور خلاصه به آن JS هم می‌گویند، یک زبان سطح بالای تفسیری می‌باشد. این زبان به گونه‌ای طراحی شده که به کمک آن پیاده‌سازی ویژگی‌های سخت و پیچیده در صفحات، وجود دارد.

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

علاوه بر این موارد که مهم‌ترین زبان‌های کاربردی در زمینه طراحی سمت کاربر هستند، زبان‌های ذیل نیز در این زمینه وجود دارند :

  • React
  • JQuery
  • TypeScript
  • Elm
  • SASS

آموزشگاه سبحان ، با برگزاری دوره ی جامع طراحی صفحات وب به آموزش تمامی زبان های برنامه نویسی FRONT END خواهد پرداخت .