Om du aldrig har hört talas om Bootstrap, ett ramverk utvecklat av Twitter för att skapa vackra webbplatser, missar du! Bootstrap gör det ganska snabbt och enkelt att designa en webbplats utan mycket kunskap om CSS (Cascading Style Sheets). Om du är ny med att programmera för webben behöver du inte veta något om CSS för att börja lära dig hur Bootstrap fungerar; allt du behöver är ett enda HTML-dokument. Vi ska titta på Bootstrap, visa dig vad det handlar om, hur det fungerar och om det är ett bra alternativ för varje webbplats du bygger.
Infoga Bootstrap API i din HTML-fil
Du har några alternativ för att infoga Bootstrap i din huvudprojektfil. Det första alternativet är att infoga alla nödvändiga Bootstrap-filer i ditt projekt. Du kan göra detta genom att ladda ner paketet och ladda upp det till din projektmapp. Du måste naturligtvis länka den primära Bootstrap CSS-filen till ditt dokument. Bootstraps officiella webbplats har en steg-för-steg-guide för hur du gör detta.
Det andra alternativet är att hoppa över att ladda ner paketet och använda ett CDN (Content Delivery Network). Med ett CDN kan du koppla de primära Bootstrap-filerna till ditt HTML-dokument utan att någonsin ladda ner dem. Detta är naturligtvis inte alltid bra för professionella webbplatser, eftersom jag inte skulle vara för snabb att lämna min verksamhet eller portföljsida till öde om den servern någonsin skulle gå ner. Det är bäst att ha filerna i ditt projekt, men för att lära sig kommer CDN att gå bra.
För att sätta in Bootstrap i ditt HTML-dokument, behöver du bara sätta följande kod i
tagg i ditt HTML-dokument:När dessa länkar har infogats i den huvudetiketten, bör du vara redo att börja använda Bootstrap-klasser. Ditt dokument ska se ut så här:
Bootstrap And Classes
Bootstrap-element delas upp i klasser, som bara är ett gäng förskrivna CSS som du kan infoga i din markering. Att lägga in klasser i din markering är enkelt, du behöver bara veta namnet på klassen du vill använda och sedan applicera det på ett av dina HTML-element med hjälp av värdet klass = ”klassnamn”, som diskuterats i en tidigare artikel.
Den svåra delen är att ta reda på hur allt detta fungerar tillsammans för att skapa något vackert. Du kan kolla in alla olika klasser tillgängliga i Bootstrap direkt från den officiella dokumentationen. Nu är det en annan historia att bemästra Bootstrap. Det är inte något vi eller någon annan kan lära dig. Du kan titta på självstudie efter självstudie, men för att bli bra på att använda ramverket kommer det med mycket prov och fel. Och det kräver att du tar hand om det i dina egna projekt.
Med det i åtanke ber jag dig att starta ditt eget HTML-projekt på din dator med Atom eller någon annan textredigerare, granska vad HTML- och CSS-klasser handlar om och sedan börja spela med Bootstrap. Och om du känner tillräckligt med markering, kanske till och med skapa din egen portföljwebbplats som en testövning.
Är Bootstrap ett genomförbart alternativ för varje webbplats?
Bootstrap är en bra ram, men är det ett genomförbart alternativ för varje webbplats du skapar? Det beror verkligen på såväl utvecklaren som projektets krav. I många professionella miljöer kommer du verkligen inte att välja vilken teknik du använder, eftersom det till stor del kommer att vara upp till projektledaren. Om projektledaren väljer att använda Bootstrap kommer du också att kombinera den med massor av anpassade CSS. Detta är vad som generellt gör din webbplats unik och skiljer sig från andra webbplatser som använder Bootstrap.
Jag, personligen, ser inte Bootstrap som ett bra alternativ för varje webbplats. Visst, det kan hjälpa och ge några genvägar, men jag har i slutändan funnit att utforma från grunden med CSS är den bästa vägen till stor del på grund av kontrollen du har över den. Men än en gång, om du bara börjar med webbprogrammering, är det inte en dålig sak att använda Bootstrap alls, men lita inte på det för din karriär.
Det är värt att notera att om du är en nybörjarutvecklare bör du inte använda Bootstrap för alla projekt i din portfölj. Det kan konstateras att du kanske är skicklig med API, men att du inte helt vet hur du går runt CSS. Som sagt är det bra att ha en anständig blandning av båda i din portfölj (eller till och med exklusivt CSS, eftersom det är enkelt att hämta Bootstrap).
Stängning
Det är allt vad Bootstrap är i ett nötskal. Som jag nämnde tidigare uppmuntrar jag dig att starta ditt eget HTML-projekt och lägga till några av de olika klasserna till element för att börja spela med ramverket. Här hittar du alla de olika komponenterna som Bootstrap erbjuder med förklaringar och kodexempel.
Bootstrap är verkligen ett snyggt verktyg, men kom ihåg att inte lita på den ensam! Det är bra att vara bekant med det och känner igenom ramverket, men också se till att du dyker in i CSS för att verkligen förstå vad som händer bakom kulisserna. Inte bara det, utan en stark kunskap i CSS komplimanger Bootstrap mycket, så att du verkligen kan göra några unika och vackra webbplatser med din egen anpassning.
