Kontentke ótiw

Bootstrap (front-end freymvork)

Wikipedia, erkin enciklopediya

Bootstrap (burınǵı atı Twitter Bootstrap) - juwap beretuǵın adaptiv front-end veb-qosımshalardı islep shıǵıwǵa baǵdarlanǵan biypul hám ashıq kodlı CSS sisteması. Ol tipografiya, formalar, túymeler, navigaciya hám basqa interfeys komponentleri ushın HTML, CSS hám (minnetli emes) JavaScriptqa tiykarlanǵan dizayn shablonların óz ishine qamtıydı.

2023 jıl maydaǵı jaǵdayı boyınsha Bootstrap - 164 000 juldızı bar GitHub saytındaǵı eń juldızlı 17-proekt (eń kóp juldızlı 4-kitapxana) bolıp tabıladı.[1] W3Techs maǵlıwmatları boyınsha, Bootstraptı barlıq veb-saytlardıń 19,2% paydalanadı.[2]

Ózgeshelikleri

[redaktorlaw | derekti redaktorlaw]

Bootstrap – informaciyalıq veb-betlerdi jaratıwdı ańsatlastırıwǵa baǵdarlanǵan (veb qosımshalarǵa qaraǵanda) HTML, CSS hám JS kitapxanası bolıp tabıladı. Onı veb-proektke qosıwdıń tiykarǵı maqseti - Bootstraptıń reń, ólshem, hárip hám jaylasıw tańlawların usı proektte qollanıw. Solay etip, baslı faktor - juwapker baǵdarlamashılar bul tańlawdı ózlerine sáykeslendiredi.Proektke qosılǵannan keyin Bootstrap barlıq HTML elementleri ushın tiykarǵı stil anıqlamaların usınadı. Nátiyje - veb-brauzerlerde tekst kórinisi, kesteler menen forma elementleri ushın birgelki kórinis payda boladı. Sonday-aq, baǵdarlamashılar kontentleriniń (mazmunlarınıń) kórinisin jánede sáykeslendiriw ushın Bootstrapta anıqlanǵan CSS klaslarınıń artıqmashılıǵın paydalana aladı. Mısalı, Bootstrap ashıq hám qoyıw reńli kestelerdi, bet temaların, anaǵurlım kórkem tırnaqshalardı hám bóleklengen tekstti támiyinleydi.

Bootstrap sonıń menen bir qatarda jQuery sıyaqlı basqa kitapxanalardı talap etpeytuǵın JavaScript komponentaları menen birge keledi. Olar dialog aynalar, keńesler, progres paneller, ashılatuǵın navigaciya menyuleri hám karuseller sıyaqlı qosımsha paydalanıwshı interfeysiniń elementlerin támiyinleydi. Hárbir Bootstrap komponenti HTML strukturasınan, CSS járiyalanıwlarınan hám ayırım jaǵdaylarda JavaScript kodı menen birge keledi. Olar sonday-aq ayırım bar interfeys elementleriniń funkcionallıǵın keńeytedi, sonıń ishinde, mısalı kirgiziw maydanları ushın avtomat juwmaqlaw funkciyası.

Example of a webpage using Bootstrap framework
Firefox-ta kórsetilgen Bootstrap freymvorktı paydalanatuǵın veb-bettiń mısalı

Bootstraptıń eń kórnekli komponentleri onıń maket komponentleri bolıp tabıladı, óytkeni olar pútkil veb-betke tásir etedi. Tiykarǵı maket komponentası “Container” dep ataladı, óytkeni bettegi barlıq basqa elementler oǵan jaylasqan. Baǵdarlamashılar “fixed-width container” menen “fluid-width container”diń birewin tańlay aladı. Keyingisi bárqulla enin veb-bet penen toltırsa, birinshisi betti kórsetetuǵın ekran ólshemine baylanıslı aldınnan anıqlanǵan bes bekitilgen eniniń birewin paydalanadı:

  • 576 pikselden az
  • 576–768 piksel
  • 768–992 piksel
  • 992–1200 piksel
  • 1200 pikselden úlken

Konteyner ornatılǵannan keyin, basqa Bootstrap layout komponentları qatarlar menen baǵanalardı anıqlaw arqalı CSS Flexbox jaylasıwın ámelge asıradı.

Bootstraptıń aldınnan dúzilgen versiyası CSS faylı hám hár qanday proektke ańsat qosılıwǵa bolatuǵın JavaScript faylı túrinde hámmege ashıq. Degen menen, Bootstraptıń shiyki forması baǵdarlamashılarǵa adaptaciya menen ólshemdi optimallastırıwdı ámelge asırıwǵa imkaniyat beredi. Bul qayta islenbegen forma modullik bolıp tabıladı, yaǵnıy baǵdarlamashı kerek emes komponentalardı óshire aladı, temanı paydalana aladı hám dúzilmegen Sass faylların ózgerte aladı.

Tariyxı

[redaktorlaw | derekti redaktorlaw]

Erte baslamalar

[redaktorlaw | derekti redaktorlaw]

Dáslebinde Twitter Blueprint dep atalatuǵın Bootstraptı Mark Otto menen Djeykob Tornton Twitterde ishki qurallardaǵı úylesimlilikti xoshametlew ushın islep shıqqan. Bootstrapqa shekem interfeysti jaratıw ushın hártúrli kitapxanalar paydalanıldı, bul sáykessizliklerge hám joqarı texnikalıq xızmet kórsetiw júklemesine alıp keldi. Ottonıń aytıwınsha:  

Kishi topardıń bir neshe aylıq islep shıǵarıwınan keyin Twitterdegi kóplegen baǵdarlamashılar Twitter islep shıǵıw toparına arnalǵan xakaton stilindegi háptelik Hack Week sheńberinde proektke óz úleslerin qosıp basladı. Onıń atı Twitter Blueprint-ten Twitter Bootstrap bolıp ózgertildi hám 2011 jıl 19-avgustte ashıq kodlı proekt retinde shıǵarıldı.[4] Onı Otto Tornton, tiykarǵı baǵdarlamashılardıń kishi toparı hám úles qosıwshılardıń úlken komandası dawam ettirdi.[5]

Bootstrap 2

[redaktorlaw | derekti redaktorlaw]

2012 jıl 31-yanvarda Bootstrap 2 shıǵarıldı, ol Glyphicons ushın ornatılǵan qollawdı, bir neshe jańa komponentlerdi, sonday-aq kóplegen bar komponentalarǵa ózgertiwler qostı. Bul versiya juwap beretuǵın (beyimlesiwshi adaptiv) veb-dizayndı qollaydı, yaǵnıy veb-betlerdiń jaylasıwı paydalanatuǵın qurılmanıń xarakteristikaların (desktop, planshet, uyalı telefon) esapqa alıp dinamikalıq túrde sazlanadı.[6] Bootstrap 2.1.2 shıǵarılıwınan az waqıt aldın Otto menen Tornton Twitterden ketti, biraq Bootstrap ǵárezsiz proekt retinde jumıs islewdi dawam ettiriwge minnetlendi.[7]

Bootstrap 3

[redaktorlaw | derekti redaktorlaw]

2013 jıl 19-avgustte Bootstrap 3 shıǵarıldı. Ol tegis dizayndı hám mobil birinshi usıldı paydalanıw ushın komponentlerdi qayta islep shıqtı. Bootstrap 3 atlar keńisligi waqıyaları bar jańa plagin sistemasın usındı. Bootstrap 3 Internet Explorer 7 hám Firefox 3.6-larda qollawın toqtattı, biraq bul brauzerler ushın qosımsha polifill bar.[8] Bootstrap 3 sonıń menen bir qatarda Twitterdiń ornına GitHub-ta twbs shólkemi boyınsha shıǵarılǵan birinshi versiyası boldı.[9]

Bootstrap 4

[redaktorlaw | derekti redaktorlaw]

Otto 2014 jıl 29-oktyabrde Bootstrap 4-ti járiyaladı.[10] Bootstrap 4 birinshi alfa versiyası 2015 jıl 19-avgustte shıǵarıldı.[11] Birinshi beta versiyası 2017 jıl 10-avgustte shıǵarıldı.[12] Otto Bootstrap 4-te jumıs islewge waqıt bóliw ushın 2016 jıl 6-sentyabrde Bootstrap 3 sistemasındaǵı jumısın toqtattı. Bootstrap 4 2018 jıl 18-yanvarda juwmaqlandı.[13]

Zárúr ózgerislerge tómendegiler kiredi:

  • Kodtıń tiykarǵı qayta jazılıwı
  • Less-ti Sass penen almastırıw
  • Reboot qosıw, bir fayldaǵı elementke sáykes CSS ózgerisleriniń jıynaǵı, Normalizaciyaǵa tiykarlanǵan
  • IE8, IE9 hám iOS 6 ushın qollawdı toqtatıw
  • CSS Flexible Box-tı qollaw
  • Navigaciyanı sazlaw opciyaların qosıw
  • Adaptiv aralıq hám ólshemli utilitalardı qosıw
  • CSS-tegi pikseller birliginen root ems-ke ótiw
  • Jaqsıraq oqıw ushın global hárip ólshemin 14 pikselden 16 pikselge sheken úlkeytiw
  • panel, thumbnail, pager, hám well komponentlerin taslaw
  • Glyphicons belgisi shriftin túsiriw
  • Xızmetlik klaslardıń úlken sanı
  • Jaqsılanǵan forma stili, túymeler, ashılatuǵın menyuler, media obyektleri hám súwret klasları

Bootstrap 4 Google Chrome, Firefox, Internet Explorer, Opera hám Safari (Windowstan basqa) sońǵı versiyaların qollaydı. Ol qosımsha IE10 versiyasına hám sońǵı Firefox keńeytilgen versiyasında (ESR) isleydi.[14]

Bootstrap 5

[redaktorlaw | derekti redaktorlaw]

Bootstrap 5  rásmiy túrde 2021 jıl 5-mayda shıǵarıldı.[15][16]

Tómendegi tiykarǵı ózgerislerdi óz ishine aladı:[17]

  • Jańa offcanvas menyu komponenti
  • Vanil JavaScript paydasına jQuery-ge ǵárezlilikti alıp taslaw
  • Qatarlardıń sırtında jaylastırılǵan adaptiv gridler menen baǵanalardı qollaw ushın tordı qayta jazıw
  • Hújjetlerdi Jekyll-den Hugo-ǵa kóshiriw
  • Internet Explorer ushın qollawdı toqtatıw[18]
  • Testlew infrastrukturasın QUnit-ten Jasmine-ge almastırıw
  • SVG ikonlarınıń retlenetuǵın toplamın qosıw[19]
  • CSS paydalanıwshı qásiyetlerin qosıw
  • Jaqsılanǵan API
  • Jetilistirilgen grid sisteması
  • Hújjetlerdi sáykeslendiriw jaqsılandı
  • Jańalanǵan formalar
  • RTL qollawı
  • Qarańǵı rejimde qollaw

Derekler

[redaktorlaw | derekti redaktorlaw]
  1. ↑ „Search · stars:>100000“ (en). GitHub. Qaraldı: 4-dekabr 2022-jıl.
  2. ↑ „Usage statistics and market share of Bootstrap for websites“ (en). w3techs.com. Qaraldı: 24-yanvar 2023-jıl.
  3. ↑ Otto, Mark „Bootstrap in A List Apart No. 342“. Mark Otto's blog (17-yanvar 2012-jıl). 28-oktyabr 2016-jılda túp nusqadan arxivlendi. Qaraldı: 23-fevral 2017-jıl.
  4. ↑ Otto. „Bootstrap from Twitter“. Developer Blog. Twitter (19-avgust 2011-jıl). 23-fevral 2017-jılda túp nusqadan arxivlendi. Qaraldı: 23-fevral 2017-jıl.
  5. ↑ „About“. Bootstrap (19-avgust 2011-jıl). Qaraldı: 23-fevral 2017-jıl.
  6. ↑ Otto. „Say hello to Bootstrap 2.0“. Developer Blog. Twitter (31-yanvar 2012-jıl). 23-fevral 2017-jılda túp nusqadan arxivlendi. Qaraldı: 23-fevral 2017-jıl.
  7. ↑ Otto. „Onward“ (en). blog.getbootstrap.com (29-sentyabr 2012-jıl).
  8. ↑ Otto. „Bootstrap 3 released“ (19-avgust 2013-jıl). 21-oktyabr 2016-jılda túp nusqadan arxivlendi. Qaraldı: 23-fevral 2017-jıl.
  9. ↑ „Bootstrap 3 plans“ (10-dekabr 2012-jıl).
  10. ↑ Otto. „Bootstrap 3.3.0 released“ (29-oktyabr 2014-jıl). 24-iyul 2016-jılda túp nusqadan arxivlendi. Qaraldı: 23-fevral 2017-jıl.
  11. ↑ Otto. „Bootstrap 4 alpha“ (19-avgust 2015-jıl). 23-yanvar 2017-jılda túp nusqadan arxivlendi. Qaraldı: 23-fevral 2017-jıl.
  12. ↑ Otto. „Bootstrap 4 Beta“ (10-avgust 2017-jıl). Qaraldı: 16-avgust 2017-jıl.
  13. ↑ „Bootstrap 4“ (en). blog.getbootstrap.com (18-yanvar 2018-jıl). Qaraldı: 5-fevral 2021-jıl.
  14. ↑ „Supported browsers“. Bootstrap. Qaraldı: 23-fevral 2017-jıl.
  15. ↑ „Release Release v5.0.0 (#33647) · twbs/bootstrap“ (en). GitHub. Qaraldı: 5-may 2021-jıl.
  16. ↑ „Bootstrap 5“. blog.getbootstrap.com (5-may 2021-jıl).
  17. ↑ „Bootstrap 5 grid by MartijnCuppens · Pull Request #28517 · twbs/bootstrap“ (en). GitHub. Qaraldı: 29-sentyabr 2019-jıl.
  18. ↑ „v5: drop Internet Explorer support by XhmikosR · Pull Request #30377 · twbs/bootstrap“ (en). GitHub. Qaraldı: 7-aprel 2020-jıl.
  19. ↑ „Bootstrap Icons“. Qaraldı: 7-noyabr 2022-jıl.

Sırtqı silteme

[redaktorlaw | derekti redaktorlaw]
  • Bootstrap on GitHub
«https://kaa.wikipedia.org/w/index.php?title=Bootstrap_(front-end_freymvork)&oldid=78589» saytınan alınǵan