Learn HTML5 Canvas for beginners

Course details

The canvas element in HTML5 allows you to create amazing dynamic script based drawings and animations directly within your webpages. Bringing your JavaScript to life visually drawing free form graphics on a drawing surface.

Canvas is a powerful element with many options. In this course we show you how to use canvas and start drawing onto it using JavaScript. With over 15 years experience in web development I show you how to use canvas in the real world. Learn the basic concepts of using canvas to draw directly on your web page.

This course is for beginners who want to learn how to use HTML5 better. You will learn how to setup canvas and how to interact with it. I share top resources, links and code snippets to practice and perfect using canvas for web development.

Course covers

• starting to draw on the canvas
• drawing rectangles and lines
• drawing arc and circles
• how to implement curves
• how to add colors
• dashes, lines, and gradients
• Popular HTML5 methods
• How to add text
• creating images on the fly
• on page images
• scaling, slicing and canvas manipulation
• saving and restoring canvas
• rotations and custom transformations
• Animating your canvas

Source code is included, several challenges with solutions are also included in this course.

Learn how to create your own dynamically generated graphics and cool animations online.

You can use canvas for building graphs, creating animations, games, and image composition.

This course will provide you the base knowledge needed to create drawings within canvas.