اگر به تازگی علاقهمند به یادگیری برنامه نویسی شدهاید، احتمالا بارها اصطلاحات پرکاربردی همچون فرانت اند و بک اند شنیده باشید درحالی که معنی و مفهوم دقیق آنها را نمیدانستید. اکنون اگر کنجکاو هستید و این پرسش را در ذهن خود مرور میکنید که برنامه نویسی فرانت اند چیست؟ و به چه کسی برنامه نویس فرانت اند میگویند؟ تا انتهای این مقاله همراه ما باشید تا یک بار برای همیشه این مفهوم پایهای را به صورت کامل و ساده متوجه شوید و به ذهن بسپارید.
صداها، تصاویر، ویدیوها و فرمهای ورودی اطلاعات و… که توسط کاربر با ظاهر گرافیکی خاصی دیده میشوند، جزئی از فرانت اند محسوب میشوند. نقطهی مقابل فرانت اند، Back-end است. کارهای مربوط به کدنویسی که از دید کاربر خارج هستند و کاربر آنها را مستقیما مشاهده نمیکند، مربوط به این بخش است. برای درک بهتر این مفاهیم به مثالی که در ادامه بیان میشود توجه کنید.
یک فیلم سینمایی را در بگیرید. در یک فیلم ما فقط صحنه و بازیگرانی را که در آن نقش بازی میکنند میبینیم اما این موضوع باعث نمیشود نقش کارگردان، فیلمنامهنویس، طراح صحنه و سایر عوامل را انکار کنیم. درست است؟!
خب در مورد طراحی و توسعهی سایت هم قضیه دقیقاً همین شکلی است. در حقیقت بک اند در پشت صحنه شرایط را فراهم میکند تا فرانت اند و کاربر با هم تعامل داشته باشند.
برای مثال، زمانی که شما بهعنوان کاربر در یک سایت حساب کاربری میسازید، «برنامه» اطلاعاتتان را در «دیتابیس»هایی که روی «سرور» قرار دارند، ذخیره میکند. بهاینترتیب شما هر بار با ورود به حساب کاربریای که اعطلاتتان در آن ذخیره شده، میتوانید از امکانات سایت استفاده کنید.
بنابراین میشود گفت بک اند هستهی اصلی تمام رخدادهای کامپیوتری است. درست مثل یک کوه یخ که حجم بیشتری از آن زیر آب است و ما آن را نمیبینیم.
توسعه دهندگان فرانت اند به چه مهارت هایی نیاز دارند؟
دیهی است که مهارت های مختلفی برای سطوح مختلف توسعه فرانت اند مورد نیاز است و این مهارت ها به 4 فاز تقسیم بندی می شوند:
1. مهارت های توسعه دهنده فرانت اند برای سطح مبتدی
HTML (مخفف Hyper Text Markup Language به معنی زبان اشاره گذاری متنی)
و CSS می توانند بنیادی ترین قسمت توسعه وب فرانت اند باشند. HTML «استخوان بندی» صفحه وب است در حالیکه CSS طراحی رنگی به صفحه وب اضافه می کند و ظاهر وب را می سازد. متن، تصاویر و طراحی رنگی که در صفحات وب می بینیم از طریق HTML+CSS اجرا شده اند. تسلط داشتن بر HTML و CSS برای مبتدی ها ضروری است.
مهارت های توسعه فرانت اند – HTML
به شکل ساده HTML برای طرح بندی به کار می رود و شما باید در زمینه div، جدول ساختن، ul، li، span، فونت و غیره مهارت داشته باشید. در این ضمن CSS برای تکمیل طراحی و نمایش HTML به کار می رود که به آن «استایل CSS » می گوییم.
به این منظور شما باید با موارد زیر آشنا باشید: float، position، height، width، overflow، margin، padding و سایر اصطلاحات. یادگیری این دو زبان نسبتاً آسان است و آنها ارتباط نزدیکی به سبک طرح بندی دارند.
• جاوااسکریپت
یکی دیگر از مهارت های بنیادی است که توسعه دهندگان فرانت اند باید بر آن تسلط داشته باشند. از این مهارت در زبان سمت کاربر برای اضافه کردن پویایی به صفحات HTML استفاده می شود که باعث ایجاد تجربه جستجوی بی دردسر و عالی از طریق افزودن برخی افکت ها از قبیل افکت های جابجایی تبلیغات، افکت های شناور شدن تبلیغات، افکت های blinds، افکت های یکپارچه اسکرول شدن و ... برای کاربران می شود.
طبق بررسی استک اوورفلو ، جاوااسکریپت محبوب ترین و پیشگام ترین زبان در میان توسعه دهندگان است و با در دست داشتن 62.5% سهام در بخش زبان برنامه نویسی بازار را زیر سلطه خود دارد.
استفاده از JQuery در طراحی فرانت اند وب سایت
jQuery یکی از کتابخانههای کاربردی جاوا اسکریپت است.این کتابخانه گستردهای است که با استفاده از آنها میتوانید توسعه وب سایت را به راحتی و با سرعت بیشتری انجام دهید. با استفاده از این کتابخانه، میتوانید از افزونههای از پیش ساخته شدهبرای سایت خود استفاده کنید و در صورت نیاز آنها را شخصی سازی کنید
میتوانید به راحتی از فریم ورکهای جاوا اسکریپت برای ایجاد برنامه جاوا اسکریپت خود استفاده کنید. براساس نیاز، فریم ورکهای مختلفی وجود دارند که معروفترین آنها AngularJS ، Backbone ، Ember و ReactJS است. این فریم ورکها همراه با کتابخانههایی مانند jQuery استفاده میشوند و باعث میشوند سرعت توسعه و کد نویسی شما افزایش یابد
طراح فرانت اند باید از طرح هایی خلاقانه، کاربرپسند و چشم نواز برای ظاهر یک اپلیکیشن استفاده کند. یک طراح موفق کسی است که بتواند رابط کاربری زیبا منطق بر استانداردهای ظاهری و تجربه کاربری ایجاد کند. ایجاد همین تفاوتهای ظاهری و طرحهای جذاب است که کار شما را از سایر رقبا جدا میکند.