فرض کنید بین دوگروه موجود فضایی قرار گرفته اید که گروه اول فقط تصاویر و قالب‌های گرافیکی و نوشته‌ها را می‌فهمند و گروه دوم فقط کد می‌فهمند و شما هر دو مورد را می‌فهمید و به نوعی مترجم بین این دوگروه هستید. حالا به زمین برگردید، دسته اول مشتریان و مخاطبان وبسایت هستند، دسته دوم ابزارهای طراحی و شما به عنوان طراح فرانت همان نقش مترجم را بازی می‌کنید.
یعنی چیزی که کاربر در صفحه لپتاپش می‌بیند را در واقع با کدنویسی می‌سازید. در حالت کلی تمامی پارامترها مانند صداها، فایل های تصویری و ویدیویی، عکس‌ها، داده‌ها و غیره که توسط کاربر قابل تماشا می باشند در قسمت فرانت اند به دوقسمت اصلی طبقه بندی می گردد که اولین آنها در زمینه طراحی وب و دیگری توسعه رابطه کاربری می باشد.
هر بار که یک کاربر از سایت شما بازدید می کند، از طریق طراحی سایت خود درحال برقراری ارتباط با آن هستید.چگونه این اتفاق می افتد؟
برقراری ارتباط از طریق وب سایت شما در سطوح و رتبه های مختلف و در محدوده ای از متن، تصاویر و ساختار رنگ بندی ، عناوین و دکمه ها انجام می شود.
تمام هستی سایت بر پایه تجربه کاربر است .
برای اینکه مفهوم Front end را بهتر درک کنید، یک فیلم سینمایی را در نظر بگیرید. ظاهر سایت حکم فیلم سینمایی را دارد که شما مشاهده می‌کنید. بازیگران و صحنه‌های فیلمبرداری شده اجزایی هستند کهFront end را تشکیل می‌دهند و بر اساس دستورات کارگردان در جای مورد نظر قرار می‌گیرند و به بازیگری می‌پردازند. دستورات کارگردان، همان کدهای HTML، CSS و Java script می‌باشند که رابط کاربری را ایجاد می‌کنند.
منظور از تجربه کاربری یا User Experience همان احساسی است که به کاربر در زمان روبرویی با سایت شما دست می‌دهد. بنابراین یک فرانت‌اند کار باید با نیازهای کاربر به خوبی آشنا باشد تا سایت یا برنامه‌ای طراحی کند که کاربر هنگام کار با آن احساس خوبی داشته باشد.
کاربران به طور متوسط 10 ثانیه زمان خود را بر روی سایت شما صرف می کنند.واقعیت این است که کاربران مدت زمان زیادی را در سایت شما صرف نمی کنند که البته این موضوع جدیدی نیست.
آیا کاربران در 10 ثانیه متوجه می شوند که سایت شما چه فعالیتی دارد؟ چه محتوایی تولید می کند و فلسفه سایت شما چیست؟ برای پاسخگویی به اینها، در مورد سوالات زیر فکر کنید:
پیام کلیدی سایت من چیست؟
آیا کاربر در نگاه اول این پیام را درمیابد؟
آیا متون و دکمه ها درجای درستی قرار داده شده اند؟
آیا رنگ به کار برده شده در طراحی سایت با هم همخوانی دارند؟
تصاویر چه چیز را بیان می کنند و چگونه پیام کلیدی من را تماما می رساند؟
آیا وب سایت به طور کلی در اولین برداشت حس خوبی را به کاربر انتقال می دهد؟
برای اینکه مفهوم Front end را بهتر درک کنید، یک فیلم سینمایی را در نظر بگیرید. ظاهر سایت حکم فیلم سینمایی را دارد که شما مشاهده می‌کنید. بازیگران و صحنه‌های فیلمبرداری شده اجزایی هستند کهFront end را تشکیل می‌دهند و بر اساس دستورات کارگردان در جای مورد نظر قرار می‌گیرند و به بازیگری می‌پردازند. دستورات کارگردان، همان کدهای HTML، CSS و Java script می‌باشند که رابط کاربری را ایجاد می‌کنند.
فرانت اند به دو بخش اصلی طراحی وب و توسعه رابط کاربری تقسیم می‌شود .در بخش طراحی وب، طراحان با نرم افزار‌های گرافیکی مانند فتوشاپ ظاهر سایت را طراحی می‌کنند. اما بخش توسعه رابط کاربری مربوط به پیاده سازی ظاهر سایت در قالب کدهای HTML ،CSS و Java script است. زبان‌های برنامه نویسی که در فرانت به کار می‌روند، سمت کاربر یا Client Side می‌باشند. بنابراین کدهای نوشته شده در فرانت در مرورگر کاربر پردازش و اجرا می‌شوند. یعنی کاربر به راحتی به این کدها دسترسی مستقیم دارد و می‌تواند آنها را مشاهده کند. فرانت اند با بخش بک اند (Back end) در ارتباط مستقیم است و تاثیر بسیاری بر روی تجربه کاربری (UX) دارد.
دانش ، فنون موردنیاز و مهارت‌ها ی توسعه‌دهنده فرانت‌اند(Front End)
در حقیقت دانش و فنون با مهارت‌ها دو آیتم مجزا است که هر کدوم قابل بحث می‌باشند. دانش و فنون مورد نیاز و مهارت‌های توسعه‌دهنده فرانت‌اند( Front End Developer ) به شرح زیر است:
وظایف و مسئولیت‌های یک توسعه‌دهنده فرانت‌اند( Front End Developer )
