canvas code to copy

#1 CANVAS Using any text editor, create a landscape or a portrait – it can be totally experimental – using the HTML5 CANVAS. It must contain AT LEAST 10 shapes, including bézier and quadratic curves.

If you do not have Dreamweaver, download Visual Studio Code

General HTML5 Canvas tutorial
7 Animated GIFs That Will Make You Instantly Understand Trigonometry
Chris Lis – UT New Media Production Major
Advanced HTML5 Canvas Tutorials


Open Source Code Editor for MAC and PC

DOWNLOAD Visual Studio Code

If for some reason you are having trouble downloading or installing the Adobe CC Suite, you can use a temporary code editor that is NOT Dreamweaver ( Visual Studio, for example). Follow the steps below to create your projects.

1) create a new canvas_01.html file on Visual Code and save it on your desktop or in a specific folder (it can be saved in your USB drive too)

2) copy and paste the code from my site onto this new document (make sure you know where you saved it in your computer)

3) modify line per line what you need to add, and then keep saving the document with every single new edit you do. You can start adding code and modifying the code. Save it again every single time you added something new

4) look for the file in the folder where you saved it, right click on it, and open it with Safari, Internet Explorer, Firefox or Google Chrome.

5) a new browser window will be open, and it should display your design.

6) switch back to the document in Visual Code, to keep editing. Save every time you add a new piece of code.

7) go to the browser that you had opened before, with the document already open, and refresh the page in the browser. This will not display any changes if you did not save your file in Visual Code. Do not download GIT at all, you do not need it.