🕛

Tracks

⌥

Filter by Language

JavaScript
☆

Filter by Topic

Pick a topic to filter

Code! Programming with p5.js

Languages

p5.js,JavaScript

Topics

For beginners,shapes,

This online course focuses on the fundamentals of computer programming (variables, conditionals, iteration, functions & objects) using JavaScript. In particular it leverages the p5.js creative computing environment which is oriented towards visual displays on desktops, laptops, tablets or smartphones. The course is designed for computer programming novices. This online course focuses on the fundamentals of computer programming (variables, conditionals, iteration, functions & objects) using JavaScript. In particular it leverages the p5.js creative computing environment which is oriented towards visual displays on desktops, laptops, tablets or smartphones. The course is designed for computer programming novices.

Ready to start?

Go to track

Code! Programming with p5.js

👁
Main Track
35 videos
"Code! Programming with p5.js" track
34 videos within this track match the filter.
What is Code!?
Code! Programming with P5.js
p5.js Web Editor
Shapes & Drawing
Color
Errors & Console

Working with Data and APIs in JavaScript

Languages

JavaScript,Node.js,

Topics

data,API,

This course is for aspiring developers who want to learn how to work with data in web applications. How do you retrieve, collect, and store data? The course will be taught through a series of creating three data projects. The first will be client-side only and examine how to load data with fetch() and present on a web page. Viewers will learn about handling asynchronous events with Promises and how to render data to the DOM as well as draw to HTML5 canvas with p5.js. The second and third project will introduce "full stack" development adding server-side programming with node.js for data persistence and API authentication.

Ready to start?

Go to track

Working with Data and APIs in JavaScript

👁
Main Track
20 videos
"Working with Data and APIs in JavaScript" track
20 videos within this track match the filter.
Trailer
Setup
The fetch() Function
Working with Tabular Data - Parsing CSV files
Graphing Data with Chart.js
Fetching JSON Data from an API

Git and GitHub for Poets

Languages

JavaScript

Topics

For beginners,git,GitHub

This video series is designed to teach you the basics of working with git version control and the GitHub website. You will understand the concept of version control and the difference between git software and GitHub the website. Videos cover terminology like branch, fork, merge, pull, push, and remote. You will get a chance to make your first pull request to a git repository on GitHub.

Ready to start?

Go to track

Git and GitHub for Poets

👁
Main Track
11 videos
"Git and GitHub for Poets" track
1 video within this track match the filter.
Hosting a p5.js sketch with GitHub Pages

A Beginner's Guide to Machine Learning in JavaScript with ml5.js

Languages

p5.js,ml5.js,

Topics

machine learning (ML),ml5.js,

Welcome to “A Beginner's Guide to Machine Learning in JavaScript”! In this series, I'll teach the concepts behind machine learning using the ml5.js library.

Ready to start?

Go to track

A Beginner's Guide to Machine Learning in JavaScript with ml5.js

👁
Main Track
28 videos
"A Beginner's Guide to Machine Learning in JavaScript with ml5.js" track
7 videos within this track match the filter.
Image Classification
Classifying Drawings with DoodleNet
Pose Detection
Hand Pose Detection with ml5.js
Face Mesh with ml5.js
What is a Convolutional Neural Network Part 2 - Max Pooling

The Nature of Code

Languages

JavaScript,p5.js,Processing

Topics

For beginners,polar coordinates,

Can the unpredictable evolutionary and emergent properties of nature be captured in software? Can understanding the mathematical principles behind the physical world help to create digital worlds? This learning playlist focuses on the programming strategies and techniques behind computer simulations of natural systems. I'll explore topics ranging from basic mathematics and physics concepts to more advanced simulations of complex systems. Subjects covered include physics simulation, trigonometry, self-organization, genetic algorithms, and neural networks. This track accompanies https://natureofcode.com/

Ready to start?

Go to track

The Nature of Code

👁
Main Track
67 videos
"The Nature of Code" track
55 videos within this track match the filter.
Welcome to The Nature of Code (p5.js!)
Introduction
I.2: Perlin Noise and p5.js Tutorial
I.3: noise() vs random()
I.4: Graphing 1D Perlin Noise
1.1 What is a Vector?

Workflow

Languages

JavaScript,git,

Topics

Node.js,shell,

Editor, shell, and more! In this side track I cover the tools I am currently using as part of my workflow.

Ready to start?

Go to track

Workflow

👁
Side Track
7 videos
"Workflow" track
5 videos within this track match the filter.
Workflow: Terminal, Shell, Node.js, VSCode
Intro To My Workflow
Visual Studio Code
Shell
Node

Algorithmic Botany

Languages

p5.js,JavaScript,Processing

Topics

fractal,tree,

This side track explores patterns found in nature. We'll cover how to simulate growing plants, flowers, and trees in p5.js and Processing. Fractal trees and L-systems galore! By the end of this track, you'll be able to code your own digital garden!

Ready to start?

Go to track

Algorithmic Botany

👁
Side Track
7 videos
"Algorithmic Botany" track
7 videos within this track match the filter.
Barnsley Fern
Recursive Fractal Trees
Object-Oriented Fractal Trees
Fractal Trees - L-System
Space Colonization
3D Fractal Trees
2 videos within this track match the filter.
Node
Mastodon Fractal Tree Bot
3 videos within this track match the filter.
Workflow: Terminal, Shell, Node.js, VSCode
How to Set Up a Node.js Project
Coding a Discord Bot
5 videos within this track match the filter.
"404" Page Not Found
Creative Coding AI Agent
I, Robot
Decade of Code Fundraiser
Genuary 2023 Speed Run
15 videos within this track match the filter.
Multilayer Perceptron Part 1
Multilayer Perceptron Part 2
Matrix Math - Basics
Matrix Math - Element-wise operations
Updating Code to ES6
Matrix Product
6 videos within this track match the filter.
I.2: Perlin Noise and p5.js Tutorial
I.3: noise() vs random()
I.4: Graphing 1D Perlin Noise
I.5: Perlin Noise in Two Dimensions (p5.js)
I.6: Perlin Noise Detail in p5.js
4D OpenSimplex Noise Loop

p5 Tips & Tricks

Languages

JavaScript,p5.js

Topics

p5.js,storage,

A collection of tips and tricks that might come in handy when working in p5.

Ready to start?

Go to track

p5 Tips & Tricks

👁
Side Track
5 videos
"p5 Tips & Tricks" track
5 videos within this track match the filter.
Local Storage in JavaScript with p5.js
Hosting a p5.js sketch with GitHub Pages
The Pixel Array
Custom Shapes
2D Arrays in JavaScript
8 videos within this track match the filter.
6.1 Matter.js - Introduction
6.2 Matter.js - Introduction, continued
6.3 Matter.js - Deleting Bodies
6.4 Matter.js - Constraints
6.5 Matter.js - Mouse Constraints
Plinko with Matter.js

Pi Day

Languages

Processing,Java,

Topics

Monte Carlo simulation,Pi day,

Pi, which is the ratio of a circle's circumference to its diameter, is one of the most important mathematical constants. This track is a compilation of the many challenges I have completed to calculate Pi.

Ready to start?

Go to track

Pi Day

👁
Side Track
10 videos
"Pi Day" track
6 videos within this track match the filter.
Calculating Digits of Pi with Collisions
Leibniz Formula for Pi
Peeking Inside Pi
Estimating π from Random Numbers with Euclid's Algorithm
Pi in the Sky Game
Buffon's Needle

Pixels

Languages

JavaScript,Processing,

Topics

p5.js,video,

Take a ride along the Pixels track and explore pixels with p5.js and Processing. In this track, I demonstrate how to work with real-time live video, using tint() to change colors and copy() to takes snapshots. I also explore how the pixel array works. I create examples of "software" mirrors that draw pixels as shapes or use DOM elements. I demonstrate how to create a "painting" with particles smearing colors from pixels, and build a slitscan effect.

Ready to start?

Go to track

Pixels

👁
Side Track
10 videos
"Pixels" track
7 videos within this track match the filter.
Live Video and createCapture
Video Photobooth
The Pixel Array
Brightness Mirror
Checkbox Mirror
Painting Pixels

Snowflakes!

Languages

p5.js,JavaScript,

Topics

snowfall,snowflakes,

This track is a compilation of the many Snowflakes challenges that I have done during my annual fundraiser for the Processing Foundation. Donations can be made at https://processing.org/donate/. Thank you!

Ready to start?

Go to track

Snowflakes!

👁
Side Track
5 videos
"Snowflakes!" track
2 videos within this track match the filter.
Snowfall
Kaleidoscope Snowflake #SupportP5

Supershapes!

Languages

JavaScript,p5.js,Processing

Topics

For beginners,polar coordinates,

This side track is a collection of videos related to supershapes that use spherical coordinates and superformulas. While not technically a “supershape”, the mandelbulb is constructed in a similar manner and is a SUPER shape.

Ready to start?

Go to track

Supershapes!

👁
Side Track
6 videos
"Supershapes!" track
2 videos within this track match the filter.
3.4 Polar Coordinates
2D Supershapes

Teachable Machine

Languages

JavaScript,p5.js,ml5.js

Topics

machine learning (ML),ml5.js,

In these videos I demonstrate how to train image and sound classification machine learning models and deploy those models to a web application using the p5.js and ml5.js JavaScript libraries.

Ready to start?

Go to track

Teachable Machine

👁
Side Track
3 videos
"Teachable Machine" track
3 videos within this track match the filter.
Teachable Machine 1: Image Classification
Teachable Machine 2: Snake Game
Teachable Machine 3: Sound Classification

Topics in Native JavaScript

Languages

JavaScript,p5.js

Topics

variables,es6,

Video tutorials covering various features of modern JavaScript.

Ready to start?

Go to track

Topics in Native JavaScript

👁
Side Track
20 videos
"Topics in Native JavaScript" track
20 videos within this track match the filter.
let vs var
const
ES6 Arrow Functions
for...of loop
Higher Order Functions in JavaScript
Array Functions: map() and fill()
3 videos within this track match the filter.
Translate, Rotate, Push/Pop
Scale
More about Transformations

Video Games

Languages

p5.js,JavaScript,

Topics

Snake game,games,

This side track is a collection of coding challenges for various (classic and new) video games in Processing (Java) or JavaScript with p5.js.

Ready to start?

Go to track

Video Games

👁
Side Track
11 videos
"Video Games" track
6 videos within this track match the filter.
The Snake Game
Flappy Bird
Agar.io
Asteroids
Minesweeper
Snake Game Redux

Web Sockets and p5.js

Languages

JavaScript,p5.js,Node.js

Topics

Node.js,sockets,

Video tutorials covering how to use node.js, p5.js, and socket.io (websockets) to create a shared HTML5 canvas across multiple browser sessions.

Ready to start?

Go to track

Web Sockets and p5.js

👁
Side Track
4 videos
"Web Sockets and p5.js" track
4 videos within this track match the filter.
Introduction to Node
Using Express with Node
Connecting Client to Server with Socket.io
Shared Drawing Canvas
8 videos within this track match the filter.
Introduction to WebGL in p5.js - WebGL and p5.js Tutorial
3D Geometries
Light and Material
Texture
Camera and Perspective
createGraphics() as WebGL Texture
2 videos within this track match the filter.
Image Classification with MobileNet
Webcam Image Classification