مهدی غفاری
مهدی غفاری
خواندن ۶ دقیقه·۳ سال پیش

فرانت اند چیست ؟ | مسیر یادگیری

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

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

فرانت اند به قسمتی از یک وب سایت میگویند که توسط کاربران دیده میشود و با آن تعامل دارد.

فرانت اند وب سایت به شکل گرافیکی و بصری به کاربران نمایش داده میشوند.  در این قسمت وب سایت ، تصاویر ، ویدئوها و یا به طوری کلی هر چیز دیگری که قابل نمایش باشد وجود دارد.

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

تجربه کاربری در فرانت اند

تجربه کاربری یا   ux مخفف کلمه user experience می باشد. تجربه کاربری به تعامل کاربر با محصول یا خدمت اشاره می کند.هر احساسی مثبت و منفی که هنگام کار کردن با یک محصول یا خدمت را دارید تجربه کاربری آن محصول و خدمت می باشد. مهم نیست آن محصول اپلیکیشن ، سایت ، میز و صندلی و یا قهوه ساز باشد. پس در حالت کلی منظور از تجربه کاربری فقط محصولات دیجیتال نیست.

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

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

برنامه نویس فرانت اند باید فردی خلاق و پویا باشد و تا حدودی با نرم افزار های گرافیکی مثل فتوشاپ و ادوب ایکس دی و … آشنایی داشته باشد. و متناسب با رابط کاربری و همچنین تجربه کاربری شروع به طراحی قالب سایت یا اپلیکیشن نماید. برنامه نویس فرانت اند باید به HTML و CSS و Javascript مسلط باشد تا بتواند متناسب با طرح اولیه خود شروع به کد نویسی کند. برنامه نویسی فرانت اند یک کسب و کار اینترنتی پرطرفدار می باشد.

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

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


مهارت های لازم برای فرانت اند

همونطور که گفتیم برنامه نویسی front end برای چیدن ویترین سایت شما استفاده میشه. برنامه نویسای فرانت اند باید تمام تلاششون را بکنن تا سایتی جذاب و در عین حال کاربردی بسازند. اما ببینیم وظایف برنامه نویس فرانت اند چیست؟

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

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

درآمد برنامه نویس های فرانت اند متفاوت هستند و بسته به نوع کار و مهارتی که دارند متغیر میباشد. ولی در جهان طبق آمار استک اورفلو از 65 هزار دلار تا 110 هزار دلار متغیر است.

در ایران هم اگر در حد قابل قبولی مهارت توسعه فرانت اند وب سایت را داشته باشید میتوانید از 3 میلیون تومن به بالا درآمد کسب کنید.

این درآمد میتواند به بالای ده میلیون تومن در ماه هم برسد که البته به میزان مهارت ها ، دانش و خلاقیت شما بستگی دارد.

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

عمده ترین تفاوتی که بین برنامه نویسی بک اند و فرانت اند وجود دارد این است که کد هایی که برنامه نویسان فرانت اند می نویسند توسط کاربران دیده میشود و کد های بک اند منطقی است که در پس زمینه یک وب سایت اجرا میشود.

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

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

  • در شروع بهتر است شناخت کلی در باره مرورگر ها ، دامنه ها ، DNS ، HTTP و مفاهیم پایه وب داشته باشید
  • یادگیری HTML ، CSS  ، JAVASCRIPT
  • یادگیری اصول طراحی رابط کاربری
  • برای کار با درخواست سمت سرور باید JSON  ، XML ، AJAX  را بلد باشید.
  • با فریم ورک های CSS آشنا باشید ( بوت استرپ )
  • یکی از فریم ورک های جاوا اسکریپت را یادبگیرید:JQUERY ، REACT.JS ، ANGULAR.JS ، VUE.JS
  • NODEJS را بیاموزید.

سوالات متداول

  • آیا شغل فرانت اند شغل خوبی است؟

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

  • حقوق برنامه نویس فرانت اند بیشتر است یا بک اند؟

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

  • آیا با وجود cmsها شغل برنامه نویسی فرانت اند در حال زوال است؟

خیر اصلا، حتی با رشد چشمگیر استفاده از cms هایی مثل وردپرس هم فرانت اند هنوز در حال رشد و گسترش است. دلیل این مسئله اول این است که برای توسعه‌ی سایت در خود cms ها نیز آشنایی با فرانت اند نیاز است و همچنین بسیاری از سایت‌ها تمایل به شخصی سازی سایت خودشان دارند و مهارت برنامه نویسی فرانت اند نیاز است. حتی می‌توان گفت چشم انداز شغلی فرانت اند برای کسانی که قدم در این راه گذاشته‌اند، بسیار روشن است.

  • راحت ترین فریمورک های فرانت اند کدام است؟

در میان فریمورک‌های موجود، VUE ساده‌ترین و راحت‌ترین فریمورک است. همچنین این فریمورک امروزه بسیار پرکاربرد شده؛ چون قدرت زیادی دارد. در مقابل انگولار، مشکلات و سختی‌های زیادی برای توسعه دهندگان دارد.

  • آیا پایتون برای برنامه نویسی فرانت اند مناسب است؟

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




طراحی وبطراحی وب سایتآموزش بوت استرپ
علاقه مند به سطح اینترنت و برنامه نویسی
شاید از این پست‌ها خوشتان بیاید