Skip to content
کادوس
  • صفحه اصلی
  • درباره ما
  • فروشگاه
  • استخدام
  • خدمات ما
  • وبلاگ
  • مشتریان ما
  • تماس با ما
Site Search
فرانت اند وبلاگ

تفاوت بک اند و فرانت اند (Backend vs Frontend)

  • فروردین 15, 1401بهمن 27, 1400
  • by کادوس

فرانت اند (Front-end) چیست؟

فرانت اند (frontend) وب سایت در واقع همان چیزی است که شما در مرورگر خود می‌بینید و با آن ارتباط برقرار می‌کنید. همچنین با عنوان client-side نیز شناخته می‌شود.که شامل تمامی مواردی می‌شود که کاربر مستقیما تجربه می‌کند: از متن و رنگ گرفته تا دکمه‌ها، تصاویر و منوهای ناوبری.

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

HTML

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

CSS

CSS زبانی است که HTML را همراهی می‌کند و سبک محتوای وب سایت از جمله طرح، رنگ، فونت و غیره را تعریف می‌کند.

JavaScript

جاوا اسکریپت یک زبان برنامه‌نویسی است که برای عناصر تعاملی‌تر مانند منوهای کشویی، ماژول‌ پنجره‌ها و فرم‌های تماس استفاده می‌ شود.

این سه مورد با هم، نمایش بصری سایت که به کاربر ارائه می‌شود را تولید می‌کنند. توجه داشته باشید، درست است که فرانت اند با جنبه بصری و تعاملی سایت سروکار دارد، اما طراحی سایت نیست!

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

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

بک اند (Backend) و تفاوت آن با فرانت اند

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

بک اند یا server-side، بخشی از وب سایت است که دیده نمی‌شود. این بخش وظیفه ذخیره و سازماندهی اطلاعات و در واقع اطمینان از عملکرد تمامی موارد در client-side را بر عهده دارد. در حقیقت، بک اند با فرانت اند ارتباط برقرار می‌کند .و اطلاعات را ارسال و دریافت می‌کند و هر زمانی که فرم تماسی را پر می‌کنید. آدرس وب سایتی را وارد می‌کنید یا خریدی انجام می‌‌دهید. بطور کلی هر تعاملی در client-side انجام می‌دهید.مرورگر شما درخواستی را به server-side ارسال می‌کند و اطلاعات از کدهای فرانت اند بازگردانده شده و مرورگر می‌تواند آنها را نمایش دهد.

سایت شما برای تبدیل شدن به یک سایت داینامیک و پویا، سایتی که محتوای آن را بتوان بر اساس اطلاعات پایگاه داده تغییر داد .و با ورود کاربر اصلاح نمود، به تجهیزات بک اند اضافی نیاز دارد. وب سایت شما به دیتابیسی (از جمله MySQL، SQL Server، Postgres SQL و Oracle) نیاز دارد تا تمام اطلاعات مشتری‌ها و محصولات را مدیریت کند. در دیتابیس، محتوای سایت را با ساختاری ذخیره می‌شود که بازیابی، سازماندهی، ویرایش و ذخیره اطلاعات آسان باشد. و این کار بر روی ریموت کامپیوترهایی انجام می‌شود که سرور نامیده می‌شوند.

وبلاگ

بوت استرپ چیست؟

  • تیر 7, 1400تیر 8, 1400
  • by کادوس

بوت استرپ چیست؟ – بوت استرپ (Bootstrap) مجموعه ابزار قدرتمندی متشکل از ابزارهای CSS، HTML و JavaScript برای ایجاد و ساخت صفحات وب و برنامه‌های وب است. این مجموعه در واقع یک پروژه رایگان متن باز است که GitHub میزبانی می‌شود و در اصل توسط و برای توییتر ایجاد شده است و توسط NASA و MSNBC و دیگر سایت‌های مطرح استفاده شده است.

وب سایت رسمی، بوت استرپ Bootstrap آن را اینگونه تعریف می‌کند:

“محبوب‌ترین چارچوب CSS، HTML و JS برای توسعه پروژه‌های واکنش‌گرا و mobile-first در وب.”

محبوبیت بوت استرپ پس از انتشار نسخه متن باز در سال 2011، خیلی سریع و بدون دلیل افزایش یافت. طراحان و توسعه‌دهندگان وب، آن را دوست دارند زیرا انعطاف‌پذیر است و کار با آن آسان است و مزیت اصلی آن، این است که از نظر طراحی واکنش‌گرا است و استفاده از آن آسان و یادگیری آن بسیار سریع است. بوت استرپ را می‌توان با هر IDE یا ویرایشگر و هر فناوری و زبان سرور، از ASP.NET گرفته تا PHP و Ruby on Rails استفاده نمود.

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

به عبارت دیگر، بوت استرپ یک چارچوب front-end قدرتمند است که برای ایجاد وب سایت‌ها و برنامه‌های وب مدرن از آن استفاده می‌شود. این منبع رایگان است و در عین حال دارای الگوهای HTML و CSS بسیاری برای عناصر رابط UI مانند دکمه‌ها و فرم‌ها است و از پسوندهای JavaScript نیز پشتیبانی می‌کند.

بوت استرپ چیست؟

6 مزیت بوت استرپ برای توسعه دهندگان وب

1- گرید و شبکه واکنشگر

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

2- تصاویر واکنشگر

یکی از ویژگی‌های خوب بوت استرپ، واکنش‌گر بودن تصاویر است. در این مجموعه کد اختصاصی ارائه شده است که با استفاده از آن اندازه تصاویر بر اساس اندازه صفحه نمایش به صورت خودکار تغییر می‌کند. کافیست کلاس img-responsive را به تصاویر خود اضافه کنید و قوانین از پیش تعریف شده CSS باقی ماجرا مدیریت خواهد کرد.

3- کامپوننت‌ها

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

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

4- شخصی‌سازی

یکی از مهمترین انتقادها در مورد چارچوب‌هایی مانند بوت استرپ، اندازه فایل‌های آنهاست – حجمی که دارند و هنگام بارگیری، واقعا می‌تواند موجب کند شدن برنامه شما شود. به طور مثال در حال حاضر حجم Bootstrap’s CSS 119 کیلوبایت است. شاید در مقایسه با فایل‌های تصویری و ویدئویی به خصوص، زیاد به نظر نرسد، اما برای یک فایل CSS زیاد است!

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

5- جامعه بزرگ بوت استرپ

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

6- تمپلیت‌ها و قالب‌ها

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

نوشته‌های تازه

  • الگوریتم «موبایل گدون» Mobilegeddon
  • طراحی سایت pwa چیست؟
  • محتوای همیشه سبز چیست؟
  • امتیاز کیفی (Quality Score) در گوگل ادز چیست؟
  • تکنیک‌های سئوی داخلی سایت

درباره ما

گروه فنی مهندسی هوشمند آرایه پرداز کادوس با بهره گیری از تجارب متخصصان جوان و دانش روز آماده ارائه جدیدترین و بهترین نوع خدمات بصورت شبانه روزی و دلخواه مشتریان می باشد. ما اولین تیم فنی مهندسی در ایران هستیم که کلیه پروژه های فنی و مهندسی شما را از صفر تا صد پشتیبانی و اجرا می کنیم. گواه این خدمات ما بزرگترین و معتبرترین برندهای ایران هستند که ما افتخار خدمت رسانی به ایشان را داشته ایم.

جستجو کنید:

Theme by Colorlib Powered by WordPress