JavaScript Web Application Development

2 days (14 hours)

Webinar gratuit

9 Juillet 2020

Migration vers Google Cloud

Inscrivez-vous gratuitement

Course overview

This training covers the fundamentals of web application development with JavaScript. These basics are essential for the development of front end applications in JavaScript.

The code execution model, which is based on the concept of event loop, will be explored in detail. The fundamental APIs available in a modern web browser will be used: global window object, DOM, events, ajax communication, server-sent events, websockets, data persistence via web storage or indexedDB, code execution in the background via web workers…

Learning outcomes

This course teaches participants the following skills:

  • Embed your JavaScript code in a web application
  • Master the global window object and basic APIs
  • Use the document API to manipulate the structure of a web page
  • React dynamically to events
  • Use forms
  • Use the main APIs (ajax, server-sent events, web sockets) for communication with a backend
  • Persist data locally in a web browser
  • Improve user experience by running code in the background

Prerequisites

To get the most out of this course, participants should have:

  • Basic knowledge of HTML
  • Have taken the course ‘JavaScript: language fundamentals’ or have equivalent knowledge

Target audience

This course is intended for the following participants:

  • Developers, integrators, software architects, technical project managers

Course Outline

1 Introduction to web development with JavaScript - Where and how to integrate JavaScript code - Scripts and Modules - APIs for Web application: programming model, event loop and events.

Workshops: - Case studies: JavaScript code integration

2 First APIs - The global window object and its main properties - Location interface - History interface - Navigator interface

Workshops: - Get information about the current browsing context - Navigation management

3 Interact document - The Document interface, the DOM tree and other notable interfaces - Create, access, modify, delete elements of the DOM tree - Editing attributes and styles - Points of attention regarding performance - Virtual DOMs

Workshops: - Dynamic manipulation of the DOM

4 Event management - Principles of event management: EventTarget and Event interfaces - The phases of the events: capture, bubble,… - Event management via addEventListener or on-event handlers. - Managing the object ‘this’ - Main events associated with HTML elements.

Workshops: - Management of the main web events: mouse, keyboard,… - Drag and drop implementation

5 Form management - Access the elements of a form - Form events - Validate a form

Workshops: - Dynamic forms

6 Communicate with a backend - Comparison of different possible strategies - JSON format - RESTFul API: consumption via XMLHttpRequest and Fetch - Server-sent events: react to push events server - Web sockets: two-way communication with a backend

Workshops: - RESTFul API consumption via XMLHttpRequest and Fetch - Implementation of an SSE client - Implementation of a web sockets client

7 Persistence and data query - Overview of data management technologies in a browser - Cookies: APIs, disk space management, privacy and security - WebStorage: APIs, disk space management, privacy and security - IndexedDB: APIs, disk space management, privacy and security

Workshops: - Cookies management - Using web storage - Using IndexedDB

8 Running scripts in the background - Introduction to web workers - Infrastructure - APIs accessible from web workers

Workshops: - Creation of web workers for calculation tasks and web I/O

€1000 ex. VAT

Contact us

You can unsubscribe from our communications at any time.

In order to take into account your request, we must store and process your personal data. If you authorize us to store your personal data for this purpose, check the box below.

By clicking on « Send » below, you authorize SFEIR to store and process the personal data submitted above so that it can provide you with the requested content.