À propos du cours
La formation complète sur HTML Canvas, allant du niveau débutant au niveau avancé, est conçue pour vous transformer en un développeur compétent dans l’utilisation de l’élément Canvas pour créer des graphiques et des animations interactives sur le web. Nous vous guiderons à travers chaque étape du processus, de la découverte des bases fondamentales jusqu’à la maîtrise des concepts avancés.
Tout d’abord, nous vous introduirons à l’élément Canvas dans le contexte du HTML. Vous apprendrez à créer un canevas, à définir sa taille, et à le positionner sur votre page web. Vous découvrirez également comment dessiner des formes de base telles que des lignes, des rectangles et des cercles. Pour une vue détaillée sur les éléments Canvas, consultez la documentation MDN sur Canvas.
Ensuite, nous explorerons les fonctionnalités avancées de l’élément Canvas. Vous apprendrez à manipuler les pixels du canevas, à créer des dégradés et à utiliser des images pour concevoir des graphiques plus complexes. Pour comprendre comment travailler avec les images sur Canvas, visitez MDN sur les images dans Canvas.
Nous aborderons également l’animation sur le Canvas en utilisant JavaScript. Vous apprendrez à créer des animations fluides en mettant à jour les propriétés du canevas à intervalles réguliers. Pour approfondir vos connaissances sur l’animation avec Canvas, consultez MDN sur l’animation avec Canvas.
Au fur et à mesure que vous progresserez, nous vous introduirons aux techniques avancées telles que la manipulation d’image, les transformations 2D et 3D, ainsi que la création de jeux simples en utilisant le Canvas. Pour des exemples de jeux créés avec Canvas, explorez des tutoriels sur les jeux avec Canvas.
Enfin, nous mettrons l’accent sur l’optimisation de la performance du Canvas et sur les bonnes pratiques pour garantir une expérience utilisateur fluide. Pour des conseils sur l’optimisation des performances Canvas, référez-vous à MDN sur les performances Canvas.
Contenu du cours
HTML Canvas
Introduction
01:17Préparation à la formation
02:42Déclarer un Canvas
04:38Rectangle
04:58Les dégradés
06:12DrawImage
03:55Dessin de trajets
04:52Dessin de lignes
03:49Cercle
02:43Texte
02:39SetAtribute
02:11Canvas responsif
06:06Save et restore
04:10Translate
03:49Rotate
03:05Request animationframe
04:59Effets de souris
04:47
Projets pratiques
Conclusion
Obtenez un certificat
Ajoutez ce certificat à votre CV pour démontrer vos compétences et augmenter vos chances .