Bootstrap er et gratis og open-source CSS framework. Det er et toolkit designet til at udvikle med HTML, CSS og JS. Det hjælper med at designe websteder og applikationer hurtigere og lettere. Det indeholder HTML og CSS-baserede designskabeloner til typografi, formularer, knapper, navigation og andre interface komponenter, samt valgfri JavaScript-udvidelser. Vi bruger bootstrap som vores fortrukne CSS framework, da det er nemt at få op og køre, der er mange standart pakker som vi gerne vil gøre brug af og det er allerede installeret og brugt i Blazor, som vi bruger på de fleste hovedforløb!

Installation

Grundlæggende komponenter i Bootstrap

Bootstrap indeholder forskellige genanvendelige komponenter, der er designet til at give en ensartet, intuitiv og kraftfuld grænseflade. Her er nogle af de mest basale:

• Grid system: Bootstrap har et meget fleksibelt og kraftfuldt 12-kolonners grid system. Det bruges til at oprette side-layouts gennem en række rækker og kolonner.
• Typografi: Bootstrap leverer stiliserede typografi til de fleste HTML-elementer, inklusive overskrifter, kroppens tekst, lister og mere.
• Knapper: Bootstrap indeholder mange forskellige knapstilarter for forskellige formål.
• Navigationskomponenter: Bootstrap indeholder forskellige komponenter til oprettelse af navigationselementer som navbar, dropdowns, breadcrumps, pagination og faner.
• Formularer: Bootstrap indeholder stiliserede formularer og indgangselementer, komplet med formvalidering.
• Kort: Kort i Bootstrap er fleksible og udvidelige indholdsbeholdere, der inkluderer flere valgfrie dele, såsom overskrifter, undertekster, billeder, links og knapper.
• Modalvinduer: Modals er dialogbokse / popup-vinduer, der bruges til lettere brugerinteraktion.
• Carousels: Dette er en komponent, der bruges til at lave en slideshow, hovedsagelig for præsentation.

Bootstrap + Blazor

Bootstrap er standardmæssigt integreret i Blazor, et .NET-webframework, som giver udviklere mulighed for at oprette interaktive webgrænseflader med C#. Dette betyder, at når du opretter et nyt Blazor-projekt, er Bootstrap allerede inkluderet som en del af projektets skabelon. Bootstrap-stilarter og -klasser kan bruges direkte i Blazor-komponenter for at skabe responsive layouts og flotte brugergrænseflader. Selvom Bootstrap er standard i Blazor, kan udviklere vælge at bruge andre CSS-frameworks efter eget valg, såsom Tailwind!