ایوب اخلج
ایوب اخلج
خواندن ۵ دقیقه·۲ سال پیش

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

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

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

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

می توان گفت همه چیز به کاربر بستگی دارد. یعنی کاربر است که باعث ارتباط میان بک اند و فرانت اند می شود.

حالا بد نیست با هم بعضی از مفاهیم را بررسی کنیم تا معنی دقیق آن ها را بدانیم:

سرور

"چیزی" انتزاعی که به آن درخواست های مرورگر می رسد. ما در اینجا زیاد به این جزئیات اهمیت نمی دهیم. کافی است بدانید که کد بک اند روی سرور و همچنین سایر سرویس ها در حال اجرا است. درخواست برای Backend به سرور می رسد و در نهایت به قسمت فرانت اند شما منتقل می شود.

بک اند

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

فرانت اند

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

مرورگر

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

نحوه ارتباط مروگر با بک اند

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

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

چه اتفاقی باید بیفتد تا مرورگر مجبور شود درخواستی ارسال کند؟ آن دسته از درخواست‌هایی که به این دلیل اجرا می‌شوند که کاربر روی پیوند یا کد JS در حال اجرا در پس‌زمینه کلیک کرده است. اما محرک های احتمالی بیشتری وجود دارد:

  • کاربر یک URL را وارد می کند که باعث می شود مرورگر برود و آن را درخواست کند.
  • مرورگر HTML ورودی را می خواند و متوجه می شود که منبعی وجود دارد که برای بارگیری نیاز دارد، مانند یک فایل JS، یک تصویر یا یک فایل CSS. پیش می رود و هر کدام را با یک درخواست جدید HTTP درخواست می کند. معمولاً هنگام بارگذاری یک وب سایت این اتفاق می افتد. (این درخواست ها لازم نیست به همان Backend بروند، می توانید JS را از سایت دیگری بارگیری کنید. مردم دوست دارند از CDN برای این کار استفاده کنند زیرا بسیار سریع و راحت است.)
  • کاربر روی یک پیوند ساده کلیک می کند و صفحه وب بارگیری و ارائه می شود. مرورگر می داند که باید به صفحه جدیدی بروید و URL مربوطه را درخواست می کند.
  • جاوا اسکریپت در سایت اجرا می شود و می خواهد برخی از داده ها را در پس زمینه بارگذاری کند. درخواست‌ها در حال انجام هستند، اما مرورگر این کار را در پس‌زمینه انجام می‌دهد. کل صفحه را بارگذاری مجدد نمی کند. این AJAX است. جاوا اسکریپت می تواند با کلیک کاربر روی چیزی فعال شود و می تواند به مرورگر بگوید که کلیک برای پیمایش به صفحه جدید نبوده است. این می تواند گیج کننده باشد.

این تقریباً تمام سناریوهایی است که می تواند باعث شود یک مرورگر درخواست ها را به بک اند ارسال کند. در هر مورد، درخواست ها و پاسخ های HTTP وجود دارد.

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

بله! یک متخصص بک اند باید در حد نیاز با فرانت اند آشنایی داشته باشد. دلیل آن هم کاملا مشخص است. چون زمانی که شما وارد یک تیم برنامه نویسی می شوید، باید بتوانید با سایر برنامه نویسان ارتباط برقرار کنید تا پروژه جلو برود. از همین رو باید نحوه ارتباط بین بک اند و فرانت اند را بدانید.

پیشنهاد می کنم برای شروع یادگیری برنامه نویسی و حتی تقویت مهارت خود از عضویت ۱۵ روزه رایگان DEVELOPER CLUB آکادمی رستاوا استفاده کنید.


برنامه نویسیجاوا اسکریپتبک فرانتتکنولوژیآموزشی
عاشق دنیای IT هستم و هرچیزی که حس کنم میتونه برام مفید باشه رو شروع میکنم به یادگیری . همیشه خودم رو به روز نگه می دارم و سعی میکنم به جای کلمه ی "نمیدونم" از کلمه ی "هنوز نمیدونم" استفاده کنم.
شاید از این پست‌ها خوشتان بیاید