The JavaScript Road Trip

JavaScript Web

JavaScript, the only language that actually runs everywhere. From big servers in the cloud to tiny watches on your wrist. No wonder its gained such popularity. Spend 5 days with this powerful scripting language, and get up to speed with all the newest web technologies in popular use today. This 5 day course is aimed towards developers who know JavaScript, have used JavaScript, but wish there had a much better grasp on the topic. This course assumes basic knowledge of JavaScript, and will not bore you basic syntax, but it starts by furthering your knowledge by arming you with better structure of your code, cool things you can do with functions, various debugging tricks and tips, measuring performance when writing complex JavaScript. From there it teaches you all the new popular JavaScript frameworks that you keep hearing about, in a very nicely organized, easy to understand logical fashion. There are plenty of hands-on labs. At the end of 5 days, those parenthesis and square brackets will roll off your fingers.

Basic and Advanced JavaScript

The very basics of JavaScript
This module level sets everyone, it introduces you to the very basics of JavaScript, variables, language syntax, referencing files, loops, conditions, built in functions and custom functions, arrays etc. If everyone already knows this stuff, we can jump over this module quickly.

Stepping to the next level
So you know JavaScript, or do you? This module takes intermediate JavaScript levels to expert level. In this module we will talk about:

  • Functions as expressions, closures to structure your code, IIFE
  • Default and guard operators
  • Delete operator
  • The concept of nested scopes and the confusion around "this"
  • Objects and Prototypes, and how you can mimic things in JavaScript that are fundamentally reserved for higher level languages
  • Object reflection and property enumeration

Best Practices and Debugging tricks
Now that you are a JavaScript expert, it is time to solidify that knowledge with some best practices and debugging tricks. Along with common pitfalls and how to avoid them. And how can you organise your code in modules to keep it maintainable and understandable.

The most common JavaScript mistakes
JavaScript is great! But it is so easy to write bad JavaScript. This module familiarises you with the most common mistakes advanced developers from other languages make when writing JavaScript. In the process it teaches concepts like:

  • Globals and scopes
  • Hoisting
  • Nesting and nested scopes with memory leaks
  • Arrays and their issues
  • For loop issues
  • Function issues
  • Literals and their issues
  • Performance tips, and more...

jQuery

An introduction to jQuery
So you know JavaScript. It is time to learn the most popular JavaScript framework, which is jQuery. What is jQuery, what is it good for, and what can it do? 

DOM and jQuery
Search and walk through the DOM with selectors and traversing. Add and remove elements from the DOM.

jQuery and Events
Listen for events, handle them, and even change default event behavior with jQuery.

Styling with jQuery
CSS can be tough! Especially when you need to style things dynamically. But jQuery make things so much easier. Also animation, everyone loves animation.

AJAX and Forms

  • Create responsive sites with Ajax and jQuery. Understand how jQuery helps you create responsive pages that do not refresh and make use of Ajax.
  • Understand promises and deferreds
  • Understand jQuery utility methods such as $.each, $map

Popular jQuery plugins

Angular JS

An introduction to AngularJS
AngularJS is a structural framework for dynamic web apps. It lets you use HTML as your template language and lets you extend HTML's syntax to express your application's components clearly and succinctly. This module gets you started with AngularJS showing the basic syntax and some quick starts to get us running.

Models, Controllers and Views
Controllers in AngularJS is a fundamental building block of Angular. AngularJS encourages better code architecture by encouraging you to use MVC based patterns. There is rich support for controllers and views, and this module will familiarize you with those.

Templates and DataBinding
When working with complex forms or even reactive user interfaces, it really helps to leverage concepts such as databinding. Databinding in JavaScript is especially valuable but can be difficult to implement, unless you use something like Angular.

Services in Angular, Dependency Injection
Services in Angular are substitutable objects that are wired together using dependency injection. Fancy! What the hell does that even mean. Well for one, services are a classic way of bundling together reusable code across controllers in your application, and they can be lazily instantiated or singletons. There are services that angular provides, like $http, or ones you can create, and then there is something called interceptors. This module gets in in the deep of AngularJS services.

Directives
Directives in AngularJS are markers on DOM elements that tell AngularJS HTML compiler to attach some specified behavior to that particular DOM element or its children. There are many directives, like ngBind, ngModel, ngClass, and this module shows you the most important directives.

Routing and Single Page Applications (SPA)
AngularJS routes enable you to create different URLs for different content in your application. Having different URLs for different content enables the user to bookmark URLs to specific content. Single Page applications allow you to write HTML and JavaScript code, that more or less performs and behaves like a thick client application. Its pretty neat, trust me you'll be using this.

TDD with AngularJS
Test driven development, the holy grail of programming, has made a late entry into JavaScript. UI is hard to TDD, JavaScript is usually intertwined with UI, but Angular brings sense to this madness. This module explains how Angular has thought of TDD from the ground up, and how you can take advantage of it as well.

AngularJS best practices
AngularJS is a big platform, and there are many ways to write AngularJS incorrectly. This module walks you through well accepted best practices, and the reasons behind those best practices.

Node JS

Node JS
Node JS is server side JavaScript, running in the same JavaScript engine that runs in the chrome browser. This module provides a basic introduction to NodeJS, followed by handling events in NodeJS, Streams, Modules, Socket.io, and persisting data. It also talks about some limitations of NodeJS where NodeJS may not be a better choice than say C# or Java.

TypeScript and Angular 2.0

TypeScript
There is really no reason to not use TypeScript today. As a transpiler it brings future features to you today, and brings exciting features such as static typing, and better IDE support. This module introduces you to why TypeScript is a big deal, TypeScript syntax, and how to include TypeScript in your usual workflow.

Angular 2.0
Angular 2.0 isn't out yet. But that should not stop us from keeping an eye on what is coming down the pike. Angular 2.0 takes advantage of newest browsers, offers better performance, and better and more modular code structure. What is new in Angular 2.0, and how should you write your code today for an easy transition to Angular 1.0 tomorrow? This module talks about all that.

Bootstrap and cross platform mobile apps

Bootstrap
Bootstrap allows you to build great looking responsive websites that work well in different sized devices. This module introduces you through examples various bootstrap concepts, components, page design, and JavaScript functions in Bootstrap

Cross Platform Mobile Apps: Cordova

  • This module requires a mac for the labs.
  • Yes, it is possible to write Android and iOS apps without knowing ObjectiveC/Swift or Java, or let's just say you can get by with a lot. Armed with all this knowledge so far, this module will introduce you to Cordova application development, and tips and tricks you need to know to write good cross platform hybrid apps, that feel, walk, talk, and act native. Seriously, you won't be able to tell the difference!

Pre Requisites

Attendees must have some working knowledge of JavaScript and HTML.

Tid

09:00 - 16:15

Emner

The very basics of JavaScript

Stepping to the next level

Best Practices and Debugging tricks

The most common JavaScript mistakes

An introduction to jQuery

DOM and jQuery

jQuery and Events

Styling with jQuery

AJAX and Forms

Popular jQUery plugins.

An introduction to AngularJS

Models, Controllers and Views

Templates and DataBinding

Services in Angular, Dependency Injection

Directives

Routing and Single Page Applications (SPA)

TDD with AngularJS

AngularJS best practices

NodeJS

TypeScript

Angular 2.0

Tilleggsinfo

Attendees will need to bring their own laptop to this course.