
Introduction to Modern Front-End Development
Tools and Techniques for Working with CSS, JavaScript, and HTML
Publisher: Infinite Skills
Release Date: September 2015
Duration: 3 hours 07 minutes
Watch on Safari with a 10-day trial
Start your free trial nowWhere's the cart? All videos are now exclusively on Safari. Questions? See our FAQ or contact customer service:
1-800-889-8969 / 707-827-7019
support@oreilly.com
You will start with an introduction to the command line and Git, then jump into learning how to create a project with Yeoman. From there, Adam will teach you how to use a front-end build tool. This video tutorial also covers HTML templating, CSS pre-processing and post-processing, and modular JavaScript code. Finally, you will learn about front-end testing, including unit testing JavaScript and automated accessibility testing.
Once you have completed this computer based training course, you will be fully capable of applying these techniques, tools, and best practices to your own web development projects.
Table of Contents
Chapter: Introduction
Introduction
01m 28s
About The Author
01m 0s
Your Text Editor, Terminal, And Browser
01m 26s
Installing Node
01m 0s
Using The Working Files
01m 15s
Chapter: The Terminal And Git
Command Line Introduction And Navigating The File System
04m 9s
Creating Directories And Files
02m 31s
Git Introduction And Installation
02m 52s
Git Basics
07m 25s
Working With GitHub
07m 16s
Chapter: Project Scaffolding And Working With Dependencies
Generating A Project With Yeoman
05m 9s
Managing Front-End Dependencies
07m 28s
Chapter: Using A Front-End Build Tool
Introduction To Build Tools And Gulp
05m 50s
Using Gulp For Repetetive Tasks
04m 14s
Using Gulp To Minify Assets - Part 1
06m 42s
Using Gulp To Minify Assets - Part 2
07m 10s
Chapter: HTML Templating
Introduction To HTML Templates And Handelbars
02m 36s
Our First Handlebars Template
06m 35s
Handelbars Template Partials
06m 25s
Handelbars Template Data
04m 39s
Chapter: CSS Pre- And Post- Processing
Introduction To CSS Pre-Processing And Post-Processing
02m 21s
Writing A Less Gulp Task
03m 30s
Modular CSS With Less
06m 33s
Less Variables
06m 28s
Less Mixins
04m 58s
Less Nesting And Link Styles
06m 42s
Layout With Flexbox
05m 21s
CSS Post-Processing And Auto-Prefix With Gulp
02m 27s
Chapter: Modular Javascript Code
Javascript Code Organization
03m 11s
Model-View-Helper Code Structure
02m 58s
Introduction To Browserify And Setting Up Our Browserify Gulp Task
05m 27s
Javascript Code Structure And npm Modules
06m 6s
Modularizing Our Javascript
04m 2s
More Models And Views - Part 1
03m 54s
More Models And Views - Part 2
08m 57s
Chapter: Front-End Testing
Introduction To Front-End Testing
03m 16s
Linting Our Javascript
05m 28s
Unit Testing Javascript
07m 52s
Automated Accessibility Testing
03m 50s
Automating Our Tests
01m 54s
Chapter: Conclusion
Resources And Where To Go From Here
04m 25s
Wrap Up
00m 49s