Front end documentation

Aim

To create a set of documents that covers most aspects of front end work.

Markup and styling

CSS

• Naming conventions
• Specificity
• BEM

Sass

• What is Sass
• How to use Sass
• Variables
• Mixins
• Functions
• Placeholders
• Other features (maps, loops, etc.)

HTML

• Basics of HTML 5 document
• Document Object Model (DOM) - What is it?
• Meta data for headers

Interactivity and Apps

JavaScript

Jquery

• Adding jQuery to a page
• Using jQuery to select things
• Getting information from the DOM
• Updating the DOM

React

• Introduction to React

Examples

• React - Basic example - A modern JS (ES6) React app using WebPack to compile and Babel to transform to ES5

Command line tools, package managers, bundlers and pipelines

Gulp

• Basic Concept
• Basic Config
• Plugins
• PostCSS

WebPack

• Basic Concept
• Basic Config
• Plugins

Misc

Analytics

Advertising

Optimisation

• Best practices for optimising page speed and tools to use

Resources

To save digging around existing projects for code examples and then cutting out the unnecessary parts...

WebPack configs

• React - ES6 / Babel