YOUR GUIDE TO

Setting up an Editor and Template to Code the Canvas

Let’s get you set up coding in no time and at no cost!

Dr Abstract
8 min readJul 22, 2020

--

Welcome readers from ◎ Your Guide to Coding Creativity on the Canvas

Example CodePen Online Editor with ZIM Canvas Template

In this guide, we will take you through using either an online editor in a Browser or a text editor on your computer to code the HTML canvas with JavaScript! If you do not know what the canvas is, here is ◎ Your Guide to When to Use a JavaScript Canvas Library or Framework.

ONLINE EDITORS FOR CODING THE CANVAS

We now have a ZIM Editor which is a perfect place to start! You can save files and see many Demos which we call ZAPPS for ZIM apps! The rest of the section was written based on the CodePen Editor, but you can just as easily use the new ZIM Editor.

ZIM Editor with Start Example

You can try coding with an online editor at the popular CodePen site. This is an excellent, quick way to start coding and to explore new front-end libraries and frameworks.

A ◈ To get started, press this link to take you to CodePen Topics.

--

--

Dr Abstract

Inventor, Founder of ZIM JavaScript Canvas Framework and Nodism, Professor of Interactive Media at Sheridan, Canadian New Media Awards Programmer and Educator