Karkaso pasiūlymas

Ką tik praleidai šešias pamokas rašydamas ranka kiekvieną puslapio eilutę — HTML, CSS, responsyvų tinklelį, formą. To pabaigoje laukia teisingas klausimas: ar turėjai? CSS karkasas (framework) žada didžiąją to dalį praleisti.

Pasiūlymas

Karkasas — didelis, paruoštas stiliaus failas (dažnai su šiek tiek JavaScript), kuris paduoda tau baigtus gabalus. Užuot rašęs CSS, rašai HTML naudodamas karkaso klasių vardus, o jo stiliaus failas priverčia tas klases atrodyti teisingai — apiformintas, responsyvias, nuoseklias per naršykles. Bootstrap yra archetipas ir vis dar vienas naudojamiausių. Kortelė Bootstrap'e apytiksliai yra:

<div class="card" style="width: 18rem;">
  <img src="…" class="card-img-top" alt="…">
  <div class="card-body">
    <h5 class="card-title">A Dust Angel Nebula</h5>
    <p class="card-text">2016-04-28</p>
  </div>
</div>

Neparašei nei .card, nei .card-body — Bootstrap parašė. Puslapį surenki iš jo žodyno: btn btn-primary mygtukui, col-md-4 tinklelio stulpeliui, navbar navigacijai. Per popietę gali turėti profesionaliai atrodančią, responsyvią svetainę net neatvėręs stiliaus failo.

Atkreipk dėmesį, ką jis pakeičia

Įsižiūrėk į tą kortelę ir pamatysi kai ką pažįstamo: tai tavo kortelė iš trečios pamokos, tik kitais klasių vardais. Tu sudėjai .btn, .picture-card, responsyvų .grid, .navbar. CSS karkasas yra būtent tie dalykai — didelė, bendros paskirties versija to, ką ką tik padarei ranka — supakuota taip, kad niekada jų pats nerašytum.

Tai ir visa idėja, ir ji tikrai patraukli. Komandai, kuriai reikia kitą savaitę pristatyti administravimo skydelį, nerašyti mygtuko, kortelės, tinklelio, modalinio lango ir formos nuo nulio — ir gauti tarpnaršyklinį bei responsyvų elgesį nemokamai — yra milžiniška pradžia.

Bet „niekada jų pats nerašai" pjauna į abi puses, ir likusi šios pamokos dalis — apie tą mainą. Esi vienintelėje padėtyje, iš kurios gali jį iš tikrųjų įvertinti: žinai, kas po klasių vardais, nes pats tai parašei.