Frontend Development with Angular

Course Overview

Server-side developers (Java, .NET, and others) usually find the web platform as a mess. Some parts look quite interesting and advanced and some parts look like they were invented a decade ago.
Becoming a FED (Front End Developer) is a journey. First, we discover the power (and limitations) of the JavaScript programming language. Second, we explore browser APIs like DOM, AJAX, and HTML5 features. Last, we integrate them all into a modern client-side framework like Angular.
During this 5-day course, we will learn and deep-dive into every major concept that is a must for a serious FED. At the end of the course, you will be able to develop rich client-side web applications using the latest web technologies.

  • Who should attend

    Developers who want to get into Frontend development with Angular.

  • Prerequisites

    • Good familiarity with one of the OOP popular languages like Java or C#.
    • Basic familiarity with JS.
    • Basic familiarity with WEB world including HTTP, CSS, HTML.

Course Content

  • JavaScript Pitfalls
    • Typeof operator
    • Undeclared vs. uninitialized
    • Implicit variable declaration
    • Strict vs. abstract comparison
    • Arrays pitfalls
    • Where to declare variables
    • Apply & call
    • Self-executing function
    • Module pattern
    • Strict mode

     

    Advanced JavaScript
    • From module to class
    • Module pattern memory consideration
    • Function as constructor
    • New operator
    • Prototype
    • Prototypical inheritance

     

    The DOM
    • What is a DOM
    • DOM query
    • DOM manipulation
    • Event Handling
    • Event propagation
    • DOM selection, traversal & creation
    • jQuery

     

    CSS
    • The Big Three.
    • CSS Versions.
    • Linking vs. Embedding vs. Inline.
    • Importing.
    • Cascading.
    • CSS Selectors.
    • Pseudo class & Pseudo element.
    • How to calculate specificity.
    • !important.
    • Inheritance.
    • Box Model.
    • box-sizing.
    • Colliding Margin.
    • Inline vs. Block Element.
    • Line Box.
    • Floating.
    • Positioning.
    • Which size unit to use.
    • Introduction to SASS.
  • Ajax
    • What is AJAX?
    • XMLHttpRequest.
    • Threading Model.
    • Concurrent XMLHttpRequest(s).
    • Fetch API.
    • Cache Killer.
    • Working with JSON.
    • JSON Limitations.
    • Same Origin Policy.
    • JSONP.
    • CORS.
    • Promise & Deferred.

     

    HTML5
    • What is HTML5?
    • W3C vs. WHATWG.
    • What’s New.
    • History API.
    • Web Storage.
    • IndexedDB.
    • File API.
    • Form Validation.
    • Web Workers.
    • Web Sockets.
    • Offline Web Applications.

     

    Angular
    • What is a SPA.
    • Popular SPA Frameworks.
    • Getting Started using @angular/cli.
    • Writing a simple component.
    • Styling a component.
    • Parent/child component interaction.
    • Custom provider.
    • Dependency injection.
    • Sibling components interactions.
    • Understand change detection.
    • Component lifecycle hooks.
    • Testability using Jasmine & Protractor.
    • Introduction to Angular Material.
    • Communicating with an API.
    • Managing auth.

Want to learn Front end development using Angular?