Ha még soha nem hallottál a Bootstrap-ról, amelyet a Twitter fejlesztett ki a gyönyörű weboldalak készítéséhez, akkor hiányzik! A Bootstrap meglehetősen gyors és egyszerűen készíthet weboldalt a CSS (Cascading Style Sheets) sok ismerete nélkül. Ha még nem ismeri a webes programozást, akkor nem kell tudnia valamit a CSS-ről, hogy megtanulja a Bootstrap működését; egyetlen HTML dokumentumra van szüksége. Vessen egy pillantást a Bootstrap-ra, megmutatja neked, mi az egész, hogyan működik, és ha ez jó választás minden épített webhelyhez.
A Bootstrap API beillesztése a HTML fájlba
Néhány lehetőség van a Bootstrap beillesztésére a fő projektfájlba. Az első lehetőség az összes szükséges Bootstrap fájl beillesztése a projektbe. Ezt úgy teheti meg, ha letölti a csomagot, és feltölti a projekt mappájába. Természetesen össze kell kapcsolnia az elsődleges Bootstrap CSS fájlt a dokumentummal. A Bootstrap hivatalos weboldala lépésről lépésre ismerteti, hogyan kell ezt megtenni.
A másik lehetőség a csomag letöltésének kihagyása és a tartalomszolgáltatási hálózat (CDN) használata. A CDN lehetővé teszi az elsődleges rendszerindító fájlok összekapcsolását a HTML-dokumentummal anélkül, hogy letöltené azokat. Ez természetesen nem mindig jó dolog a professzionális weboldalak számára, mivel nem lennék túl gyors, hogy az üzleti vagy portfólióoldalomat sorsra hagyjam, ha az a szerver valaha is lemerül. A legjobb, ha a fájlok a projektben vannak, de a tanulás céljából a CDN csak jól fog működni.
A Bootstrap beillesztéséhez a HTML-dokumentumba csak be kell helyeznie a következő kódot a
címke a HTML dokumentumban:Miután ezeket a linkeket beillesztették a fejcímkébe, be kell állítania a Bootstrap osztályok használatának megkezdését. A dokumentumának így kell kinéznie:
Bootstrap és osztályok
A rendszerindító elemek osztályokra vannak bontva, amelyek csak egy csomó előre elkészített CSS-t tartalmaznak, amelyeket beilleszthetnek a jelölőbe. Osztályok beillesztése a jelölésbe könnyű, csak meg kell tudnia a használni kívánt osztály nevét, majd alkalmaznia kell az egyik HTML elemére az class = ”classname” érték felhasználásával, ahogy az egy előző cikkben tárgyalt.
A nehéz feladat annak kitalálása, hogy mindez hogyan működik együtt, hogy valami gyönyörűet hozzon létre. A Bootstrap-ben elérhető összes osztályt megtekintheti a hivatalos dokumentációból. A Bootstrap elsajátítása újabb történet. Ez nem valami, amit mi, vagy bárki más taníthatunk. Megnézheti az oktatóanyagokat az oktatóprogramok után, de ha sokkal több próbálkozás és hiba jár, hogy jobban megismerje a keret használatát. És ehhez hozzá kell járulnia a saját projektjeiben.
Ezt szem előtt tartva arra kérem, hogy indítsa el saját HTML-projektjét a számítógépen Atom vagy más szövegszerkesztő segítségével, vizsgálja meg, hogy mi a HTML és CSS osztályok lényege, majd kezdje el játszani a Bootstrap-szal. És ha ismer elegendő jelölést, akkor talán létrehozhat saját portfólió-webhelyet egy próbaüzemként.
A Bootstrap minden weboldal számára életképes lehetőség?
A Bootstrap remek keret, de életképes lehetőség minden létrehozott webhelyhez? Ez valóban a fejlesztőtől és a projekt követelményeitől is függ. Számos professzionális környezetben nem igazán választhatja ki, hogy milyen technológiákat használ, mivel ezek nagyrészt a projektmenedzser feladata. Ha az említett projektmenedzser a Bootstrap használatát választja, akkor ezt egy csomó egyedi CSS-rel is kombinálod. Ez az, ami általában teszi egyedivé és eltérővé a webhelyet a Bootstrapot használó többi webhelytől.
Én személy szerint nem látom, hogy a Bootstrap minden webhely számára remek lehetőség legyen. Persze, ez segíthet és nyújthat néhány hivatkozást, de végül azt tapasztaltam, hogy a CSS-től kezdve az alapoktól történő tervezés a legjobb út, főleg az ön feletti ellenőrzés miatt. De ismét, ha csak most kezd el kezdeni a web-programozással, akkor nem rossz a Bootstrap használata, de ne támaszkodjon erre a karrierje során.
Érdemes megjegyezni, hogy ha kezdő fejlesztő vagy, akkor a portfólió összes projektjéhez nem szabad a Bootstrap-ot használni. Előfordulhat, hogy jártas lehet az API-val, de nem ismeri teljesen a CSS körül. Ennek ellenére jó, ha mindkettőnek megfelelő keveréke van a portfóliójában (vagy akár kizárólag a CSS-hez, mivel könnyű felvenni a Bootstrap-ot).
Záró
Ez minden, ami a Bootstrap dióhéjban található. Mint már korábban említettem, arra buzdítom Önt, hogy indítsa el saját HTML projektjét, és adjon hozzá néhány különféle osztályt az elemekhez, hogy elkezdje a keretet. A Bootstrap összes összetevőjét itt találja, magyarázattal és kódpéldákkal.
A Bootstrap valóban egy ügyes eszköz, de ne feledje, hogy nem hagyatkozhat rá egyedül! Jó, ha ismerjük és megismerjük a keretet, de ügyeljünk arra is, hogy belemerüljünk a CSS-be, hogy valóban megértsük, mi történik a színfalak mögött. Nemcsak ez, de a CSS-nek nyújtott szilárd ismeretek is nagyon sokat bókolnak a Bootstrap-hez, lehetővé téve, hogy valóban elkészítsen néhány egyedi és gyönyörű weboldalt saját testreszabásával.
