These bundles means that only one or two payloads of data need to be downloaded by a browser.
We primarily use Gulp in conjunction with NodeSass to compile source SCSS stylesheets in to browser compatible CSS payloads.
Whilst Compass does this out of the box, the compile times are terrible and we recommend against using it in favour of using NodeSASS with a Compass shim.
There are a few different pre-processed variants of CSS: We primarily use Scss for Magento 1 and other projects and Less for Magento 2.
- Scss (Sass)
We rarely start from scratch when working with stylesheets, here is a list of some of the frameworks we work with day to day.
When working with Bootstrap, do not use the grid column classes directly, write your own classes that use the mixins.
Whilst you can easily grab the frameworks by downloading directly from their site, it is strongly recommended you do not do this if possible.
yarn to get bootstrap as a dependency and pull it in that way.
We use the package managers mentioned above to allow the frameworks to be updated (like with
Composer for PHP),
it also stops us editing the files directly in
- VueJs Components
JS frameworks appear every other day but we have boiled our favourites down to a select few that have remained present and stable.
- VueJS 2.x
- KnockoutJS (for Magento 2)