Skip to content

Latest commit

 

History

History
185 lines (110 loc) · 8.02 KB

README.md

File metadata and controls

185 lines (110 loc) · 8.02 KB

Creative Coding & Generative Art with JavaScript

This repository includes code & resources for students attending my Generative Art & Creative Coding with JavaScript workshops in 2018.

Contents

Tools & Prerequisites

Here is a list of tools, software and libraries that will be used during the workshop.

Tool Documentation Description
Code Editor A JavaScript code editor, VSCode is recommended
Browser A modern browser, Chrome is recommended
Canvas API [docs] The HTML5 <canvas> API, built into all browsers
Command-Line [guide] A command-line application like Terminal (macOS) or cmder (Windows)
Node.js (v8+) [docs] Used for running command-line JavaScript tools
npm (v5+) [docs] Used to install third-party dependencies and tools
canvas-sketch [docs] A development tool & framework for Generative Art
canvas-sketch-util [docs] Utilities for Math & Random Number Generation
ThreeJS [docs] A 3D rendering engine for WebGL

Installing the Prerequisites

Before starting the workshop, make sure you have installed and set up:

  • A browser, Chrome recommended
  • A code editor, VSCode recommended
  • A terminal application (like Terminal, cmder or cmd.exe)
  • Node.js 8+ and npm 5+

If you already have these tools installed, you can use the --version flag to make sure you have at least node@8 and npm@5:

npm --version
node --version

Complete Installation Guide

If you haven't installed these yet, you can find more instructions here:

Installing canvas-sketch CLI

We will be using canvas-sketch and its command-line interface (CLI) during the workshop.

To install the CLI with npm, use the --global or -g flag like so:

npm install canvas-sketch-cli --global

💡 Note the -cli suffix in the name; this tells npm to install the CLI tool, not the code library.

Command-Line Tips & Suggestions

If you are new to the command-line, you can read more details here:

Cloning & Running Examples

During the workshop, you won't need to clone and run this repository locally. However, if you wish to do so, you can find more instructions here:

Cheat Sheet

I've also included a small "cheat sheet" that you can use as a reference if you are forgetting some of the patterns and recipes discussed during the workshop.

Exercises

Below are a couple exercises you can tackle during lunch and free coding periods:

Other Modules for Creative Coding

This workshop encourages students to make use of npm modules to build complex and interesting artworks.

If you find a module you want to use, like point-in-polygon, you can install it from your project folder like so:

npm install point-in-polygon

Below are some nice modules for creative coding & generative art:

Further Reading

More links to generative art & creative coding:

License

This repository has a dual license.

The textual documentation and markdown files are all licensed as MIT.

The JavaScript source files have been released under Creative Commons Attribution-NonCommercial-ShareAlike 4.0 International (CC BY-NC-SA 4.0), see src/LICENSE.md for details.