برنامه نویسی سمت کاربر چیست؟

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

• برنامه نویسی سمت سرور، نوشتن کدی است که با استفاده از زبان‌هایی که توسط سرور پشتیبانی می‌شوند مانند Java، PHP، C#.
• برنامه نویسی سمت کاربر، نوشتن کدی است که برای کاربر اجرا شود و این کار با زبان‌های برنامه نویسی مانند JavaScript انجام و توسط مرورگر اجرا می‌شود.

وقتی دنیای وب به تازگی معرفی شد، تکنیک خوبی بود اگر تمام انرژی خود را برای سرور صرف می‌کردید و خیلی به مرورگر اعتنا نمی‌کردید. به خصوص از آنجا که مرورگرها در آن زمان هنوز کاملا آماده نبودند. حالا جایگاه این موضوع تغییر کرده است به نحوی که ابزارهای مبنی بر مرورگر مثل Angular.js، حالا جایی هستند که اکثر اپلیکیشن‌های تحت وب حضور دارند (جدا از منطق سمت سرور که روز به روز کاهش بیشتری دارد). این کار در حال حاضر توسط مرورگرهای قدرتمند مدرن و صنعتی که موتورهای جاواسکریپت را بسیار سریع اجرا می کنند ساده تر شده است.

پیشینه

توسعه وب فقط به معنی ارتباط است. در ارتباط میان دو طرف از طریق پروتکل HTTP:

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

برنامه نویسی برای هر سمتی، بستگی به کدی دارد که در ماشین خاص سرور یا کلاینت اجرا می‌شود.

مثال ساده

1. کاربر مرورگر وب خود را باز می‌کند (کلاینت).
2. کاربر به وبسایت http://google.com می رود.
3. کلاینت (از طرف کاربر)، به http://google.com (سرور) برای صفحه خانگی درخواست ارسال می کند.
4. سرور متوجه درخواست شده و به کلاینت با چند متادیتا (که به آن تیتر یا header گفته می‌شود) و به دنبال آن با سورس صفحه پاسخ می دهد.
5. سپس، کلاینت سورس صفحه را دریافت می‌کند و آن را به شکل وبسایتی که برای انسان قابل دیدن است تبدیل می‌کند.
6. کاربر در کادر جستجو ”  ​Stack Overflow” را تایپ می‌کند و “Enter” را فشار می‌دهد.
7. کلاینت این داده‌ها را در سرور ثبت می‌کند.
8. سرور این داده‌ها را پردازش کرده و با صفحه‌ای که مطابق با نتایج جستجوست پاسخ می دهد.
9. کلاینت، دوباره این صفحه را برای کاربر تولید می‌کند.

برنامه نویسی سمت سرور

برنامه نویسی سمت سرور، نام کلی انواع برنامه‌هایی است که روی سرور اجرا می‌شوند.

کاربردها

• پردازش ورودی کاربر
• گردآوری صفحات
• ساختاردهی اپلیکیشن‌های وب
• تعامل با حافظه دائمی (SQL، فایل‌ها)

مثالی از زبان‌های برنامه نویسی

• PHP
• Python
• ASP، .Net در C#، C++ یا Visual Basic.
• تقریبا هر زبان برنامه نویسی مانند (C++، C#، (Java به طور خاص برای این کار طراحی نشده اند، اما در حال حاضر اغلب برای خدمات وب سطح کاربردی استفاده می‌شوند.

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

درست مانند برنامه نویسی سمت سرور، برنامه نویسی سمت کاربر نام تمامی برنامه‌هایی است که برای کلاینت اجرا می‌شوند.

کاربردها

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

زبان های برنامه نویسی نمونه

• جاواسکریپت (در درجه اول)
• HTML*
• CSS*
• هر زبان برنامه نویسی که روی دستگاه کلاینت اجرا شده و با یک سرویس کنترل از راه دور در تعامل است، زبان برنامه نویسی سمت کاربر نامیده می‌شود.

HTML و CSS در واقع زبان برنامه نویسی نیستند. آنها بیشتر ترکیبات علامت گذاری (زبان نشانه‌گذاری) هستند که کلاینت با استفاده از آن‌ها صفحه را به کاربر تحویل می‌دهد.

• HTML و CSS در واقع زبان برنامه نویسی نیستند، بنابراین احتمالا نباید آن‌ها را با PHP، ASP و شاید هر زبان برنامه نویسی دیگری مقایسه کرد (C++، C#، جاوا). ActionScript می‌تواند یک مثال خوب دیگر از زبان برنامه نویسی سمت کاربر باشد.
• شما موفق به تشخیص این که چرا سرور، سرور است و کلاینت، کلاینت نشدید. سرور توسط کلاینت شناخته می‌شود نه چیز دیگری. انتظار می رود سرور در هر زمان اجرا شود، اما چنین چیزی در رابطه با کلاینت صدق نمی‌کند.
• من می‌خواهم این مورد را اضافه کنم که محیط سرور بیشتر تحت کنترل است. شما هیچ ایده‌ای از این که کلاینت چیست، ندارید. همچنین وقتی در حال انجام چیزی در سمت سرور هستید، نگرانی‌های امنیتی (برای هر دو طرف) نیز وجود دارد.

برنامه نویسی سمت کاربر بیشتر به رابط کاربری بستگی دارد و این که بیشتر با چه کاربری تعامل داریم. در توسعه وب، رابط کاربری مرورگری است در ماشین کاربر که کد را اجرا می‌کند و معمولا این کار با جاواسکریپت، فلش (البته این فرمت در حال منسوخ شدن است.) و غیره انجام می‌شود. این کد باید در مرورگرهای مختلفی اجرا شود.

وظایف اصلی آن عبارت‌اند از:

ارزیابی ورودی (ارزیابی باید در سرور انجام شود. می توان ارزیابی اضافه‌تری در کلاینت انجام داد تا زمانی که سرعت خیلی اهمیت دارد از تماس‌های سرور جلوگیری شود.)

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

کسی که برنامه نویسی فرانت اند انجام می‌دهد باید به موارد زیر مسلط باشد:

• جاواسکریپت
• CSS
• HTML
• طرحی گرافیکی مبتدی
• Ajax
• شاید Flash
• برخی کتابخانه های جاواسکریپت واسطه مانند JQuery
• طراحی رابط کاربری
• طراحی اطلاعات و غیره.

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

این برنامه نویسی را می‌توان به زبان‌های بسیاری انجام داد:

• PHP
• Java و jsp
• Asp
• Perl
• Python
• Ruby on Rails و غیره

این کد با موارد زیر کار می‌کند:

• درخواست از پایگاه داده
• کدنویسی داده در html
• ورود و به روزرسانی اطلاعات در پایگاه داده
• قوانین و محاسبات کسب و کار

شخصی که برنامه نویسی سمت سرور انجام می‌دهد باید به موارد زیر مسلط باشد:

• برخی از زبان‌های برنامه نویسی که بالاتر به آنها اشاره کردیم
• HTM
• SQL
• شل اسکریپت نویسی در Linux/unix
• OOP
• قوانین کسب‌وکار و غیره.

• کسی که می‌خواهد برنامه نویسی فرانت اند انجام دهد باید با این اطلاعات آشنا باشد. من ترجیح می‌دهم بگویم که شما می‌توانید به خوبی این برنامه نویسی را تنها با HTML، CSS، جاوا اسکریپت و Ajax انجام دهید. گفتن این که برنامه نویسی سمت سرور به تولید محتوای پویا بستگی داشته ولی این عبارت را برای سمت کلاینت تکرار نکنید. چراکه احتمالا باعث برداشت اشتباه می شود.
• “اغلب صفحات وب ایستا نیستند. این صفحات پایگاه داده‌ای را جستجو می‌کنند تا به کاربر، اطلاعات شخصی‌سازی شده و به روز نشان دهند. این سمت، با بک اندی مانند پایگاه داده در تعامل است.” من فکر می‌کنم بهتر است این‌گونه بگوییم: “صفحات را می‌توان به طور پویا و به وسیله پر کردن بخش‌های پویا با محتوای متنوعی که معمولا از پایگاه داده گرفته می‌شود، تولید کرد. بک اند، در واقع هر کدی است که به برنامه نویسی سمت سرور مربوط می شود.
• مجددا به طور کلی من ترجیح می‌دهم بگویم:” فرد بهتر است این موارد را آموخته باشد…” نه این که “باید حتما روی این موارد مسلط باشد”

نظرات دیگران روی این متمرکز است که برنامه نویسی سمت سرور و سمت کلاینت چیست: اغلب از چه زبان‌هایی استفاده می شود، چه کارهایی باید انجام شود و غیره.

این امر کاملا صحیح است، اما من فراموش کردم کمی روی تفاوت‌های میان هر دو نوع برنامه نویسی در برنامه نویسی تحت وب تمرکز کنم. بگذارید این موضوع را مطرح کنم.

امنیت و دسترسی‌ها

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

شما به دلایل امنیتی به کل سیستم دسترسی ندارید. کاربر الزاما نمی‌تواند به تمامی کدهایی که از وب دانلود شده و در ماشین او اجرا می شود اعتماد کند و البته هدف اصلی طراحی محیط سمت کلاینت (مرورگر و جاواسکریپت) این است: ارائه محیط ایزوله‌ای که کد کلاینت در آن می‌تواند اجرا شود ولی نمی‌تواند به هیچ چیزی بیرون از این محیط دسترسی داشته باشد.

برنامه نویسی سمت سرور

محدود کردن دسترسی به هر اپلیکیشن موجود در سیستم، کار خوبی است؛ اما انجام این کار اصلا ضروری نیست. چرا که در انتها شما یا کمپانی شما در کنترل این سیستم خواهید بود. طراحی این “قفس ایزوله”، در ابزارها و زبان برنامه نویسی سمت سرور به صورت پیش‌فرض وجود ندارد؛ اما  می‌توان آن را از طریق نصب (با استفاده از کاربران خاصی که دسترسی‌های محدود دارند و انتخاب پورت‌هایی که نیاز به دسترسی‌های ریشه دارند یا ندارند).

استقرار نرم‌افزار و پلتفرم

در برنامه نویسی سمت سرور، استقرار باید از بیرون کد و با استفاده از برخی ابزارها صورت بگیرد (حتی اگر این ابزارها MAKE INSTALL و یا GIT CLONE باشد)  و این استقرار معمولا به صورت دستی انجام می‌شود و یا حداقل، انتظار می‌رود به شکل نظارت شده انجام شود. سیستمی که (یعنی سیستم عامل یا OS) روی آن استقرار را انجام می‌دهید، معمولا بین ماشین‌های مختلف یک شکل است؛ اما می توان آن را بسته به نیازهای خود تغییر داد.

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

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

وضعیت و اثرات ثانویه

(جهت سلب مسئولیت: این کاملا یک نظریه شخصی است. شاید بخش‌های بسیار اشتباهی در دیدگاه من وجود داشته باشد. این به نظر من صرفا یک فرضیه جالب است.)

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

در برنامه نویسی سمت کاربر ارائه نتایج به کاربر نکته بسیار مهمی است و این همان اثر ثانویه است که اغلب روی صفحه نمایش چاپ می شود. نمی‌توان گفت که هیچ وضعیتی برای این کار درگیر نیست (مثلا کوکی)، بلکه تنها هدف اصلی کد ایجاد یک رابط کاربری برای کاربر است و این اتفاق بدون اثرات ثانویه رخ نمی دهد.

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

این پاسخ، اصلا پاسخ تایید شده و پذیرفته شده‌ای نیست؛ اما من می‌خواستم به عنوان نکته تکمیلی (در پاسخ به سوال “چه زمان از هر کدام از اینها استفاده می‌شود”) موضوعی را مطرح کنم با عنوان:

حفاظت از حقوق معنوی

کد سورسی که روی سمت کلاینت اجرا می شود (مثل جاوا اسکریپت) به سادگی قابل خواندن بوده و می‌توان آن را از طریق مهندسی معکوس به دست آورد.

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