Bootstrap (фронт-енд фрејмворк)

S Vikipedije, slobodne enciklopedije
Butstrep engl. Bootstrap
Butstrep logo
Butstrep logo
Primer veb-sajta koji koristi Butstrep frejmvork prikazan u Mozila Fajerfoksu
Primer veb-sajta koji koristi Butstrep frejmvork prikazan u Mozila Fajerfoksu
Originalni autor(i)Mark Oto
Džejkob Tornton
Programer(i)Butstrep tim
Prvo izdanje19. avgust 2011. god.; pre 12 godina (2011-08-19)
Stabilno izdanje
3.3.7 / 25. jul 2016. god.; pre 7 godina (2016-07-25)[1]
Preliminarno izdanje
4.0.0-beta
Spremište Uredi na Vikipodacima
Napisan uHTML, CSS, Less (ver. 3), Sass (ver. 4) i JavaScript
Platformaveb endžin
Tipveb frejmvork
LicencaMIT licenca (Apač licenca ver. 2.0 do verzije Butstrep 3.1.0)
Veb-sajthttps://getbootstrap.com, http://getbootstrap.com

Bootstrap (transkr. Butstrep) predstavlja besplatni veb frejmvork otvorenog koda, za kreiranje veb sajtova i veb aplikacija. Baziran je na HTML i CSS šablonima za tipografiju, kreiranju formulara, dugmadi, navigacionim i ostalim komponentama interfejsa, kao i opcionim JavaSkript dodacima. Cilj Butstrep frejmvorka (engl. framework) je olakšavanje programiranja za veb.

Takođe, Butstrep je frejmvork za veb aplikacije, tj. softverski frejmvork koji je dizajniran tako da podrži razvoj dinamičkih veb sajtova i veb aplikacija.

Od maja 2015. ovaj projekat je najviše ocenjivan projekat na GitHab-u sa preko 107.000 ocena i 48.000 forkova (engl. fork).[3]

Poreklo[uredi | uredi izvor]

Butstrep, prvobitno nazvan Tviter Bluprint (engl. Twitter Blueprint), su razvili Mark Oto i Džejkob Tornton radeći za kompaniju Tviter, s namerom da povećaju konzistentnost interno korišćenih alata. Pre Butstrepa, korišćene su razne biblioteke za razvoj interfejsa, što je dovelo do nedoslednosti i teškog održavanja. Mark Oto navodi:

Mala grupa programera, zajedno sa mnom, se udružila kako bi dizajnirali i izgradili nov interni alat i u tome smo videli priliku za nešto više. Tokom ovog procesa, primetili smo da gradimo nešto što je mnogo značajnije od običnog internog alata. Nakon nekoliko meseci, završili smo prvu verziju Butstrepa koja je predstavljala jedan vid dokumentovanja i deljenja zajedničkih dizajnerskih šablona i resursa unutar kompanije.[4]

Nakon nekoliko meseci razvoja, mnogi Tviter programeri su se pridružili ovom projektu i doprineli razvoju kroz "Hak Vik" (engl. Hack Week), nedelju hakatona za razvojni tim Tvitera. Preimenovan je iz Tviter Bluprinta u Butstrep i objavljen je kao projekat otvorenog koda, 19. avgusta, 2011.[5] Nakon objavljivanja ove verzije, Mark Oto i Džejkob Tornton nastavili su sa održavanjem i razvojem Butstrepa. Pored njih, razvoju takođe doprinosi i veliki broj programera.[6]

Dana 31. januara 2012. godine objavljena je druga verzija Butstrepa, koja donosi prilagodljiv dizajn sa rasporedom elemenata u 12 kolona, ugrađenu podršku za glifikone (engl. Glyphicons), nekoliko novih komponenti kao i promene u postojećim komponentama.[7]

Butstrep 3 je objavljen 19. avgusta 2013. godine, kada je uveden flet dizajn (engl. flat design) i princip mobilni uređaji pre svega (engl. mobile-first).[8]

Dana 29. oktobra 2014. godine, Mark Oto je objavio razvoj Bustrep verzije 4.[9] Prva alfa verzija Butstrepa 4 objavljena je 19. avgusta 2015. godine.[10]

Karakteristike[uredi | uredi izvor]

Butstrep 3 je podržan u najnovijim verzijama Gugl Hroma, Fajerfoksa, Internet Eksplorera, Opere i Safarija (osim na Microsoft Windowsu). Dodatno je podržan i u Internet Eksploreru 8 i najnovijem Fajerfoks izdanju sa dodatnom podrškom (engl. Firefox Extended Support Release - ESR).[11]

Od verzije 2.0 Butstrep podržava prilagodljiv veb dizajn (engl. resposnive web design). Ovo znači da se izgled veb strane dinamički prilagođava, uzimajući u obzir tip uređaja koji se koristi (desktop računar, tablet, mobilni telefon).

Počevši od verzije 3.0, Butstrep je usvojio princip dizajna "mobilni uređaji pre svega", naglašavajući prilagodljiv veb dizajn kao podrazumevanu opciju.

Alfa verzija Butstrepa 4 dodala je podršku za Sass i CSS flexbox.

Sav kôd vezan za Butstrep dostupan je i besplatan na GitHabu. Programeri se podstiču da učestvuju u ovom projektu i da sami doprinesu njegovom razvoju.

Struktura i funkcionalnost[uredi | uredi izvor]

Butstrep je modularan i sastoji se od niza Less stilova koji definišu različite komponente skupa alata. Ovi stilovi su najčešće sadržani u paketu i ubačeni u veb-stranicu, dok se pojedinačne komponente mogu ubaciti ili ne. Butstrep obezbeđuje veliki broj konfiguracionih promenljivih pomoću kojih se kontrolišu stvari kao što su boja ili rastojanje sadržaja od ivica kod različitih komponenti.

Od verzije 2.0, Butstrep dokumentacija sadrži poseban čarobnjak za podešavanje. Programeri mogu da izaberu komponente koje žele da koriste i, ako je potrebno, podešavaju vrednosti određenih opcija prema svojim potrebama.

Od verzije Butstrep 4, koristi se Sass stilski jezik umesto Less-a.

Svaka Butstrep komponenta se sastoji od HTML strukture, CSS deklaracija i u nekim slučajevima JavaSkript koda.

Prikaz u obliku "rešetke" (engl. grid system) i prilagodljiv dizajn su standardne širine od 1.170 piksela. Alternativno, prikaz sadržaja može da zavisi od širine prozora u kome se prikazuje. U oba slučaja Butstrep ima četiri načina za prikazivanje sadržaja na različitim rezolucijama i tipovima uređaja: mobilni telefoni (uspravno i položeno), tablet računari i PC računari sa manjom i većom rezolucijom. Svaki od načina prikaza prilagođava širinu kolona.

Stilovi[uredi | uredi izvor]

Butstrep obezbeđuje skup stilova koji pružaju osnovne definicije za sve ključne HTML komponente. Time se dobija uniforman, moderan prikaz teksta, tabela i formulara.

Komponente za ponovnu upotrebu[uredi | uredi izvor]

Pored osnovnih HTML elemenata, Butstrep sadrži i neke često korišćene elemente za formiranje interfejsa. Oni uključuju dugmad sa posebnim funkcijama (na primer grupisanje dugmadi ili dugmad sa drop-down opcijom, navigacione liste, horizontalni i vertikalni tabovi, itd.), oznake, napredne tipografske mogućnosti, poruke sa upozorenjima, progresivne trake, i dr. Komponente su implementirane kao CSS klase, koje moraju biti vezane za određene elemente na veb strani.

JavaSkript komponente[uredi | uredi izvor]

Butstrep u osnovi sadrži nekoliko JavaSkript komponenti u obliku džejKveri dodataka. Oni pružaju dodatne elemente za korisnički interfejs kao što su dijalog boksovi, opisi alatki (engl. tooltips) i karuseli (engl. carousel). Oni takođe proširuju funkcionalnost nekoliko postojećih elemenata, uključujući, na primer, funkciju za automatsko popunjavanje polja za unos. U verziji 2.0, podržani su sledeći JavaSkript dodaci: Modal, Dropdown, Scrollspy, Tab, Tooltip, Popover, Alert, Button, Collapse, Carousel i Typeahead.

Butstrep 4[uredi | uredi izvor]

Dana 29. oktobra 2014. godine, Mark Oto je objavio razvoj Bustrep verzije 4.[9] 6. septembra 2016. godine, Mark je prekinuo rad na Butstrepu 3 kako bi imao vremena za razvoj Butstrepa 4. Preko 4.000 komita je postavljeno za kod Butstrepa 4 do sad.

Butstrep 4 je skoro u potpunosti prepisan iz Butstrepa 3. Značajne promene su:

  • prelazak sa Sass-a na Less
  • Prestanak podrške za Internet Eksplorer 8 i 9 kao i za iOS 6
  • Dodata podrška za flexbox
  • Prelazak sa piksela na rem
  • Povećana je globalna veličina fonta sa 14 na 16 piksela
  • Izbačene su komponente panel, thumbnail i well koje je zamenila card komponenta
  • Prestanak podrške za glifikon font sa ikonicama
  • Izbačena je komponenta pager
  • Skoro sve komponente, džejKveri dodaci i dokumentacija su ponovo napisani

Vidi još[uredi | uredi izvor]

Reference[uredi | uredi izvor]

  1. ^ Rebert, Chris (25. 7. 2016). „Bootstrap 3.3.7 released”. Arhivirano iz originala 23. 11. 2016. g. Pristupljeno 23. 2. 2017. 
  2. ^ Oto, Mark (10. 8. 2017). „Butstrep 4 Beta”. 
  3. ^ „Search · stars:>1”. GitHub. Pristupljeno 23. 2. 2017. 
  4. ^ Otto, Mark (17. 1. 2012). „Bootstrap in A List Apart No. 342”. Mark Otto's blog. Arhivirano iz originala 28. 10. 2016. g. Pristupljeno 23. 2. 2017. 
  5. ^ Otto, Mark (19. 8. 2011). „Bootstrap from Twitter”. Developer Blog. Twitter. Arhivirano iz originala 23. 2. 2017. g. Pristupljeno 23. 2. 2017. 
  6. ^ „About”. Bootstrap. Pristupljeno 23. 2. 2017. 
  7. ^ Otto, Mark (31. 1. 2012). „Say hello to Bootstrap 2.0”. Developer Blog. Twitter. Arhivirano iz originala 23. 2. 2017. g. Pristupljeno 23. 2. 2017. 
  8. ^ Otto, Mark (19. 8. 2013). „Bootstrap 3 released”. Arhivirano iz originala 23. 10. 2016. g. Pristupljeno 23. 2. 2017. 
  9. ^ a b Otto, Mark (29. 10. 2014). „Bootstrap 3.3.0 released”. Arhivirano iz originala 24. 7. 2016. g. Pristupljeno 23. 2. 2017. 
  10. ^ Otto, Mark (19. 8. 2015). „Bootstrap 4 alpha”. Arhivirano iz originala 23. 01. 2017. g. Pristupljeno 23. 2. 2017. 
  11. ^ „Supported browsers”. Bootstrap. Pristupljeno 23. 2. 2017. 

Spoljašnje veze[uredi | uredi izvor]

  • Butstrep - Zvanični veb-sajt, sadrži dokumentaciju i materijal za preuzimanje
  • Butstrep blog - Zvanični blog koji vodi jedan od osnivača projekta, Mark Oto