Style Guide Driven Development: All hail the robot overlords!
The current pace of front-end development is too much to keep up with. There's not enough time to read about the latest tools and techniques, let alone to implement them! And let's face it: our CSS sucks anyway. What we need is someone to do most of the work for us, so we can focus on better CSS. ROBOTS!
Fortunately, we are also in the midst of a great transformation in computer programming; agile development is showing us how to iterate our projects so that we can reduce our risk of failure. And agile development requires automation to achieve its goals.
Agile development gives us robots. Lots and lots of robots.
If you look at integrating agile development with web development, you'll discover it's actually very simple. It's called Styleguide-Driven Development.
In this session, we will discuss the two requirements for Style Guide Driven Development: component-based design and automated robots. Our robots will scaffold our projects, build our CSS from Sass or Less, build a living style guide and lint our CSS and JavaScript to warn us of code smells and errors. All hail our new robot overlords!
Topics covered:
- OOCSS, SMACSS and BEM for components
- Fugly selectors and @extend for bad Drupal CSS
- kss-node for style guides
- Gulp.js for task building
- scss-lint for Sass linting
- eslint for JS linting
- Bundler, npm-shrinkwrap and git for version control