Visual Studio Code (VSCode) is an alternative to using an online code editor such as the P5 Web Editor or OpenProcessing. You can copy your code back and forth between VSCode and an online editor, but at any one time you will either use VSCode to work with the file on your laptop, or use an online editor to work with a sketch that is stored in “the cloud”.
Getting Started
There are three different versions of the instructions; use one of these. (You can always switch later.) They are listed in increasing order of setup complexity.
These are the simplest instructions. The included Visual Studio extension creates a p5 sketch template, and it doesn't require that you create HTML files. However (1) it is specific to p5.js sketches; and (2) it use a relatively new Visual Studio Code extension, that has not been tested as much as the Live Server extension and does not have the same community support.
This version of the instructions use the Live Server VS Code extension. You will have to create an HTML file for each sketch, but it uses tools and a workflow that are the same as for general web development.
These instructions start from a GitHub repository on GitHub. They are suitable to a more software-development-oriented track.
Related Pages
- The Creative Coding Class Cookbook contains “recipes” for working with Visual Studio Code and git / GitHub.
External Links
Sub Pages
Configuring Visual Studio Code for p5.js Development (Live Server and GitHub)