author-cover

HTML5 Canvas: From Noob to Ninja - an interactive deep dive

Estimated completion time: 9h
Certificate Included
113 Lessons
62 Playgrounds
107 Illustrations

Join 450,000 learners, working at companies such as:

Course Overview

Kirupa is an MIT grad who works at Microsoft as Senior Program Manager. He has been tinkering with web technologies since 1998. He works on the Edge browser team where he gets to sink his teeth into the cutting-edge web technologies. HTML5 is taking over the browsers and one of the coolest things in HTML5 is the canva... See more

Course Contents

2. Getting Started with the Canvas


3. Drawing Basics / Lines


4. Drawing Curves


5. Drawing Multiple Things


6. Drawing Rectangles (and Squares)


7. Drawing Triangles


8. Drawing Circles


9. Modifying How Your Corners Look


10. Working with Colors


11. Drawing Text


12. Drawing Images


13. Canvas Transformations


14. Structuring Your Drawing Code


15. Animating with requestAnimationFrame


16. Creating Animations on the Canvas


17. Animating Many Things on the Canvas


18. Creating Motion Trails


19. Creating Sprite Animations


20. Working With the Mouse


21. Follow the Mouse Cursor


22. Mouse Follow with Ease


23. Working With the Keyboard


24. Moving Shapes Using the Keyboard


25. Resizing the HTML Canvas Element


26. Detect Whether a Font is Installed


How You'll Learn

Faster than videos

Videos are holding you back. The average video tutorial is spoken at 150 words per minute, while you can read at 250. That's why our courses are text-based.

Hands-on coding environments

You don’t get better at swimming by watching others. Coding is no different. Practice as you learn with live code environments inside your browser.

No set-up required

Start learning immediately instead of fiddling with SDKs and IDEs. It‘s all on the cloud.

Progress you can show

Built in assessments let you test your skills. Completion certificates let you show them off.