Slik installerer du Bootstrap

Bootstrap er et open source-rammeverk. Den brukes hovedsakelig til front-end utvikling. Det er gratis. Bootstrap ble utviklet av Bootstrap Core Team. Bootstrap ble opprinnelig opprettet av Mark Otto og Jacob Thornton. Den ble først utgitt i år 2011. Den ble skrevet i HTML, CSS og JavaScript.

Bootstrap-pakken

Denne pakken inneholder følgende elementer:

  1. CSS : Det kalles Cascading-stilark som brukes til å style HTML-elementene.
  2. Komponenter : I Bootstrap-pakken er det mange gjenbrukbare komponenter for dropdowns, ikonografi, varsler, navigasjon etc.
  3. Tilpass : I Bootstrap-pakken kan komponentene tilpasses, mindre varierende og Jquery-plugins for å få stilen.
  4. Stillas : I en bootstrap-pakke gir den grunnleggende struktur med rutenettet, koblingsstil og bakgrunn.
  5. JavaScript : I en bootstrap-pakke vil det være JavaScript-plugin-moduler.

Trinn for å installere Bootstrap

La oss diskutere trinnene som kreves for å installere Bootstrap.

Trinn 1: Bruk lenken nedenfor for å laste ned bootstrap. Klikk på Last ned, bootstrap-pakken blir lastet ned i en zip-mappe. Denne mappen inneholder CSS og JS-mappen.

https://getbootstrap.com/docs/4.0/getting-started/download/

Oppstartpakken som lastes ned er klar til å bruke kompilert kode, og som enkelt kan integreres i prosjektet. Den består av kompilerte og minifiserte CSS-pakker og Javascript Plugins.

Trinn 2: Kildefil : Bootstrap kan settes sammen med egen ressursrørledning ved hjelp av javascript, sass og dokumentasjonsfiler.

Klikk på Last ned kilde for å få ned filene. Den inneholder js, CSS og andre filer.

Trinn 3: Package Managers: Bootstrap kan installeres i Node.js drevne filer eller applikasjoner.

$ npm install bootstrap

Trinn 4: For Node.js-applikasjoner kan bootstrap også installeres ved hjelp av garnpakke.

$ yarn add bootstrap

Trinn 5: Hvis brukeren ønsker å installere bootstrap for rubin perler applikasjoner

  • Bruker du bundler : gem 'bootstrap', '~> 4.0.0'
  • Uten bundler : $ gem install bootstrap –v 4.0.0

Trinn 6: Komponisten kan brukes til å installere og administrere bootstraps sass og javascript

$ Composer require twbs/bootstrap: 4.0.0

Trinn 7: Ved hjelp av NuGet kan du installere og administrere bootstraps CSS og sass og javascript for.Net-applikasjoner.

  • Install-Package bootstrap
  • Install-Package bootstrap.sass

Trinn 8: Jquery brukes også med bootstrap-filer eller installasjonsmappe. Jquery må lastes ned og plasser Jquery-filen i rootmappen for Bootstrap for å oppleve det bedre brukergrensesnittet, og viktigst av alt forbedrer Jquery funksjonene i bootstrap som gir utseendet mer attraktivt og responsivt.

Trinn 9: Etter å ha utført trinnene ovenfor, kan utvikleren skrive HTML-koden for å koble alle filene for HTML-siden og kan åpne HTML-filen for å sjekke responsen.

Støttede nettlesere

Oppstartstroppen støtter hovedsakelig den siste og stabile utgivelsen av all nettleser og plattform. Nettleser for mobile enheter har fått støtte fra Android og IOS-plattformen. Stasjonære nettlesere for forskjellige plattformer som Mac og Windows støttes også av bootstrap.

Bootstrap Filstruktur

  • Bootstrap er forhåndskompilert, den kompilerte versjonen av bootstrap blir lastet ned og trekk ut zip-filen og følgende filstruktur du vil se:

Figuren over inkluderer fontene mappefiler i tillegg hvis utvikleren krever ekstra skrifttyper for å lage brukergrensesnittet i henhold til krav kan omfatte at filer som er tilgjengelige i kildepakken med bootstrap. Kildekoden for bootstrap vil ha en mer detaljert filstruktur.

Bootstrap 4

Det er betydelige endringer som gjøres i Bootstrap 4 som å omskrive koden stort sett, støtte for CSS fleksibel størrelse, tilpasningsalternativer for navigasjon er lagt til, responsavstand og størrelsesverktøy er lagt til, den globale skriftstørrelsen økes fra 14px til 16px, antall verktøy klasser legges til, stylingknapp, rullegardinmenyer, medieobjekter og bildeklasser legges til. Den støtter også den nyeste versjonen av nettlesere.

Hovedtrekket i Bootstrap er å forenkle utviklingen av websider. Den viktigste grunnen til å bruke bootstrap er valg av farge, størrelse, skrift og layout for å projisere. Det gir grunnleggende stildefinisjoner til HTML-elementer. Jquery-plugins og Javascript-komponenter gir noen tilleggselementer som kan brukes til brukergrensesnitt, for eksempel dialogbokser, og verktøytips osv. Bootstrap-komponentene består også av elementer av HTML, CSS-deklarasjoner og Javascript-kode. Den har også en funksjon for å utvide de eksisterende grensesnittelementene.

Den andre hovedkomponenten i bootstrap er layoutkomponenter. Den grunnleggende layoutkomponenten kalles en container der hvert element på siden er plassert i den. Beholderen er plassert på websiden, da kan andre layoutkomponenter som CSS-layout defineres gjennom rader og kolonner. Det avhenger av utvikleren å velge hvilken beholder fast bredde eller væskebreddebeholder for utforming av nettsiden. Førstnevnte bruker de fire forhåndsdefinerte breddene, men senere fyller avhenger av størrelsen på skjermen på hvilken webside som blir sett.

Bruk av bootstrap

Bootstrap er veldig enkel å bruke, og med hjelp av bootstrap, utviklere som brukes til å utvikle responsive nettsteder. Bootstrap brukes også da den støtter mange nettlesere som Google Chrome, Mozilla Firefox, Internet Explorer, safari, opera osv. Bootstrap er lett å komme i gang og lage et responsivt rutenettsystem. Den har samlet javascript-plugin-moduler, og det er en liste over selskaper som skal brukes. Den har god dokumentasjon for å starte og kunne jobbe raskt. Bootstrap har vist responsiv design og mobil første tilnærming. Det er åpen kildekode og kostnadsfritt. Det sparer mye krefter og tid. Den kan tilpasses. Den viktige bruken av bootstrap er responsiv webdesign, som hjelper til med å justere nettstedet i henhold til skjermstørrelse for alle enheter som bærbar PC, stasjonær, mobiltelefon og nettbrett.

Konklusjon - Slik installerer du Bootstrap

Bootstrap bruker mye som en front-end nettramme. Den støtter mange programmeringsspråk og plattformuavhengige også. Det har stor støtte for online fellesskap for nybegynnere å hjelpe, og dokumentasjon er også bra på offisielt nettsted der alle oppdateringene angående utgivelsen av en ny versjon og de avanserte funksjonene er publisert og dokumentert på riktig måte. Det har blitt den populære nettrammen for å bygge forskjellige verktøy og integrere seg med et annet skriptspråk.

Anbefalte artikler

Dette har vært en guide for hvordan du installerer Bootstrap. Her har vi diskutert trinnene for å installere bootstrap og også grunnleggende konsept for Bootstrap 4 og bruk av Bootstrap. Du kan også se på følgende artikler for å lære mer -

  1. Slik bruker du Bootstrap-kommandoer
  2. Bootstrap-intervjuspørsmål med svar
  3. Sammenligninger av Bootstrap og WordPress
  4. Installasjon av WordPress