okf:n tyyliohjeen mukainen reveal.js presentaatiopohja

[pe3]

Gistiin mahtuva (ei voi sisältää kansioita) presentaatiopohja OKF-tyyliohjeen muikaisen reveal.js-presentaation tekemiseen.

• revealin asennusohjeen kloonaamisen sijaan asentaminen npm:llä tai bowerilla
• gruntin sijaan gulp.js
• okf-tyyliohjeen pilkkominen css:ksi tai design-systeemiksi

Motivaatio

• harjoitella gulpinkäyttöä
• ottaa tuntumaa design-systeemi-ajatteluun
• tuottaa repo-kloonaamista minimaalisempi ja riippuvuushallitumpi projektipohja

[d2s]

Gulp.js on vielä aika tuntematon itselleni joten olisi kyllä kiinnostusta olla mukana opettelemassa.

Design systems –ajattelu ja grid layout –ajattelu on myös lähellä :heart: sydäntä.

[pe3]

@d2s jos vähän konkretisois

NPM ja Gulp on mulle tuttuja. Tehtäisiin siis kansio, johon tulee package.json- ja gulpfile.js, index.html ja .gitignore-tiedostot. Kun kansiossa sanoo npm init asentuvat tarvittavat koodit node_modules-kansioon ja index.html rupeaa suurelta osin toiminaan. Gulpilla tarjotaan erilaisia toimintoja. Ainakin lokaali reaaliaikaisesti päivittyvä http-serveri, jonka avulla presentaation näkee reaaliajassa selaimessa, samalla kun editoi index.html-tiedoston sisältöä.

Mutta mitä design systems voisi tässä tapauksassa konkreetisti tarkoittaa?

[d2s]

@pe3 NPM, Yeoman ja Grunt kohtalaisen tuttuja ennestään. Pitää vaan oppia että miten määritykset kirjoitetaan Gulp –työkalun vaatimassa formaatissa.

Design Systems

Tässä tapauksessa tarkoitin ehkä enemmän visual design patterns –ajattelua tyylioppaasta löytyvien elementtien ottamiseksi mahdollisimman helposti käyttöönotettavaksi.

Erillisiä alijärjestelmiä on toki olemassa:

• Grid layout(s)
• Typography
• etc.

Lähinnä uudelleenkäytettävien moduulien rakentamista ja kokoamista, massiivisen frameworking sijasta. Tehtävä mahdollisimman helpoksi muuttaa / vaihtaa / ottaa käyttöön lisäpalikoita uusissa sekä jo olemassaolevissa projekteissa. Selkeä jakaminen eri rakennetasoihin voi auttaa tietyssä määrin.

css-burrito on yksi esimerkki tyylitiedostojen rakenteesta, tosin siinäkin on omat rajoitteensa.