آی تی تیم وبلاگ

فریم ورک های فرانت اند

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

بروزرسانی شده در 12 بهمن 1400

framework

فریم ورک ( Framework ) چیست ؟

فریم ورک فرانت اند چیست؟

در طراحی وب سایت،فریم ورک های فرانت اند یک پکیج ساخته شده از کدهای استاندارد شده است (HTML , css , JS, . . .)  که برای توسعه وب سایت از آن استفاده می شود. هدف فریم ورک فراهم کردن یک ساختار مشترک است که برنامه نویسان مجبور به دوباره کاری نباشند و بتوانند از کدهای ارایه شده چندین بار بهره ببرند. استفاده از فریم ورک بخشی از کار ها را کمتر کرده و باعث صرفه جویی در زمان شده است.

فرانت اند

 

فریمورک ها کد هایی هستند که در طراحی وب سایت ها مورد استفاده قرار می گیرد. فریمورک ها به ۲ دسته backend و frontend تقسیم می شوند و در اختیار برنامه نویسان قرار می گیرند. دلیل طراحی و ایجاد فریمورک ها، ساخت یک ساختار مشترک برای برنامه نویسان می باشد. فریمورک frontend از فایل ها و کد های استاندارد شده زبان های HTML ،css ،JS و … ساخته شده است. در ادامه بیشتر درباره فریمورک های html و css توضیح می دهیم.

مولفه های فریم ورک های فرانت اند:

۱. دارای کد های منبع CSS برای ایجاد یک Grid هستند

این مولفه به برنامه نویسان امکان می دهد تا المان های مربوط به طراحی وب سایت را به روشی ساده و تطبیق پذیر جایگذاری کنند، بدون اینکه نگران بر هم خوردن آنها هنگام نمایش در نمایشگرهای مختلف باشند. با استفاده از این سیستم می توان به ساختارهای دارای ۱۲ ، ۱۶ و ۲۴ ستون رسید. تصویر زیر یک سیستم گرید را نشان می دهد.

گرید فرانت اند

۲. امکان مشخص کردن Typography برای المان های HTML

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

۴. ایجاد کلاس های استاندارد CSS که برای ایجاد یک سبک خاص در محیط کاربری استفاده می شود.

نحوه انتخاب یک فریم ورک css مناسب

از لحاظ پیچیدگی فریم ورک های CSS را می توان به دو گروه تقسیم کرد:

  • فریم ورک های کامل
  • فریم ورک های ساده

این تمایز کاملا ذهنی است و دلیلی بر برتر بودن آنها نسبت به یکدیگر نیست. در انتخاب یک فریم ورک مناسب مواردی هستند که توجه به آنها حائز اهمیت است:

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

فریم ورک های کامل چیست؟

این نوع فریم ورک ها با ارایه ویژگی های بیشتری همچون انواع فرم ها،دکمه ها،قابهای تصاویر،قالبهای HTML آیکون ها و دیگر مولفه های قابل تنظیم ، به راحتی قابلیت  سفارشی شدن دارند و یکی از فریم ورک های html می باشد.

عوامل مهم در انتخاب فریمورک css و html

فریمورک

در انتخاب فریمورک های html و css عوامل بسیار مهمی وجود دارد که باید به آن ها توجه نمایید و در زیر به معرفی آن ها پرداخته شده است.

طراحی واکنش گرا (Responsive)

طراحی واکنش گرا از مهمترین عوامل در انتخاب فریمورک های html و css یا فریمورک های طراحی وب سایت به حساب می آید. این عامل در تمام قراردادهای طراحی وب وجود دارد. طراحی واکنش گرا سازگاری صحیح پروژه با انواع دستگاه ها (موبایل، تبلت، کامپیوتر و…) را نمایش می دهد. به طور کلی باید فریمورکی را انتخاب نمایید که دارای قابلیت طراحی واکنش گرا باشد.

پشتیبانی از پیش پردازنده های css

یکی از عواملی که باید به آن توجه نمایید، استفاده از پیش پردازنده های css می باشد. در صورتی که در طراحی خود از پردازنده های css همچون  LESS یا SASS باید از فریمورکی استفاده نمایید که از این ۲ پردازنده پشتیبانی کند.

شخصی سازی

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

پشتیبانی

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

چگونه یک فریمورک css و html مناسب انتخاب کنیم؟

به طور کلی فریمورک های html و css به ۲ دسته فریمورک های ساده و فریمورک های کامل تقسیم می شود که هیچ کدام از بقیه برتر نمی باشد و برای انتخاب مناسب فریمورک css و html باید مؤلفه های زیر را در نظر بگیرید.

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

متولد 1375.متخصص طراحی و برنامه نویسی وب سایت . عضو مجموعه تخصصی ITTEAM .