HTML5 Boilerplate amiről érdemes tudni

Juszkó Csaba június 30, 2023

A HTML-, CSS- és JavaScript-sablonok közül az egyik legnépszerűbb, illetve legjobb. Régebben sokan használják ezt a fejlesztők a weboldalak készítéséhez, jelenleg már kevésbé, egyelőre inkább Google amp, react, node.js, python, stb. alatt népszerűbbek.

Tartalomjegyzék

  1. Alapfogalma
  2. Adatai
  3. Főbb jellemzők és tulajdonságai
  4. Előnyei
  5. Hátrányai
  6. Referenciáim, amelyek Boilerplate keretrendszer alatt készültek
  7. Összefoglalás
  8. Korábbi minden cikkeim, amelyben szerepelnek a Boilerplate
  9. Hasznos linkek

Hivatalos honlapja

https://html5boilerplate.com/

Alapfogalma

A HTML5 Boilerplate egy HTML-, CSS- és JavaScript-sablon HTML5-webhelyek létrehozásához, több böngészővel kompatibilis. (forrás, wiki honlapról: https://en.wikipedia.org/wiki/HTML5_Boilerplate)

Csak azoknak ajánlom olyan fejlesztőknek, akik szeretnek egyénileg beszabni a designet és bármi JS alatt funkciókat fejleszteni, mint a CSS-ben és a JS-ben programozni, ezt javaslom nekik, végülis ez nem olyan mint Bootstrap, ahol minden előkészítve vannak, csak elég, ha kiválasztani és testreszabni őket, szükséges esetén bővülhetnek, ha nincs benne CSS és JS fájlokban.

Boilerplate-nál viszont nem, mert ott pont ellenkezője, sőt ez a sablon azért előny, mert több erőfeszítést és kilobájtot takaríthatnak meg, ez segítségével gyorsabban fog betöltődik az oldal sebessége.

Adatai

Fejlesztők:
Paul Irish, Divya Manian, Mathias Bynens, Nicolas Gallagher
Első verzió kiadásának dátuma:
2011. Március 21.
Legfrissebb verziója:
8.0.0 / 2020. Június 4.
Programozási nyelvek:
HTML, CSS, JavaScript

Főbb jellemzők és tulajdonságai

A Boilerplate sablonkód egy már elkészített erős kezdő sablon, mely alapilag minden benne van ami kell a kiindulóponthoz. A fejlesztők kiegészíthetnek és bővíthetnek, mert ennek a céljuk, hogy a kódolók időt és kilobájtot takaríthassanak meg azzal, hogy elkerüljön az ismétlődő kód megírását a semmiből.

Sőt kiindulópontként ne legyen benne felesleges nagy választék, amikor nincs szükség rá, mint például 10 féle gombok formázások helyett 1db gomb formázás szerepeljen bele, ezt fejlesztők hozzáadja, így azzal lehet spórolni a kilobájtot és gyorsabban fog betöltődik az oldal sebessége. Ezért a Google pár fejlesztők létrehozták ezt a Boilerplate-t.

Minialkalmazásokat is fejlesztették ki a HTML, a React, a PHP, a Node.js, a Go és a Python számára, mert azzal el akarták érni a céljukat, hogy ez használata segítségével gyorsan el lehessen indítani MVP-jét és pár perc alatt elindíthatja az alkalmazást.

Előnyei

  • Ez egy ingyenes legnépszerűbb kiinduló sablon -> bárki használhatja
  • Kevesebb időt és kevesebb pénzt takarítanak meg
  • Kevesebb a hibalehetőség és több a következetesség
  • Google támogatja a Boilerplate-t, ezért SEO-barát, mint felhasználóbarát eszköz, hisz pár Google szakember fejlesztette ki
  • Mivel nincs sok választékok miatt alacsonyabb kilobájttal rendelkezik miatt gyorsabban töltödik be a sebessége
  • Könnyen elérhetőek a HTML5, a Python és a React Native számára, így ne kelljen minden lényeges apró részletet a semmiből megírnia
  • Szigorú, szabványos struktúrával rendelkezik, hogy a fejlesztők kövessenek ezeket, mert csakígy a fejlesztők könnyen olvashatóak, karbantarthatóak és hibakereső kódokat írhatnak, ezzel minimális felhajtással dolgozzanak a projekteken (jobb kódminőség, jobb együttműködés)
  • Időhatékonyság:
  • Alap sablonok mellé már meglévő kódblokkok és sablonok másolásával és beillesztésével is intézheti, mert azzal felgyorsíthatják a fejlesztési folyamatot
  • Keretrendszer és könyvtári támogatás:
    • Harmadik féltől származó
    • API-integrációk
    • UI összetevők
    • Teszteszközök
    • Teljesítmény optimalizálók
  • Nagyjából minden böngészők támogat

Hátrányai

  • A Boilerplate-eket nem minden személyre szabják, hanem tovább kellene fejleszteni és kiegészíteni őket
  • Profi, tapasztalt fejlesztőnek kell lenni, mert ne legyenek hibák benne a Desktopon vagy Tableten vagy a mobilon

Referenciáim, amelyek Boilerplate keretrendszer alatt készültek

Google AMP is maga boilerplate-s módszerek szerint alatt használhatóak:

Összefoglalás

Én és sokak szerint az egyik sokan ismerik, végülis sok helyeken használják (html, amp, react, node.js, python, stb.). Amikor sikeresen el lettek sajátítva, biztosan megtalálhatja bárhol munkahelyét, mert nagyon sok cégen keresnek, azokat, akik értenek túl jól a Boilerplate használatát.

Korábbi minden cikkeim, amelyben szerepelnek a Boilerplate

Hasznos linkek

Vaultvision féle:

Címkék

Megjegyzés küldése

0 Megjegyzések