- Framework provides a foundation on which you can build your code. تقدر تكتب الكود فين وتبنيه ازاي (هي بتحدد كل دا)
- ال CSS Frameworks بالتحديد بتوفر كل ال tools اللي محتاجينها عشان نعمل user interface (UI)
- بنستخدمها عشان نظبط حاجات كتير زي الشكل العام للموقع (nav, forms, grids) أو اني أعمل responsive website يشتغل على أكتر من اسكرين
- بستخدمها من أول البروجكت
Tip
ال frameworks المختلفة يعني فيها features مختلفة عشان كدا مهم تحدد انت عايز ايه بالظبط قبل ما تبدأ
ال vanilla: دا اني استخدم CSS عادي وتعمل استايل لكل العناصر بس دا بياخد وقت ومجهود كتير وبيديك حرية كبيرة ال Utility-first framework: حل اني أعمل من الأول لأنها بتوفرلي classes بيبقا فيها استايلات مختلفة اللي بقدر اعملها (زي اني اسنتر نص) وبرضو بتوفرلي الحرية ال Component framework: بتعمل components معمولها ستايل مسبقا بس بتقيد حريتك شوية
- CSS has two types of frameworks:
- Utility-first frameworks, which provide utility classes to help in building one’s own styles and layouts.
- Component frameworks, which provide a wide selection of pre-styled components and templates that can be implemented onto a website.
Utility-first frameworks
Component frameworks
Fixed and Fluid
| Term | Definition |
|---|---|
| Component Framework | Component frameworks provide pre-styled components and templates which are easy to add to any website. |
| CSS | ”Cascading Style Sheet”s is a style sheet language that describes how HTML elements are displayed. It is the design that is layered over the top of an HTML web page. |
| Fixed Layout | A fixed layout is a layout where you specify the height and width of elements, and those values remain the same regardless of which operating system or browser you use to access the website. |
| Fluid Layout | A fluid layout is a layout in which the height and width of elements is flexible and can expand or contract based on the browser window, the operating system, and other user preferences. |
| Utility Framework | The utility framework provides utility classes that are scoped to individual CSS properties, which helps in building custom designs in HTML files. |