این مطلب فقط درباره برنامه‌های تحت وب نیست، بلکه درباره تمام برنامه‌هایی است که برای ساختنشان به فرانت‌اند و بک‌اند نیاز دارید.
خیلی ساده بخواهیم بگوییم:
فرانت‌اند چیزی است که کاربر می‌بیند. (کدهایی که با کمک HTML، CSS و JS نوشته شده و در مرورگر کار می‌کنند.)
در مقابل بک‌اند مسئولیت اجرای درخواست‌ها در پشت صحنه را ایفا می‌کند.
البته فرانت‌اند و بک‌اند در نهایت با یکدیگر ارتباط برقرار می‌کنند. به بیان دیگر، درخواست‌های سمت کاربر از فرانت‌اند به بک‌اند می‌رود. درآنجا درخواست‌ها با کمک نام کاربری یا روش‌های دیگر، به دیتابیس رفته و به‌جای آن داده دریافت و به کمک فرانت‌اند به دست کاربر می‌‌رسد.
همه این کارها فقط در چند ثانیه انجام می‌شود.
شاید بپرسید چرا بک‌اند؟ زیرا درخواست‌ها در دستگاه کاربر (موبایل یا کامپیوتر) اجرا نمی‌شود و برای اجرا از سرور ریموت کمک می‌گیرد. یعنی شما به‌عنوان توسعه‌دهنده یا ارائه‌دهنده برنامه‌های تحت وب، به یک سرور اختصاصی دسترسی دارید.
کجا این اتفاق می‌افتد و چرا؟
اول از همه باید بدانید که هیچ‌کاری به تنهایی انجام نمی‌شود.
به‌عنوان نمونه یک فروشگاه آنلاین مانند آمازون را تصور کنید. در چنین سایتی کاربران موارد زیادی را می‌بینند. مثلا دسته‌بندی محصول، امکان اضافه کردن محصول به سبد خرید و دیدن سبد خرید، اما این دادهها چگونه فراخوانی می‌شوند؟ آیا روی مرورگر ذخیره می‌شوند یا روی کامپیوتر شما؟
در واقع هیچ‌کدام!
این دادهها از سوی آمازون ارائه می‌شود و برای همه کاربران داده‌های مشابهی در دسترس است. در کنار این موارد، آمازون باید بتواند این دادهها را به عنوان اطلاعات محصول مدیریت کرده و آن‌ها را کم، زیاد یا به‌روز رسانی کند.
بر همین اساس، دادهها باید روی سرور آمازون ذخیره شوند و این همان چیزی است که بک‌اند نامیده می‌شود. مدیریت دادهها یا منطق آن‌ها چیزی است که به‌صورت مرکزی در پشت برنامه و خارج از دستگاه کاربر اتفاق می‌افتد.
از سوی دیگر، در فرانت‌اند همه‌چیز مستقیما با رابط کاربری در تعامل و قابل مشاهده است.
رابط کاربری مستقیما روی دستگاه کاربر اجرا می‌شود. بنابراین مهم نیست که در مورد یک برنامه تحت وب یا اپ موبایلی صحبت می‌کنیم، در هر حال رابط کاربری در صفحه نمایش دستگاه متعلق به کاربر ما اجرا می‌شود.
در این بخش هر اتفاقی که می‌افتد، توسط کدهای فرانت‌اند کنترل می‌شود.
البته ، همانطور که در بالاتر اشاره کردیم، فرانت‌اند با بک‌اند در ارتباط است. این ارتباط به کمک درخواست‌های Http برقرار می‌شود. (Http requests)
به‌عنوان نمونه: فرانت‌اند درخواست ورود دادهها را به بک‌اند می‌فرستد. بک‌اند اعتبار دادهها را تایید و آن‌ها را در دیتابیس ذخیره می‌کند.
توجه داشته باشید که کار بک‌اند فقط ذخیره داده و دیتابیس نیست!
دیتابیس می‌تواند بخشی از بک‌اند باشد اما همه آن نیست. منطقی که روی سرور بک اند اجرا می‌شود، بخش حیاتی بک‌اند به‌شمار می‌آید، زیرا بیشتر برنامه‌های تحت وب کدهایی دارند که نمی‌تواند یا نباید سمت کاربر اجرا شوند.
اینجا به بعضی از این نمونه‌ها اشاره کرده‌ایم:
- عملیات زمان‌بر: که باید به‌خاطر UI آن را کوتاه کرد.
- تعامل با سیستم فایل: که دسترسی به آن در مرورگر مجاز نیست.
- اعتبارسنجی ورودی کاربر در سمت سرور: به این خاطر که کاربران می‌توانند کد سمت فرانت را مشاهده و ویرایش نمایند (و اعتبارسنجی آن قابل اعتماد نیست).
- هر کدی که با یک بانک اطلاعاتی در تعامل باشد، یا از اعتبار (کلیدهایی) استفاده کند که نباید در معرض بازدید کنندگان وب سایت قرار بگیرد.
فرانت‌اند باید فقط حاوی کدی باشد که مربوط به به‌روزرسانی رابط کاربری است و باید زمینه ارسال و دریافت داده، ارائه داده به کاربر و تعامل با رابط کاربری را فراهم کند.
حذف کامل اطلاعات و دادهها، ارتباط با بانک اطلاعاتی، سیستم فایل یا مواردی از این دست، باید در بک‌اند کنترل شود.
باید چه چیزهایی یاد بگیریم؟
برای توسعه دهنده فرانت‌اند، یادگیری زبان‌های مختلفی لازم است.
برای ایجاد برنامه‌های تحت وب به زبان‌هایی نیاز دارید که بتوانید سایتی را ایجاد، اجرا و در مرورگر نمایش دهید. به همین دلیل به یادگیری فریم‌ورک‌ها و زبان‌های زیر نیاز دارید:
HTML برای ساخت اسکلت سایت
CSS برای استایل
JavaScript برای منطق سمت کاربر
اما شما به ندرت میتوانید فقط با کمک همین موارد برنامه‌های بزرگ تحت وب بسازید. در حقیقت شما علاوه بر موارد بالا، به یکی از فریم‌ورک‌های محبوب زیر نیز نیاز دارید:
React.js
Angular
Vue.js
البته اگر بخواهید به سراغ برنامه‌نویسی تلفن همراه بروید باید از Java یا Kotlin برای Android یا Swift یا ObjectiveC برای توسعه iOS استفاده کنید.
زبان‌های دیگری مانند Flutter ، React Native یا Ionic (Angular, React) نیز می‌تواند به شما در ساخت اپ‌های موبایلی و تحت وب کمک می‌کند.
اگر می‌خواهید به سراغ بک‌اند بروید، باید یک زبان برنامه‌نویسی را انتخاب کنید که روی سرور اجرا شود.
گزینه‌های محبوب شما در بک‌اند عبارتند از:
NodeJS که به راحتی مبتنی بر JavaScript است.
PHP
Python
آیا برنامه‌های تحت وب را می‌توان فقط با یک سمت (بک‌اند یا فرانت‌اند) نوشت؟
بیشتر سایت‌ها و اپ‌های موبایلی سمت بک‌اند و فرانت دارند، اما آیا ممکن است برنامه‌ای داشته باشیم که فقط یک سمت داشته باشه؟ یعنی تمام بخش‌های آن در قسمت بک‌اند یا فرانت‌اند باشد؟
از نظر تئوری، شما میتوانید برنامه‌های تحت وب یا اپ موبایلی بسازید که فقط دارای بک‌اند یا فرانت‌اند باشند.
برنامه‌ای که فقط فرانت‌اند دارد، کارایی محدودی نیز خواهد داشت و شما فقط میتوانید برنامه هایی بنویسید که نیازی به ذخیره یا رفت و برگشت فایل یا داده ندارند.
مثلا صفحات نمونه کار که در آن خدمات یک شرکت به سادگی توصیف شده‌اند. یا وبلاگهایی که به راحتی میتوانید تمام مقالات را فقط با HTML و CSS ، JS بنویسید. شما در این حالت به پایگاه داده نیازی ندارید.
درباره بک‌اند تنها چطور؟
در نگاه اول وجود چنین برنامه‌ای بی‌معناست. برنامه تحت وب بدون فرانت‌اند و رابط کاربری قابل استفاده نیست و کاربر نمی‌تواند چیزی را ببیند. این گزاره درست است، اما تمام برنامه‌هایی که ساخته می‌شوند، مورد استفاده کاربر نهایی قرار نمی‌گیرد.
ممکن است یک API ساده (REST) بسازید که توسط سایر توسعه دهندگان قابل استفاده باشد.
عنوان نمونه Google Places API به شما امکان می‌دهد آدرس‌ها را به مختصات و برعکس (و موارد دیگر) تبدیل کنید.
این API فقط برای تبادل داده ایجاد شده است.
شما میتوانید چنین API را با کمک بک‌اند به تنهایی بسازید.
در مورد Fullstack چه؟
اگر در حال توسعه وب هستید ، ممکن است درباره توسعه‌دهنده کامل یا فول‌استک (Fullstack) نیز شنیده باشید.
به این معنا که شما (یعنی توسعه دهنده) فقط روی یک سمت (بک‌اند یا فرانت‌اند) متمرکز نمی‌شوید. در عوض زبان‌های برنامه نویسی و چارچوب‌های هر دو سمت را آموخته‌اید و میتوانید یک برنامه تحت وب کامل را به تنهایی بسازید.
این موضوع به خصوص اگر فریلنستر باشید یا در یک استارت‌آپ کوچک کار کنید، می‌تواند مزیت بزرگی برای شما به شمار بیاید.
ترجمه آزاد: frontend vs backend
