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

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

فهرست مطالب

  • برنامه نویسی وب سایت
  • فرانت اند چیست؟
  • زبان HTML
  • زبان CSS
  • زبان جاوا اسکریپت




برنامه نویسی وب سایت

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

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

در تعریف عام به ظاهر هر وبسایت یا وب اپلیکیشن که توسط کاربران قابل مشاهده است، فرانت اند می‌گویند. در بخش فرانت اند کدهای غیرقابل فهم برای کاربر، به ظاهر گرافیکی و قابل فهم برای کاربر تبدیل می‌شود. با گسترش و پیشرفت تکنولوژی زبان های برنامه نویسی مختلفی برای فرانت اند ایجاد شده است. اما سه زبان پایه که برنامه نویسان این شاخه باید تسلط داشته باشند، Html و Css و جاوا اسکریپت می باشد. به طورکلی کدهای بخش فرانت اند توسط مرورگر پردازش می‌شوند.

برنامه نویسی فرانت اند به دو بخش طراحی گرافیکی و توسعه دهنده رابط کاربری (UI) تقسیم می شود. در ابتدا طراحان گرافیک، وبسایت یا وب اپلیکیشن را با استفاده از نرم افزار های طراحی مانند ادوب ایکس دی، فیگما، اسکتچ، فتوشاپ و ... پیاده سازی می‌کنند و طرح نهایی را به توسعه دهنده رابط کاربری تحویل می‌دهند. توسعه دهنده رابط کاربری هم این طرح را با استفاده از زبان های برنامه نویسی Html و Css و جاوا اسکریپت پیاده سازی می‌کند. در ادامه مقاله با این زبان ها بیشتر آشنا می‌شویم.



زبان HTML
زبان HTML


زبان HTML

نام HTML کوتاه شده عبارت Hyper Text Markup Language می باشد و به معنی زبان نشانه گذاری ابر متن می باشد. Html زبان برنامه نویسی نمی باشد و به عنوان زبان نشانه گذاری شناخته می‌شود. ساختار تمام صفحات اینترنتی و وب اپلیکیشن ها بر پایه HTML می‌باشد و عضو جدایی ناپذیر در برنامه نویسی فرانت اند می‌باشد. البته صفحاتی که با استفاده از Html ساخته می‌شوند به تنهایی ظاهر جذابی ندارند و برای افزودن ظاهر گرافیکی و جذاب به زبان Css نیاز داریم.




زبان CSS
زبان CSS


زبان CSS

نام CSS کوتاه شده عبارت Cascading Style Sheets می باشد و به معنی شیوه نامه آبشاری می باشد. با استفاده از Css می توانیم صفحات Html را استایل دهی کنیم و به المان های مختلف استایل های مختلفی بدهیم. Css زبان قدرتمندی برای استایل دهی می باشد و استفاده از آن به سطح مهارت و خلاقیت برنامه نویس برمی‌گردد. با استفاده از Css می توانیم وب سایت های واکنشگرا طراحی کنیم.

فریم‌ورک های متنوعی برپایه Css ساخته شده اند که امکانات زیادی را به کاربران ارائه می دهند و علاوه بر این چارچوب استانداردی را ایجاد می‌کنند که در کارهای تیمی و سازمانی کاربردی می باشد و باعث یکسان سازی استایل ها و منظم بودن پروژه ها می‌شود. فریم ورک های بسیار زیاد و متنوعی برای Css وجود دارد که می توانیم به بوت استرپ (BootStrap) ، تیلویند (Tailwind) ، سمنتیک یوآی (Semantic UI) ، یوآی کیت(Uikit) و .. اشاره کرد.



زبان جاوا اسکریپت
زبان جاوا اسکریپت


زبان جاوا اسکریپت

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

امیدوارم این مقاله براتون مفید باشه، شما با چه فریم‌ورک یا کتابخانه هایی کار کردید؟ تجربیات خودتون رو با ما به اشتراک بذارید.