On Github drublic / socoded-init
Freelancer, Front-End Developer
Freiburg, soon Cologne
and others: github.com/drublic
DRY
Boilerplate Code
Tackling the Problems
Components
Repetition from project to project
Same tasks to set up development and deployment
Teams need consistency
Use a framework or boilerplate
Find differences to your workflow/preferences
Apply changes you need
Start coding
_1 Frameworks and Boilerplates
_1 Frameworks and Boilerplates
_1 Frameworks and Boilerplates
_1 Frameworks and Boilerplates
_1 Frameworks and Boilerplates
based on HTML5 Boilerplate
_1 Frameworks and Boilerplates
_2 Differences to your workflow/preferences
_2 Differences to your workflow/preferences
_3 Apply changes you need
Code a lot before even starting
_4 Start coding
A minimum of good defaults
Faster starting point
Not much needs to be removed
You can learn a lot
Missing opinionated features
Extending takes a lot of time
A build tool
Preprocessors
Structure
Testing
A build tool → GruntJS
Preprocessors → Sass/LESS, Coffee Script
Structure → BEM/SMACSS for CSS
Testing → Jasmine/Mocha, Karma
DRY FTW!
Mostly my style of writing coding
Easily scaffold projects how you like it
Module, Widget, …
Wikipedia:
Component-based software engineering is a branch of software engineering that emphasizes the separation of concerns in respect of the wide-ranging functionality available throughout a given software system.
and goes on:
It is a reuse-based approach to defining, implementing and composing loosely coupled independent components into systems.
Separation of concerns
Loosely coupled
Independent
Reusable
Different parts of a web-page
Somehow similar to jQuery plugins
Without context
Responsive by default
Easily distributable within a team
Faster development
Better maintenance
Large websites (“wide-ranging functionality”)
Web applications
Style Guides
Small web projects?
Break down to a minimum (?)
But stay flexible
Markup
Styles
Functionality
User Interface Libraries
Forms, buttons, lists, messages, …
+ fast development
+ easily reusable
- more functionality than needed
- DRY?
It’s all about our workflow
Find good defaults for yourself
Use existing frameworks
Slides: drublic.github.io/socoded-init
Starting Front-End Projects — So Coded Conference - 19.09.2013 • Hans Chr. Reinl / @drublic