HTML5 Canvas
Duration:
27:53
Created with
Ben Fhala
Ben Fhala is the creative force and founder behind 02geek, a pioneering platform dedicated to making web development accessible to everyone. With over 18 years of experience in the industry, Ben has a deep passion for teaching and a knack for breaking down complex concepts into easy-to-understand lessons.
HTML5 Canvas Overview
What you'll learn
In the last section we where introduced to SVG (vector art ) and how to manipulate it in an HTML5 world. In this section we move to bitmap art with the Canvas API. This section is all about giving you a introduction to the process of working with the Canvas 2D API. By the end of this session you will know to create and animate with canvas.
Browser support and canvas
Canvas is new and with it some older browsers will not support the full features. Although we won't worry about the overall experience of users that don't support canvas in this title, we want to show
06:55
Starting to draw in Canvas
Now that we know the users have canvas available on their browsers, it's time for us to pick the API we will be working with. We will pick the 2D api. Once we do so we will go ahead and pick a color a
07:56
Drawing out a grid in canvas
Although we don't have the time in this title to go over all the features available in canvas we will go ahead and jump right in deep by drawing out together a grid that will cover the full visible ar
08:55
Animating canvas
Although there is much more to cover in canvas (don't forget to check out my title dedicated fully to canvas), We are ready to wrap things up by creating an animation in canvas.
04:07