Jak nám pomohl Bootstrap 4, BEM a OOCSS při vývoji nového e-shopu

(10. 1. 2019) Jak nám pomohl BEM, OOCSS a Bootstrap 4 při vývoji nového e-shopu

V Pilulce jsme ke konci minulého roku začali vyvíjet nový e-shop, který byl za rok oficiálně spouštěný. V tomto článku se s vámi rádi podělíme o technologie a postupy, na kterých stavíme frontendovou část.

Bootstrap 4 & BEM & OOCS

Bootstrap 4 jsme zvolili pro jeho vyzrálost, dokumentaci, respektování DRY a podporou mezi prohlížeči. Z dlouhodobého pohledu se nám BT4 vyplácí, píšeme mnohem méně CSS a atomické třídy nám dovolují rychlejší vývoj.

Komponenty „mimo“ konvenci BT píšeme standardně BEM metodikou. Máme také napsané vlastní atomické třídy pro změnu velikosti fontu na odlišných breakpointech a pod.

ECMAScript 6 & Webpack 4

JavaScript stack stavíme na ES6, komponenty ve Vanilla JS kompilujeme přes Webpack pro odlišné verze e-shopu. Dynamické části jako je našeptávač, objednávkový proces, či uživatelský účet obsluhuje Vue.js.

Volné pozice

O autorovi

Tomáš Smetka Frontend developer

V Pilulce mám na starosti frontend nového e-shopu www.pilulka.ro, který pohání Bootstrap 4 doplněný vlastními atomickými třídami, komponenty ve Vanilla JS & Vue.js a šablonovacím systémem Latte.

Používáme Webpack ve 4 verzi, Yarn, Stylelint, JSLint, SASS, Babel, ECMAScript 6.