Butstrep (front-end frejmvork)

Iz Vikipedije, slobodne enciklopedije
Idi na navigaciju Idi na pretragu
Butstrep engl. Bootstrap
Boostrap logo.svg
Butstrep logo
Twitter Bootstrap Under Firefox 32.png
Primer veb-sajta koji koristi Butstrep frejmvork prikazan u Mozila Fajerfoksu
Prvobitni
autor(i)
Mark Oto
Džejkob Tornton
Razvijač(i) Butstrep tim
Prva verzija 19. avgust 2011. god.; pre 7 godina (2011-08-19)
Najnovija
verzija
3.3.7
25. jul 2016. god.; pre 2 godine (2016-07-25)[1]
Predverzija 4.0.0-beta
11. avgust 2017. god.; pre 13 meseci (2017-08-11)[2]
Status razvoja aktivan
Pisano u HTML, CSS, Less (ver. 3), Sass (ver. 4) i JavaScript
Platforma veb endžin
Tip veb frejmvork
Licenca MIT licenca (Apač licenca ver. 2.0 do verzije Butstrep 3.1.0)
Veb-sajt https://getbootstrap.com, http://getbootstrap.com

Butstrep (engl. Bootstrap) 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]

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]

Butstrep 3 je podržan u najnovijim verzijama Gugl Hroma, Fajerfoksa, Internet Eksplorera, Opere i Safarija (osim na Vindousu). 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]

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]

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]

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]

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]

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]

Reference[uredi]

  1. ^ Rebert, Chris (25. 7. 2016). „Bootstrap 3.3.7 released”. Arhivirano iz originala na datum 23. 11. 2016. 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 na datum 28. 10. 2016. Pristupljeno 23. 2. 2017. 
  5. ^ Otto, Mark (19. 8. 2011). „Bootstrap from Twitter”. Developer Blog. Twitter. Arhivirano iz originala na datum 23. 2. 2017. 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 na datum 23. 2. 2017. Pristupljeno 23. 2. 2017. 
  8. ^ Otto, Mark (19. 8. 2013). „Bootstrap 3 released”. Arhivirano iz originala na datum 23. 10. 2016. Pristupljeno 23. 2. 2017. 
  9. 9,0 9,1 Otto, Mark (29. 10. 2014). „Bootstrap 3.3.0 released”. Arhivirano iz originala na datum 24. 7. 2016. Pristupljeno 23. 2. 2017. 
  10. ^ Otto, Mark (19. 8. 2015). „Bootstrap 4 alpha”. Arhivirano iz originala na datum 23. 1. 2017. Pristupljeno 23. 2. 2017. 
  11. ^ „Supported browsers”. Bootstrap. Pristupljeno 23. 2. 2017. 

Spoljašnje veze[uredi]

  • 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