This description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/website/issues/newMarbling Ink Simulation #javascript #fluidsimulationThe Coding Train2024-05-16 | Drop💧into this new coding challenge: the art of Mathematical Marbling!🌌
We are so thrilled to celebrate the community’s talent and creativity. 🌟🎉Coding Challenge 183: Paper Marbling AlgorithmThe Coding Train2024-05-02 | All aboard as I attempt to simulate the artistic process of paper marbling. The algorithm is based on the paper 'Mathematical Marbling' by S. Lu, A. Jaffer, X. Jin, H. Zhao, and X. Mao. The code is written in JavaScript using the p5.js library. Code: thecodingtrain.com/challenges/183-mathematical-marbling
Timestamps: 0:00 Introduction 1:47 Mathematical Marbling 2:16 Explain approach 3:20 Start Coding 4:20 Dropping paint 7:03 Add the circle vertices using polar coordinates 10:57 Add a marble function 13:24 Refine the algorithm 16:45 Add a tine function 19:46 Circle detail 24:50 Generalize the tine function 29:43 Possible variations 31:45 Outro
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#mathematicalmarbling #fluidsimulation #p5js #javascriptPassenger Showcase and Building a Creative Coding AI Agent?The Coding Train2024-03-24 | Music from Epidemic Sound
#geminiapi #shiffbot #node #genuary2024 #javascriptCoding Challenge 182: Apollonian Gasket FractalThe Coding Train2024-03-14 | Happy Pi Day 2024! In this video, I attempt to create an Apollonian Gasket using the Descartes Circle Theorem and complex numbers. So many circles! Code: thecodingtrain.com/challenges/182-apollonian-gasket
Timestamps: 0:00 Happy PI Day!! 1:40 References 3:22 Describe the Apollonian problem 5:51 Curvature 10:08 Start coding! 11:53 Write a function to find the fourth curvature 15:31 Complex numbers 21:11 Create a complex number class 22:52 Square root of -1 25:32 Square root of a complex number 27:57 Implement complex Descartes theorem 33:50 Make the circles in the complexDescartes function 36:26 Use an array to add recursion 41:04 Validate the circles 42:35 Check if all 4 circles are tangent 48:04 Stop adding circles when radius falls below a threshold 49:20 Implement arbitrary arrangement of circles 53:14 Debug 55:32 Possible variations 56:34 Outro
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#apolloniangasket #pi #circlepacking #complexnumbers #curvature #descartestheorem #p5js #javascript =====================================================Coding Challenge 181: Weighted Voronoi StipplingThe Coding Train2024-02-22 | Stippling is an artistic technique that uses numerous dots to craft an image. In this coding challenge I attempt to implement a weighted Voronoi stippling algorithm with p5.js along with the Delaunay triangulation package from d3.js. Code: thecodingtrain.com/challenges/181-image-stippling
Timestamps: 0:00 Hello! 0:37 What is a Delaunay triangulation? 2:31 d3-delaunay package 2:49 Coding the delaunay triangulation. 6:38 What is a Voronoi diagram? 9:17 voronoi function on the delaunay object 10:25 Things you could try with the Voronoi diagram 10:56 Lloyd's "relaxation" algorithm 12:07 Calculate the average of a polygon's vertices 15:30 Calculate the area of a polygon 16:45 Calculate the proper centroid of a polygon 18:47 What is stippling? 19:45 Draw dots based on brightness value of pixel 21:50 Calculate a weighted centroid 24:51 Using delaunay.find() 27:52 Ideas for you to try! 28:47 Goodbye!
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#delaunaytriangulation #imagestippling #voronoi #sweepalgorithm #lloydsalgorithm #p5js #javascriptI, RobotThe Coding Train2024-02-02 | In this live episode of the Coding Train I share ShiffBot, review your showcase submissions, and create a node.js and p5.js example for the Gemini large language model API. Code: thecodingtrain.com/tracks/livestreams/livestreams/shiffbot
Timestamps: 0:00:00 Count down starts 0:09:09 Welcome to the livestream! 0:20:06 ShiffBot 0:30:47 Demo ShiffBot 0:59:19 Intermission 1:05:25 Back from intermission 1:08:58 Review showcases 1:40:10 Genuary 2024 1:42:10 Working with the Gemini API 1:55:05 Host a p5.js sketch 1:59:57 Connect the node.js express server to p5 2:07:03 Multi-turn conversations 2:18:59 Next steps 2:23:17 Outro
#geminiapi #shiffbot #node #genuary2024 #javascriptCoding Challenge 180: Falling SandThe Coding Train2024-01-22 | It's Genuary 2024! Watch as I attempt to build a falling sand simulation in p5.js using a grid of pixels and simple rules. Code: thecodingtrain.com/challenges/180-falling-sand
References: 🔗 Genuary: https://genuary.art/ 🔗 Sandspiel by Max Bittker: https://sandspiel.club/ 🔗 Making a falling sand simulator: https://jason.today/falling-sand 📕 The Nature of Code by Daniel Shiffman: natureofcode.com
Timestamps: 0:00 Introduction and references 2:10 About cellular automata 2:47 The rules for a sand simulation 3:36 Code! Creating a grid 5:04 Animating a falling grain of sand 7:32 About matrix columns and rows 8:04 Let's account for the bottom edge 9:09 Adding mouse interaction 9:42 More sophisticated sand behavior 10:43 Oops! Some errors to fix 11:30 Adding randomness 12:26 Handling left and right edges 14:00 Checking if mouse is within the canvas 14:40 Making it more efficient 14:56 More space and more sand 16:55 Adding some color! 18:54 Challenge complete! Let's do some refactoring 20:58 How could we add gravity? 21:57 Wrapping up
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
Timestamps: 0:00 Hello! 2:09 What is an elementary cellular automata? 5:41 Explaining the rulesets 7:52 Calculating the next generation. 10:35 Visualizing the CA 14:25 Rule 90 16:45 Wolfram Classification. 19:19 Adding wrap-around 20:37 Suggestions for variations! 21:07 Goodbye!
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
Timestamps: 0:00:00 Count down starts 0:05:00 Welcome to the livestream 0:08:10 Introduce Raphael de Courville 0:11:08 Processing Foundation 0:20:10 Start video 0:25:40 Merch for donations 0:28:54 Wallpapers 0:42:39 Live Preview for VSC 0:43:39 Live Share 0:46:57 Console output 0:51:21 Decide what to code 0:59:26 Start coding 2:22:59 Contributing your version 2:26:39 Logo-Animations 2:31:04 Outro
00:00 Choo choo! 06:05 Welcome! 10:00 Today's Sponsor Turing Tumble 13:52 Making a List 25:44 Turing Tumble Demonstration 46:25 Passenger Showcase 01:09:11 My NYU Syllabus 01:15:30 Transformers and Embeddings
Timestamps: 0:00 Introduction 3:39 Setting up the Node.js project 5:50 Creating the Discord application 6:24 Inviting your Discord bot 10:11 Enabling developer mode on Discord 10:33 Setting up the .env file 12:47 Code! Getting the bot to log into Discord 18:16 Creating a slash command 24:00 Deploying the slash command 25:53 Listening for the command interaction and executing the command 30:08 How Discord bots communicate with Discord 32:00 Discord.JS documentation
Corrections: 15:45 Intents describe what events your bot will receive and what it has access to. The guilds intent is required so discord.js can internally populate it's cache to limit it's API calls to Discord. 23:49 Using ./ means the import will be relative to the file that the import is made in. Without it the import would be absolute meaning it would be from the root of your Node.JS project
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
Timestamps: 0:00 Introduction 1:47 Running JavaScript code with Node 3:04 Creating a Node project 7:24 Using built-in Node modules 11:51 Installing and using third party packages 18:26 Working with existing Node projects 24:02 Summary
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#nodejs #javascript #nodejsWorkflow: Terminal, Shell, Node.js, VSCodeThe Coding Train2023-11-01 | This video covers tools and configurations to set up a JavaScript development environment with Node.js, Visual Studio Code, and shell/terminal access. This is step 1 along the way to creating your own Discord Bot! Code: thecodingtrain.com/tracks/discord-bots/discord/2023-workflow
Timestamps: 00:00 Introduction 02:45 Terminal access 03:38 Unix 04:51 Shell - a command line interface to the operating system 05:30 Oh My Zsh 07:27 Node.js 08:05 Node Version Manager 11:48 Setting the default version of node 13:07 Visual Studio Code 14:00 Preferences and Extensions 15:27 Prettier 17:15 Format On Save 18:22 Settings.json 20:12 Install 'code' command in PATH 23:06 Outro
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#nodejs #shell #unix #terminal #nvm #vscode #editor #workflow #javascriptStickers!The Coding Train2023-10-13 | ...Creative Coding for Beginners - Full Course!The Coding Train2023-10-01 | Choo choo! Welcome aboard to the world of creative coding! Join me in this beginner-friendly video series learning to code with Processing! thecodingtrain.com/tracks/learning-processing/processing
Whether you're an absolute beginner or have some experience already, my goal is to inspire and empower you to unleash your creativity through coding. Processing is your gateway to making art, animations, and interactive experiences. No prior experience is required—just curiosity and a desire to create!
Timestamps: 0:00:00 ⭐️ INTRODUCTION ⭐️ 0:14:43 How to Download Processing 0:17:30 ⭐️ DRAWING WITH CODE ⭐️ 0:27:58 Shapes 0:30:34 The Processing Reference 0:39:19 Saving Your Code 0:41:03 Code Comments 0:42:27 Errors 0:44:38 Color 0:48:11 Stroke Weight 0:50:31 RGB color 0:53:45 Bits and Bytes 0:56:45 Color Modes 0:59:26 Alpha Transparency 1:04:39 ⭐️ FLOW ⭐️ 1:06:31 Setup and Draw 1:13:27 mouseX and mouseY 1:19:13 mousePressed() 1:29:31 ⭐️ VARIABLES ⭐️ 1:31:39 Creating Your Own 1:48:56 Incrementation Operations 1:53:20 Random Numbers 2:02:46 ⭐️ CONDITIONALS ⭐️ 2:04:01 The "IF" Statement 2:10:30 "ELSE" 2:18:30 Logical Operators 2:28:47 The Bouncing Ball 2:40:38 Boolean Variables 2:50:01 ⭐️ LOOPS ⭐️ 2:51:30 The While Loop 2:57:49 Variable Scope 3:00:10 The For Loop 3:04:48 Nested Loops 3:12:29 ⭐️ ARRAYS ⭐️ 3:18:44 Indexing 3:28:02 Iteration 3:40:29 ⭐️ FUNCTIONS ⭐️ 3:43:48 Defining Your Own 3:49:39 Modularity 3:52:33 Reusability 3:57:00 Return Types 4:02:30 ⭐️ CLASSES AND OBJECTS ⭐️ 4:25:18 Constructor Arguments 4:34:30 Arrays of Objects 4:54:21 Enhanced Loop 4:56:20 ⭐️ CONFETTI PROJECT ⭐️ 5:03:15 ⭐️ CONCLUSION ⭐️
Editing by Mathieu Blanchette Animations by Jason Heglund Research and Additional Code by Melissa Rodriguez: instagram.com/hellomelissarodriguez Music from Epidemic Sound
#forbeginners #shapes #drawing #basics #color #errors #debugging #mouseinteraction #variables #math #random #boolean #ifstatement #motion #forloop #grid #function #arguments #parameters #return #objects #objectorientedprogrammingoop #classes #constructor #array #nestedloop #images #processing #javaNew Full Processing Course Announcement (and other updates)The Coding Train2023-09-25 | Subscribe to Nebula for the new Processing course! go.nebula.tv/codingtrain
Topics: 0:00 Hello 11:26 Nebula Lifetime promotion and new Processing course 42:36 Nature of Code updates 53:47 Hacktoberfest / manually submitting showcases 58:30 Update about member sticker packet mailing 1:15:49 New logo and p5.js sketch
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductAll aboard the new Coding Train website!The Coding Train2023-05-31 | The Coding Train has a new website! thecodingtrain.com Design Systems International: https://designsystems.international Coding Train Case Study: https://designsystems.international/work/the-coding-train/
Video thanks to the ITP/IMA Documentation Lab Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductCoding Challenge 178: Climate SpiralThe Coding Train2023-04-23 | Learn to create your own climate spiral using p5.js and temperature data. Originally designed by the climate scientist Ed Hawkins, the climate spiral is a visual representation of the changing temperatures over time, illustrating the urgent need to address climate change. Code: thecodingtrain.com/challenges/178-climate-spiral
Timestamps: 0:00 Welcome to a special Earth Day Coding Challenge! 0:35 What is a temperature anomaly? 2:28 NASA Goddard Institute for Space Studies website 3:17 Preview the data 4:34 Upload the data 5:13 Use loadTable() to preload the data 7:01 Check out the data 9:28 Set up the base pattern 10:42 Polar Coordinates 12:36 Add the month labels 16:11 Time for the data! 17:05 Draw the spiral 18:09 Set up global variables 19:04 Map the x, y positions to the data 20:27 Loop through all of the data 21:57 Check for null values 22:43 Animate the spiral 25:17 Add one month at a time 28:47 Add color to the spiral 29:42 Connect the points with a line segment 34:45 Use lerpColor() to vary color 38:00 Use parseFloat() to convert a string to a float 38:40 We have the climate spiral 40:16 Suggestions for possible variations 40:42 Outro
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#data #visualization #datavisualization #climatespiral #climatechange #p5js #javascriptCoding Challenge 177: Soft Body PhysicsThe Coding Train2023-04-13 | Embark on a squishy adventure as I attempt to create a soft body physics simulation for a character with toxiclibs.js and p5.js! Code: thecodingtrain.com/challenges/177-soft-body-character
Timestamps: 0:00 Introduction 2:51 Physics libraries 5:30 Elements in ToxicLibs 5:47 Start coding 7:04 Object destructuring 8:10 Add gravity 9:00 Adding elements to the world 10:35 Updating the physics world 11:40 Adding a spring 15:23 Refactor code 18:07 Inheritance 18:57 Super class 23:31 Spring length 25:44 Create a closed-filled shape to draw the character 26:49 Suggestions for variations 27:07 Other types of springs 27:36 Update about the Nature of Code book! 28:56 Outro
Editing by Mathieu Blanchette Animations by Jason Heglund Music from Epidemic Sound
#softbody #toxiclibs #verletphysics #p5js #javascriptCoding Challenge 176: Buffons NeedleThe Coding Train2023-03-14 | How do toothpicks approximate the value of pi? I'll show you by coding a simulation in p5.js! Code: thecodingtrain.com/challenges/176-buffon-needle
Timestamps: 0:00 Happy Pi Day 2023! 0:45 Introduce Buffon's Needle 1:40 Unpack the math 4:40 Let toothpick fall at an angle 7:08 The probability that the toothpick crosses the border 7:27 Uniform probability density function 8:12 Illustrate the probability with a graph 10:49 Approximating the value of Pi 11:11 Calculating the area under the curve 12:48 Resources for Buffon's Needle 13:28 Start Coding 13:53 Draw vertical lines 14:20 Add a toothpick 15:02 Draw background in setup 15:57 We have to use the built-in value of Pi 17:00 Find the closest column 17:22 Determine if the toothpick intersects the column 18:10 Rotate the line relative to the y-axis 18:50 Draw the toothpick as a vertical line 19:40 Improve the visuals 20:48 Approximate the value of Pi using the probability that a toothpick intersects a column 23:45 Suggestions for variations 24:08 New Passenger Showcase page on the Coding Train website 24:38 Easter egg
Editing by Mathieu Blanchette Animations by Jason Heglund Pi Day Song by Will from America Music from Epidemic Sound
#piday #pi #buffonsneedle #buffon #p5js #javascriptCoding Train Live!: Genuary Speed Run Challenge!The Coding Train2023-01-29 | Inspired by Sableraph twitch.tv/sableraph today I will attempt to speed run through all of the Genuary prompts. I only have a couple hours so I will almost certainly fail. Come join me! https://genuary.art/
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductCoding Train 2022 in Review, Plans for 2023The Coding Train2023-01-01 | 💡Sign up for the CuriosityStream + Nebula bundle with a 42% exclusive discount ($11.79 for a full year!) at curiositystream.com/choochoo. To access my Nebula class, upgrade for $1 per month or $10 for year!
Timecodes: 0:00 Start of stream 6:30 New opening animation 20:47 White Board: review 2022/plans for 2023 37:20 Nebula 50:27 Answer viewer questions 1:02:43 Reviewing 2022 livestreams 1:04:23 Twitch livestreams 1:20:53 A Year in the Life Twitter 2022 2:40:47 Let's Code: Genuary 1st -- GIF Loop
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductCoding a Fractal Tree in 60 Seconds #programming #shortsThe Coding Train2023-01-01 | All aboard the 1 minute Coding Challenge! First up, a recursive fractal tree with p5.js!
#coding #challenge #creativecoding #programming #thecodingtrain #shortsLeaving No Tile Unturned! Wave Function Collapse Passenger Showcase #shortsThe Coding Train2022-12-19 | All aboard the Wave Function Collapse' Passenger Showcase! Next stop: Prime Spiral Showcase! thecodingtrain.com/challenges/171-wave-function-collapse
📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct👾 p5.js saveGif() changes everything! #creativecoding #programming #shortsThe Coding Train2022-12-07 | There's a new p5.js function that renders out a GIF: saveGif()! In this short I show you how to use it as well as a technique for making it a seamless loop.
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductPlaying YOUR Versions of the Apple ][ Snake Game! - Showcase 1 #creativecoding #programming #shortsThe Coding Train2022-12-04 | For the first episode of this series, I react to a few submissions from the 'AppleSoft BASIC Snake Game' Passenger Showcase. Next stop: 'Wave Function Collapse' Showcase arriving next week!
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductSharing YOUR code! Passenger Showcase! #shortsThe Coding Train2022-11-25 | What are you sketching today? Starting next week, I’ll be sharing your projects from the Passenger Showcase, reacting to the code YOU created based on The Coding Train challenges and tutorial videos.
📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductIn Search of Algorithms? Q&A 1.2 #shortsThe Coding Train2022-11-23 | Wrapping up Q&A Question #1, here’s two more websites full of Coding Challenge! Have you ever tackled any of these algorithms?