• 149 €

BOOT CAMP : Programmation de jeux Web avec JavaScript et HTML5

  • Cours
  • 68 Leçons

Formation 100 % en ligne
  • Comment maitriser JavaScript et HTML5 pour savoir programmer des jeux Web
  • Tous les secrets de la programmation Web, sans moteur, en pur code JS !
  • Suis la formation à ton rythme, quelque soit ton niveau en programmation
  • Même si tu as peu de temps et une vie de famille.

👉 + 4 heures de coaching en Live (+ Replay) pendant lequel on va coder un jeu "Frogger" pas à pas.

👉 + 5 heures de masterclass en Live (Replay) pendant lequel je code un shooter horizontal avec scrolling parallaxe !

"On est bientôt en 2025 et le cours est toujours aussi bon et pertinent ! J'apprends le JS pour la prochaine gamejam gamecodeur. C'est finalement vraiment proche du LUA je trouve voir même du C# avec les classes.

Assez bluffant devoir un sprite bouger à 240fps sur mon ordi dans chrome, exploitant les 240hz de mon écran!

A voir ce que ça donne quand on en affiche plusieurs centaines sur une map !

Merci David, un vrai plaisir."

Nico

Ce que tu vas apprendre


Il y a 2 façons de créer des jeux vidéo :

1. Créer des exécutables que les joueurs vont devoir télécharger

2. Créer des jeux "web" qui s'exécutent dans le navigateur (pas besoin de téléchargement)

La première façon a plusieurs inconvénients :

Seule une poignée de joueurs vont tester ton jeu, car télécharger est un frein.

Télécharger est synonyme de risque de virus. Les gens n'ont plus l'habitude car leurs habitudes ont changé avec les mobiles et les tablettes.

En revanche, la deuxième façon est sans risque pour les joueurs, et ne nécessite aucun téléchargement.

Le problème...

C'est qu'apprendre à programmer des jeux Web est de plus en plus compliqué.

De plus en plus de "moteurs" destinés à des programmeurs chevronnés voient le jour, avec leur lot de mise à jour et leux complexité.

Tout est en anglais.

De plus, apprendre à s'en servir c'est l'inverse du "evergreen skill" (ces connaissances universelles qui servent longtemps).

On devient captif de ces outils sans réellement savoir programmer de manière autonome.

Toi aussi, tu as peut-être ressenti ça :

Tu apprends un outil en suivant un "tuto" sans trop comprendre les détails.

Tu ne sais rien faire si on te mets devant une page de code vide...

Tu abandonnes et ne sort jamais un véritable jeu alors que c'est "ton rêve"...

Et c'est hyper frustrant.

Tu n'es pas tout seul.

Au début c'est l'euphorie.

On a des résultats rapides.

Puis on sature, on se perd dans la complexité du moteur qui nous "dirige".

On se rend compte qu'on ne sait rien faire sans "copier".

90% des gens qui se lancent dans l'apprentissage de ces outils vont abandonner et ne rien créer de concret.

La pseudo facilité est un leure.

Les gens se disent :

Je m'y remettrai quand j'aurai le temps.

Ou pire : je vais essayer un autre moteur, il sera meilleur.

Il existe pourtant une méthode simple pour créer des jeux web, garder le contrôle et aller au bout de ses idées.

Au lieu d'utiliser des outils sensés faciliter la vie.

Au lieu d'essayer tous les moteurs en pensant trouver celui qui fera le jeu à ta place.

Au lieu d'abandonner par découragement.

Il suffit de programmer en JavaScript pur...

D'utiliser HTML5.

Pas besoin de moteur.

Tout est déjà sous le capot de ton navigateur.

Pour ça, pas besoin d'outil à télécharger, à mettre à jour ou à apprendre.

Il suffit d'un éditeur de code gratuit et léger comme Visual Studio Code.

Et un navigateur (Chrome, Firefox, Edge...)

Quand j'ai commencé à apprendre JavaScript j'ai eu du mal à croire ce que je découvrais.

Je croyais vraiment qu'on ne pouvait pas créer de jeu sans moteur HTML5.

Que JavaScript seul allait "ramer" et ne permettait pas de programmer comme je le faisais avec Love2D ou Monogame.

J'ai découvert un univers inexploré...

On peut tout faire avec JavaScript et HTML5.

Des jeux fluides à 60 FPS.

Gérer images, sons, animations, contrôles...

Programmer tout les genre de jeux.

Programmer des jeux Web en code pur est une compétence puissante sur ton CV.

C'est un véritable atout devant un recruteur.

Cela démontre que tu sais programmer (car une démo réalisée avec un moteur ne prouve rien).

Cela démontrer que tu seras autonome, polyvalent et que tu n'as besoin de rien pour innover.

JavaScript est aujourd'hui LE langage à maitriser. Le Web est partout donc ce langage est partout (même Visual Studio Code est lui même codé en JavaScript !)

Alors voilà le défi que je te lance :

Apprendre à programmer en JavaScript + HTML5.

Créer un jeu d'arcade en quelques semaines, même modeste.

Et ajouter à ton arc la compétence "programmation de jeux web en pur code".

Si tu relèves ce défi, je te demande juste d'héberger ton jeu sur itch.io en 5 mn quand il sera achevé. Et de m'envoyer un lien pour que je puisse y jouer.

Tu peux commencer à te former dès aujourd'hui.

Pourquoi ce défi ?

Parce que pour avancer il faut se fixer un objectif.

Un objectif simple (un petit jeu d'arcade).

Et une deadline (une date limite).

Et montrer au monde entier ce qu'on a réalisé.

Les jeux Web permettent cela mieux que tout autre technologie.

L'objectif n'est pas de créer le jeu du siècle.

Un petit jeu d'arcade (comme qu'on va réaliser pendant le coaching).

Peu de fonctionnalités.

Il faut qu'il soit suffisament simple pour que tu sois quasiment sûr d'arriver au bout.

Tu prendra alors confiance en toi.

Et plus rien ne pourra plus t'arrêter.

Pour t'aider j'ai créé quelque chose :

Un Boot Camp JavaScript/HTML5 complet et 100 % en ligne

Mon Boot Camp vous propose une méthode complète pour maîtriser JavaScript et HTML5 et coder des jeux pour le Web sans utiliser de moteur
Pour ne plus être esclave des outils externes et des moteurs qui vont vous limiter dans votre créativité et vous rendre dépendant.

En tant que développeur, cette compétence sur votre CV peut faire la différence.

Comment programmer des jeux pour le Web avec JavaScript et HTML5 ?

Pour pouvoir inscrire la compétence « Développement de jeux HTML5 », vous devez être capable de construire un jeu complet sans utiliser de moteur : scènes, animations, scrolling, sons, contrôles, gameplay… Simplement en utilisant JavaScript et ce que permet HTML5 en natif.

Imaginez-vous devant un recruteur. Vous avez mentionné « Développement de jeux Web » sur votre CV. Pourtant, vous avez en réalité utilisé un moteur (Phaser JS, Pixi JS, …) et vous ne maîtrisez donc la programmation Web que superficiellement.

Ce recruteur souhaite innover (comme tous les studios de jeux vidéo) et pour cela il va vous falloir étendre le moteur JavaScript maison existant, ou développer votre propre framework JavaScript / HTML5. Mais hélas vous ne savez pas le faire car l’utilisation d’un moteur vous a détourné des véritables compétences nécessaire : architecture, algorithmique, maîtrise de l’API HTML5. Vous ratez alors l’emploi au profit d’un autre candidat plus compétent… 

Imaginez maintenant qu’une formation vous apprenne à construire pas à pas un framework maison pour coder des jeux Web sans moteur : Système d’update (Game loop), sprites avec animations depuis des Sprite Sheets, scrolling, contrôles, scènes, gameplay… 

Vous pensez que c’est une hérésie ? Qu’aujourd’hui il faut un moteur sinon c’est impossible de coder un jeu ? C’est une vision réductrice de la programmation qui va vous éloigner de votre objectif : devenir un véritable développeur, et avoir un CV en béton.

Programmer un jeu Web sans moteur est plus facile que vous ne l’avez imaginé.

JavaScript et HTML5 contiennent tout ce dont vous avez besoin. Tout est intégré à votre navigateur ! Et coder un framework opérationnel et évolutif est à votre portée.

C’est ce que je vous propose d’apprendre dès aujourd’hui.

J’ai construit une formation complète, claire, rapide, pour vous former à la programmation de jeux Web.

C'est pour trouver un emploi ? Comment se différencier face à tous les développeurs qui sont déjà sur le marché ?

Aujourd’hui le code est accessible à tous. Mais tous les candidats ne se valent pas.

Nombreux ont une maîtrise superficielle de la programmation. Ils ont des projets à montrer mais ils ne les ont pas totalement codés. Ils ont utilisé des moteurs, des assets préfabriqués, ou suivi des tutos sans les comprendre totalement.

Pour faire la différence, vous devez montrer une forte capacité à vous adapter et à comprendre les concepts dans leur intégralité.

Je vous conseille VRAIMENT d’apprendre à programmer des jeux pour le web, en HTML5 et sans moteur.

Voici 5 excellentes raisons pour cela :

– C’est la plateforme universelle par excellence : fournissez un simple lien, rien à télécharger !

– Avec la mort de Flash, le besoin en contenu est en train d’exploser.

– Les jeux web tendent à devenir le standard sur Mobile avec le support HTML5 de tous les navigateurs embarqués. Même Facebook intégre maintenant des jeux HTML5 au cœur de Messenger (Instant Games).

– Si vous voulez proposer vos services pour développer des jeux publicitaires ou promotionnels, c’est la technologie à maîtriser absolument.

– Javascript est le langage de référence du marché, il vous ouvrira également les portes du marché “traditionnel” si vous voulez arrondir vos fins de mois.

Contenu

Boot Camp Live - Programmation d'un jeu de type Frogger (Crossy Road) en 4 heures

Programmation d'un jeu de type Frogger (Crossy Road) en 4 heures, en utilisant les compétences et le framework issu des ateliers du Boot Camp.
BootCamp HTML5 Jour 1.mp4
  • (1h 06m 19s)
  • 179 Mo
BootCamp HTML5 Jour 2 part 1.mp4
  • 20 min
  • 57,1 Mo
BootCamp HTML5 Jour 2 part 2.mp4
  • 41 min
  • 146 Mo
BootCamp HTML5 Jour 3.mp4
  • (1h 01m 29s)
  • 244 Mo
BootCamp HTML5 Jour 3 - Correction de la répartition des voitures.mp4
  • 4 min
  • 251 Mo
BootCamp HTML5 Jour 4.mp4
  • (1h 00m 53s)
  • 196 Mo

Boot Camp Code Source

Code Source - Live - Jour 1.zip
  • 15,7 ko
Code Source - Live - Jour 2.zip
  • 9,75 ko
Code Source - Live - Jour 3.zip
  • 129 ko
Code Source - Live - Jour 4.zip
  • 172 ko

Installation de l’environnement de développement et première ligne de code

0 - Installation de votre environnement de développement.mp4
  • 7 min
  • 19,3 Mo
Aperçu
1 - Votre premier code.mp4
  • 9 min
  • 21,5 Mo
JavaScriptDemo.zip
  • 11,4 ko

Apprenez JavaScript en 35 minutes

1 - Apprenez JavaScript en 35 minutes.mp4
  • 38 min
  • 131 Mo
2 - Exercice.mp4
  • 5 min
  • 17,3 Mo
3 - Solution Exercice.mp4
  • 11 min
  • 41,5 Mo

Introduction à la programmation graphique avec HTML5

0 - Au menu.mp4
  • 2 min
  • 30 Mo
1 - Organisation des fichiers - intro.mp4
  • 1 min
  • 14 Mo
2 - Gameloop.mp4
  • 11 min
  • 207 Mo
3 - Image et Sprite.mp4
  • 9 min
  • 157 Mo
4 - Deltatime.mp4
  • 6 min
  • 99,6 Mo
5 - Déplacer l'image.mp4
  • 12 min
  • 225 Mo
Bonus - RequestAnimationFrame.mp4
  • 8 min
  • 489 Mo
Source.zip
  • 12,4 ko

Gérez les images et les animations de vos jeux web comme un pro

0 - Introduction au chargement des images.mp4
  • 8 min
  • 486 Mo
1 - Fonctionnement de l'ImageLoader et révision tableaux.mp4
  • 8 min
  • 508 Mo
2 - On code l'ImageLoader.mp4
  • 29 min
  • 667 Mo
3 - Sprite Sheet, la théorie.mp4
  • 4 min
  • 246 Mo
Aperçu
4 - Nettoyage du projet et accès aux images.mp4
  • 4 min
  • 223 Mo
5 - Clipping.mp4
  • 18 min
  • 46,3 Mo
6 - Pixel Art.mp4
  • 5 min
  • 292 Mo
7 - Système D'animation.mp4
  • 31 min
  • 84,2 Mo
8 - Live de mise en pratique - Cinématique.mp4
  • (1h 30m 59s)
  • 233 Mo
Sources.zip
  • 435 ko

5 concepts clés pour programmer des jeux vidéo d’arcade en JavaScript et HTML5

1 - Scrolling - Théorie.mp4
  • 2 min
  • 125 Mo
2 - Scrolling - Implémentation.mp4
  • 18 min
  • 40,4 Mo
Source.zip
  • 24,3 ko
1 - Vagues d'ennemis - Théorie.mp4
  • 6 min
  • 356 Mo
2 - Vagues d'ennemis - Les classes nécessaires.mp4
  • 15 min
  • 927 Mo
3 - Vagues d'ennemis - Lancer les vagues.mp4
  • 12 min
  • 39,3 Mo
4 - Vagues d'ennemis - Update et affichage final.mp4
  • 24 min
  • 87,4 Mo
Sources.zip
  • 32,9 ko
1 - Explosions et particules - Base de travail.mp4
  • 6 min
  • 344 Mo
2 - Explosions et particules - Théorie.mp4
  • 3 min
  • 187 Mo
3 - Explosions Et Particules - Implémentation.m4v
  • 19 min
  • 49,3 Mo
4 - Explosions et particules - Polish.mp4
  • 8 min
  • 484 Mo
Sources.zip
  • 35,1 ko
1 - Tirs et projectiles - Gestion du clavier.mp4
  • 8 min
  • 517 Mo
2 - Tirs et projectiles - Théorie POO et questionnements.mp4
  • 6 min
  • 329 Mo
3 - Tirs et projectiles - Création d'une classe Bullet.mp4
  • 13 min
  • 828 Mo
3bis - Tirs et projectiles - Liste de projectiles.mp4
  • 6 min
  • 329 Mo
4 - Tirs Et Projectiles - Mise En Pratique Avec Le Player.mp4
  • 31 min
  • 99,9 Mo
5 - Tirs et projectiles - Cadence de tir.mp4
  • 16 min
  • 1010 Mo
6 - Tirs et projectiles - Injection de dépendances.mp4
  • 10 min
  • 611 Mo
7 - Tirs et projectiles - Suppression des projectiles hors écran.mp4
  • 6 min
  • 384 Mo
Sources.zip
  • 258 ko
1 - Collisions - Théorie.mp4
  • 6 min
  • 332 Mo
2 - Collisions - Amélioration de notre classe Sprite.mp4
  • 4 min
  • 201 Mo
3 - Collisions - Les formules distance et bounding box.mp4
  • 5 min
  • 311 Mo
4 - Collisions - Mise en pratique.mp4
  • 9 min
  • 559 Mo
5 - Collisions - Explosions et conclusion.mp4
  • 8 min
  • 498 Mo
Sources.zip
  • 2,19 Mo

Master Class

Un code dont vous êtes le héros - Shooter en JS_HTML5 [JOUR 1].mp4
  • (1h 29m 00s)
  • 349 Mo
Un code dont vous êtes le héros - Shooter en JS_HTML5 (jour 2).mp4
  • (1h 04m 15s)
  • 247 Mo
Un code dont vous êtes le héros - Shooter en JS_HTML5 (jour 3).mp4
  • (1h 18m 18s)
  • 275 Mo
Un code dont vous êtes le héros - Shooter en JS_HTML5 (jour 4).mp4
  • (1h 14m 41s)
  • 258 Mo
LIVE FAQ _ Boot Camp Programmation de jeux Web.mp4
  • 57 min
  • 205 Mo
Code Source Master Class HTML5.zip
  • 8,84 Mo