Connexion Découvrir Premium
Retour aux formations
HTML5JavaScript Premium

Comment programmer des jeux pour le Web

Apprenez à programmer des jeux pour navigateur avec JavaScript et HTML5 : sprites, animations, contrôles, sans moteur de jeu.

  • NiveauIntermédiaire
  • Durée3 h 46 min

Présentation

Découvrez comment construire les bases d’un jeu vidéo directement dans votre navigateur avec JavaScript et HTML5.
Vous commencerez par préparer votre environnement de développement et découvrir le langage JavaScript. Vous apprendrez ensuite à afficher des images, à organiser une boucle de jeu et à déplacer vos premiers sprites au clavier.
La formation vous guidera dans la création de composants réutilisables : chargement des images avec une jauge de progression, gestion des sprites et animations à partir de planches d’images.

Objectifs pédagogiques

  • Préparer son environnement de développement et exécuter du JavaScript.
  • Mettre en pratique le langage avec un exercice inspiré du Picross.
  • Construire une boucle de jeu et gérer le temps entre les images.
  • Afficher et déplacer un sprite au clavier.
  • Charger les ressources et créer des animations depuis une sprite sheet.

Prérequis

Être à l’aise avec la manipulation de fichiers sur ordinateur. Connaître les notions de variables, conditions, boucles et fonctions est conseillé pour suivre les explications plus facilement. Aucune expérience préalable en programmation de jeux web n’est nécessaire.

Contenu protégé

Accédez au contenu de cette formation

Connectez-vous avec un compte Premium ou découvrez l’offre pour consulter l’ensemble du contenu.

Devenir Premium Se connecter

Votre parcours

Programme de la formation

20 leçons
01

Préparer son environnement JavaScript et HTML5

2 leçons · 16 min
  1. Installation de votre environnement de développement Premium
    7 min
  2. Votre premier code Premium
    9 min
02

Découvrir JavaScript et pratiquer ses premières instructions

3 leçons · 54 min
  1. Apprenez JavaScript Premium
    38 min
  2. Exercice Premium
    5 min
  3. Solution Exercice Premium
    11 min
03

Afficher et contrôler une scène de jeu

7 leçons · 49 min
  1. Au menu Premium
    2 min
  2. Organisation des fichiers Premium
    1 min
  3. Gameloop Premium
    11 min
  4. Image et Sprite Premium
    9 min
  5. Deltatime Premium
    6 min
  6. Déplacer l'image Premium
    12 min
  7. Bonus - RequestAnimationFrame Premium
    8 min
04

Charger les images et animer les sprites

8 leçons · 1 h 47 min
  1. Introduction au chargement des images Premium
    8 min
  2. Fonctionnement de l'ImageLoader et révision tableaux Premium
    8 min
  3. On code l'ImageLoader Premium
    29 min
  4. Sprite Sheet, la théorie Premium
    4 min
  5. Nettoyage du projet et accès aux images Premium
    4 min
  6. Clipping Premium
    18 min
  7. Pixel Art Premium
    5 min
  8. Système D'animation Premium
    31 min