Developing web applications with HTML, CSS, JavaScript and Angular

During this training, we will learn how to create a web application by combining HTML, CSS, JavaScript and Angular. In this eight-day ABIS course, we will study the basics of each of the subjects, as well as how to integrate them with a back-end application via an API call.

HTML (Hypertext Markup Language) is a standard language designed for creating pages and sites for the World Wide Web. Although today many simple web sites are created using a graphical productivity tool, a sound knowledge of the syntax and semantics of HTML remains a requirement for building more sophisticated sites, such as those using scripting languages (such as JavaScript, PHP, or Perl) or using HTML5.

In addition to HTML tags, a modern web page uses CSS (Cascading Style Sheets) for styling and often includes interactive elements such as links, forms, and JavaScript functionality.

JavaScript is a simple object-oriented programming language that interacts with HTML pages. This makes it possible to develop webpages which are more interactive and dynamic than with HTML alone.

While HTML is the perfect tool for creating static documents, it isn't really suitable for creating dynamic views in single-page applications. Angular, an open-source framework developed by Google, allows us to create front-end web applications. Angular is a complete rewrite from the same team that built AngularJS. We'll learn how to write a complete single-page web application (SPA), in accordance with best practices for web development. You'll get acquainted with Angular's main building blocks: modules, components, templates, metadata, data binding, directives, services and dependence injection. 

At course completion the participant will

• be able to create a web application by combining HTML, CSS, JavaScript and Angular
• know to integrate an API call in their application

Intended for

This course is intended for aspiring front-end web designers who want to increase the appeal and functionality of their web pages.

Backgroud

Some programming experience is required (see course Programming fundamentals).

You can test yourself to see if you have enough background by filling out the online selftest "introduction to programming".

Main topics

• HTML5
  • Basic structure of an HTML document
  • Text formatting with HTML elements
  • Styling with CSS (inline, embedded, external)
  • Images and embedded media
  • Tables
  • Forms and HTML controls
  • New HTML5 features
• JavaScript
  • How to include scripts in an HTML page
  • Syntax: variables, data types and operations
  • program flow: if-else, switch, while, do while, for
  • functions: declaration, rest parameters, function expressions, arrow functions
  • The Document Object Model (DOM)
  • Event based programming: event listeners
  • OO programming: JSON, classes, objects, modules
  • Common JavaScript objects
  • Forms, validation and navigation
  • Error Handling
• Angular
  • Angular Introduction: history, installation and tooling, application setup
  • TypeScript
  • Binding, Pipes and Directives
  • Using models
  • Components: Input/Output
  • Angular Modules
  • Reactive and Template-driven forms
  • Routing
  • User input & form validation
  • Services and Dependency Injection 
  • Observables and RxJS: Change Events and API calls

Training method

Classroom training consisting of alternating explanatory presentations and hands-on exercises.

Delivered as a live, interactive training: available in-person or online, or in a hybrid format. Training can be implemented in English, Dutch, or French.

Certificate

At the end of the course session, the participant receives a 'Certificate of Completion'.

Duration
8 days.