SFEIR InstituteJSDEVWEB

JavaScript Web Application Development

2 days / 14h

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…

Target audience

  • 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

  • Developers, integrators, software architects, technical project managers

Course Outline

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

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

Our training sessions

Place of training :
Dates
17/12/24 Distance Register

Ce cours vous intéresse ?

Place of training :
Dates
17/12/24
Distance Register
1
Inter : 1000 € HT / user

Funding assistance

Organiser une session de Groupe
Demandez un devis
Organize a dedicated session
for your organization
Does your company need a personalized
offer? Contact us