Web Development Introduction using MEAN Stack

Web Development Introduction using MEAN Stack


This course is for Web Developers seeking knowledge of web applications best practices.


An appreciation of Web development and a basic understanding of HTML would be advantageous.


5 days. Hands on.

Course Objectives

This five day introduction covers the modern web development stack of HTML5, CSS and JavaScript, plus concepts such as responsive design and AJAX. The course concludes by looking at NodeJS runtime environment and JavaScript Libraries – specifically AngularJS. The aim is to illuminate modern web app development best practices.

Course Content

Tags, Elements, Attributes and the Document Object Model (DOM)
Layout containers: DIV and Semantic Tags
HTML5 forms: fields

Tag, Class and ID styles
Compound styles and the cascade

The oddities of JavaScript: loose data-typing, type coercion, closure, variable hoisting
Single-threaded execution, web workers and garbage collection
Syntax, lexical structure, scopes, loops and conditionals
Debugging and error handling: strict-mode and try-catch blocks
ECMAScript 3, 5: arrays, objects, prototypes and inheritance
'Own' properties, iterable members, accessor & mutator methods and object configuration
ECMAScript 6: classes, code-blocks, arrow functions and other sugar-syntax
Traceur and Babel: transcoding ES6 for current devices and browsers
Functions, function arguments and name-spacing
Accessing and manipulation the DOM
Overview of client-side persistence: localStorage and client-side databases
Events: bubble, capture, preventDefault, target and currentTarget
Event call-back listeners and asynchronous promises
Ajax: consuming data with XMLHttpRequest
Working with RESTful services
Dependency injection and Asynchronous Module Definition
Architectural approaches: decoupled modular script development
Model View Controller (MVC) and Model View View-Model (MVVM)
Recognizing and using other common JavaScript design patterns
Writing performant, maintainable JavaScript

Overview of common web threats: CORS, XSS, sandboxing
Overview of common approaches to securing web applications

NodeJS, Building and Testing
Understanding NodeJS and the Node Package Manager (npm)
Setting up a Selenium testing server under NodeJS
Configuring tests with NodeJS, Karma and Protractor
Unit Testing: writing test specifications
End-to-end testing: automated multi-platform and headless testing
Automated build tools: Grunt, Maven etc.

Overview of Modern Libraries and Frameworks
Comparing popular JavaScript libraries and frameworks
jQuery: ideal for DOM manipulation

AngularJS Introduction
AngularJS: perfect for large data-driven web apps
Angular modules: app and controllers
Directives, bindings and scope
Nesting scopes
Architecting an AngularJS app: Model View controller and Model View View-Model
Iterating over collections
The digest cycle
Overview of AngularJS navigation: view states and URL parameters
Introduction to Ajax in AngularJS using $http
How providers work in AngularJS
Creating custom directives
AngularJS 2 and ES6: the massive changes in store for the whole of web development

Virtual Courses

ALL of our courses can be delivered virtually. And our Bath public schedule of courses are now available as live virtual sessions, using the popular Zoom Virtual Classroom and remote labs. Delegates can test their access at: www.zoom.us/test

On-Site Courses

Can't attend one of our public classes? Booking for multiple people?

All our courses are available on your site! Delivered for your staff, at your premises.

Contact us to find out more...