YoVDO

HTML5 Canvas API Crash Course

Offered By: Traversy Media via YouTube

Tags

HTML & CSS Courses Web Development Courses Game Development Courses Collision Detection Courses

Course Description

Overview

Learn to harness the power of the HTML5 Canvas element and JavaScript API in this comprehensive 54-minute crash course. Dive into drawing shapes, creating paths, and implementing basic animations. Master essential techniques such as creating rectangles, arcs, and circles, while exploring advanced concepts like collision detection. Build a practical Breakout game project to reinforce your skills. Gain hands-on experience with canvas context manipulation, image drawing, and event handling. By the end of this tutorial, you'll have a solid foundation in Canvas API, enabling you to create dynamic, interactive graphics for your web applications.

Syllabus

Intro
Canvas Context
FillRect
StrokeRect
Paths
Arc
Animation
Draw Circle
Update Canvas
Collision Detection
Breakout Game
Player
Draw Image
Update Animation
Event Listener
Detect Walls


Taught by

Traversy Media

Related Courses

Video Game Design and Development: Introduction to Game Programming
Abertay University via FutureLearn
Computer Science for Game Development
Harvard University via edX
Practical Game Development in Unity 4: Level 1
Udemy
Game Development for beginners with Python
Udemy
Code Your First Game: Arcade Classic in JavaScript on Canvas
Udemy