1.4: JSON - Working with Data and APIs in JavaScript The Coding Train 2024-10-19 | 1.4: JSON - Working with Data and APIs in JavaScript
Pose Estimation with ml5.js The Coding Train 2024-10-17 | Strike a pose! In this video, I explore the BodyPose model in ml5.js with MoveNet and BlazePose, showing how to track body keypoints and visualize 'skeleton' connections using live video. Code: thecodingtrain.com/tracks/ml5js-beginners-guide/ml5/7-bodypose/pose-detection🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-pose-detection-with-ml5jsp5.js Web Editor Sketches:🕹️ BodyPose - single image: editor.p5js.org/codingtrain/sketches/WQrffEIsJ🕹️ BodyPose - Nose: editor.p5js.org/codingtrain/sketches/AWrwZ_rSv🕹️ BodyPose - Nose with Lerp: editor.p5js.org/codingtrain/sketches/9O6KbYyiX🕹️ BodyPose - More Parts: editor.p5js.org/codingtrain/sketches/uPd6s2iVO🕹️ BodyPose - Hat: editor.p5js.org/codingtrain/sketches/e_vqrMWcL🕹️ BodyPose - 3D BlazePose: editor.p5js.org/codingtrain/sketches/ftALPDieT🎥 Previous: youtu.be/fFzvwdkzr_c?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3y🎥 Next: youtu.be/FYgYyq-xqAw?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3y🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3yReferences:💻 ml5.js: ml5js.org🏫 Introduction to ML for the Arts: github.com/ml5js/Intro-ML-Arts-IMA-F24💻 Common objects in Context Dataset: cocodataset.org/#home🏫 Humans of AI: humans-of.ai💻 Next-Generation Pose Detection: blog.tensorflow.org/2021/05/next-generation-pose-detection-with-movenet-and-tensorflowjs.html📄 BlazePose Paper: arxiv.org/pdf/2006.10204💃 PoseNet Sketchbook: googlecreativelab.github.io/posenet-sketchbook🏅 Olympic Form: charstiles.github.io/olympicFormVideos:🎥 youtube.com/watch?v=8uLVnM36XUcTimestamps:0:00 Introduction0:45 What is the BodyPose model?3:28 Coco Dataset4:04 Creative Inspiration5:49 Start coding8:58 Working with specific keypoints15:39 Skeleton connections between the keypoints17:57 Using dist() function19:39 BlazePose20:56 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#machinelearningml #webcam #posedetection #ml5js #movenet #blazepose #ml5js #javascript
Image Classification with ml5.js The Coding Train 2024-10-08 | This video covers image classification in ml5.js 1.0. I demonstrate both the default MobileNet model as well as how to train your own classifier with transfer leraning and teachable machine. Code: thecodingtrain.com/tracks/ml5js-beginners-guide/ml5/1-classification/image-classificationp5.js Web Editor Sketches:🕹️ Image Classification: editor.p5js.org/codingtrain/sketches/A2W-0ayI5🕹️ Image Classification with Webcam: editor.p5js.org/codingtrain/sketches/r9LjJqaw6🕹️ Image Classification - Drag and Drop: editor.p5js.org/codingtrain/sketches/v1sAlvSHR🕹️ Image Classification - Display label and confidence: editor.p5js.org/codingtrain/sketches/7zA6_MlIo🕹️ Image Classification - Tint: editor.p5js.org/codingtrain/sketches/uHN5htRpC🎥 Previous: youtu.be/jmznx0Q1fP0?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3y🎥 Next: youtu.be/QEzRxnuaZCk?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3y🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3yReferences:💻 ml5.js: ml5js.org🏫 Introduction to Machine Learning for the Arts: github.com/ml5js/Intro-ML-Arts-IMA-F24📄 MobileNets: Efficient Convolutional Neural Networks for Mobile Vision Applications: arxiv.org/abs/1704.04861💻 Tensorflow.js port of MobileNet: github.com/tensorflow/tfjs-models/tree/master/mobilenet💻 Image-Net: image-net.org🎤 youtube.com/watch?v=40riCqvRoMs🌐 Excavating AI: The Politics of Images in Machine Learning Training Sets: excavating.ai🖼️ ml5 ImageClassifier: docs.ml5js.org/#/reference/image-classifier📱 Teachable Machine: teachablemachine.withgoogle.comTimestamps:0:00 Introduction2:30 What is MobileNet?4:53 What is ImageNet?10:32 ml5.js Classifier Code!21:19 Incorporating Live Video24:51 Training your own modelEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#machinelearningml #webcam #imageclassification #ml5js #mobilenet #ml5js #javascript
Coding Challenge 185: Unfolding Fractals The Coding Train 2024-08-18 | 25% off The Nature of Code book with code CHOOCHOO at natureofcode.com (comes with exclusive sticker+bookmark).The Dragon Curve fractal is created by repeatedly folding a strip of paper in half, then unfolding it to form a curve. In this challenge, I attempt to code an animation of the Dragon Curve forming with p5.js in JavaScript. Code: thecodingtrain.com/challenges/185-dragon-curve🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-184-dragon-curvep5.js Web Editor Sketches:🕹️ Dragon curve animation: editor.p5js.org/codingtrain/sketches/LXDsoCSZs🕹️ Dragon curve color variation: editor.p5js.org/codingtrain/sketches/7nNd-f7iY🕹️ Dragon curve noise variation: editor.p5js.org/codingtrain/sketches/7r7ZIE4dc🎥 Previous: youtu.be/dJNFPv9Mj-Y?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:📕 The Nature of Code: natureofcode.com🛒 Nature of Code shop: store.natureofcode.com/products/the-nature-of-code🔗 Dragon Curve: en.wikipedia.org/wiki/Dragon_curve🔗 concat() function: developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/concatVideos:🎥 youtu.be/UBuPWdSbyf8🎥 youtube.com/watch?v=wCyC-K_PnRYRelated Coding Challenges:🚂 youtu.be/0jjeOYMjmDU🚂 youtu.be/E1B4UoSQMFw🚂 youtu.be/jPsZwrV9ld0🚂 youtu.be/i-k04yzfMpw🚂 youtu.be/dSK-MW-zuAcTimestamps:00:00 Introduction00:36 The Nature of Code book01:43 Explain algorithm03:38 Start coding05:05 Write rotate function07:05 Rotate all the segments11:30 We have the dragon curve!12:00 Add animation16:31 Add the starting positions for a and b21:43 Scale the lines24:08 Add a nextGeneration() function25:16 The reduction ratio26:44 Target zoom28:57 Challenge complete!29:57 What can you do?30:25 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#fractals #dragoncurve #natureofcode #p5js #javascript
Lets Build a Nature of Code 404 Page! The Coding Train 2024-08-15 | Let's build a "404 Page Not Found" page for The Nature of Code website! Use code CHOOCHOO for 25% off Nature of Code at natureofcode.com/. Code: thecodingtrain.com/tracks/livestreams/livestreams/page-not-found🕹️ p5.js Web Editor Sketch: editor.p5js.org/codingtrain/sketches/ZcZjrgQHr🎥 Next: youtu.be/-_ivRdVjjzAReferences:📕 The Nature of Code: natureofcode.com🛒 Nature of Code shop: store.natureofcode.com/products/the-nature-of-codeRelated Coding Challenges:🚂 youtu.be/4hA7G3gup-4Timestamps:0:00:00 Count down starts0:08:00 Livestream starts0:19:50 Annual mailing0:20:45 NOC website0:21:38 Discount0:22:52 Purchase options1:09:54 404 Error page1:17:28 Start coding1:27:14 Add mouse interaction2:23:17 OutroMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#thenatureofcode #steeringbehaviors #javascript=====================================================
ml5.js 1.0 and Guest Conductor Patt Vira The Coding Train 2024-07-31 | The ml5.js library recently celebrated it's 1.0 release! In this video, I provide an overview of the new release and cover how to use the FaceMesh model. Guest Conductor Patt Vira (http://youtube.com/@PattVira) takes over and demonstrates how to build a creative kinetic type visualization controlled by your mouth! Code: thecodingtrain.com/tracks/ml5js-beginners-guide/ml5/0-introduction/patt-virap5.js Web Editor Sketches:🕹️ FaceMesh (Lips): editor.p5js.org/codingtrain/sketches/LdEmvXdGI🕹️ Interactive Kinect Type: editor.p5js.org/codingtrain/sketches/CITZ-7eyA🎥 Previous: youtu.be/jmznx0Q1fP0?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3y🎥 Next: youtu.be/yNkAuWz5lnY?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3y🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6YPSwT06y_AEYTqIwbeam3yReferences:🎥 http://youtube.com/@PattVira🎥 youtu.be/X4XMhpRFKvU💻 ml5.js: ml5js.org🏕 ITP Camp: https://tisch.nyu.edu/itp/camp💻 Tensorflow.js: tensorflow.org/js📕 The Nature of Code: natureofcode.comTimestamps:0:00 Introducing Patt Vira!1:08 What is ml5.js?2:00 The Nature of Code book2:12 ml5.js overview4:27 Importing the ml5.js library5:38 How to use the FaceMesh model18:34 Guest Conductor Patt Vira!54:14 Thanks for watching!Editing by Patt Vira and Mathieu BlanchetteVideography by Don Leeml5.js slides by Micaelle Lages and the ml5.js teamITP Camp workshop photos by Parth Pawar, Chienn Tai, Alan RenAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#machinelearning #ml5js #facemesh #guestconductor #p5js #ml5js
Use code CHOOCHOO for 25% off. Pre-ordering direct from me comes with a bonus bookmark and sticker! The Coding Train 2024-07-30 | ...
Collisions Without a Physics Library! (Coding Challenge 184) The Coding Train 2024-07-13 | What happens when two circles collide in a p5.js canvas? In this video, I examine the math and implement idealized elastic collisions in a JavaScript physics simulation. This video supplements the Nature of Code book series in Chapter 6 which uses 3rd party physics libraries to handle collisions rather than a direct implementation. Code: thecodingtrain.com/challenges/184-elastic-collisions🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-184-elastic-collisionsp5.js Web Editor Sketches:🕹️ Elastic Collisions: editor.p5js.org/codingtrain/sketches/3DrBb8LCp🕹️ Elastic Collisions - Quadtree: editor.p5js.org/codingtrain/sketches/z8n19RFz9🎥 Previous: youtu.be/p7IGZTjC008?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:📕 The Nature of Code: natureofcode.com🛒 Pre-order The Nature of Code: nostarch.com/nature-code🔗 Elastic Collision: en.wikipedia.org/wiki/Elastic_collision📃 2-Dimensional Elastic Collisions without Trigonometry: vobarian.com/collisions/2dcollisions2.pdf📃 Elastic Collisions Formula Derivation: dipamsen.github.io/notebook/collisions.pdfRelated Coding Challenges:🚂 youtu.be/IIrC5Qcb2G4🚂 youtu.be/OJxEcs0w_kE🚂 youtu.be/PoW8g67XNxA🚂 youtu.be/h5ZNcAPXxewTimestamps:0:00 Introduction0:20 The Nature of Code book1:22 Review background material4:15 Collision Resolution5:42 Start Coding8:48 Add collide() function10:17 Momentum and kinetic energy14:15 Line of impact16:44 Add the formulas21:25 Simplify the code22:57 Check for overlap24:31 Check the particle's kinetic enery25:48 Fix error27:30 Add more particles30:11 Optimizations30:50 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#collisions #physicssimulation #p5js #javascript=====================================================
Marbling Ink Simulation #javascript #fluidsimulation The Coding Train 2024-05-16 | Drop💧into this new coding challenge: the art of Mathematical Marbling!🌌Watch the full video of this challenge at codingtrain.com/183 🎥📣 Get your ticket to be featured in this week’s #PassengerShowcase post by submitting your work via one of the following methods:1. WEBSITE: Navigate to codingtrain.com/submit 🧑💻2. INSTAGRAM: Post & use the hashtag #PassengerShowcase 🚂3. DISCORD: Join us at codingtrain.com/discord #share channel 💬We are so thrilled to celebrate the community’s talent and creativity. 🌟🎉
Coding Challenge 183: Paper Marbling Algorithm The Coding Train 2024-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-183-paper-marbling-simulationp5.js Web Editor Sketches:🕹️ Mathematical Marbling: editor.p5js.org/codingtrain/sketches/fsw-rJrpr🕹️ Dodecahedron: editor.p5js.org/codingtrain/sketches/frIcGeI8l🕹️ Marbling Phyllotaxis: editor.p5js.org/codingtrain/sketches/xoK1M7K3-🕹️ Marbling Mouse: editor.p5js.org/codingtrain/sketches/GlQ8BqbZ2🕹️ Marbling Color: editor.p5js.org/codingtrain/sketches/ONPlawNRq🕹️ Marbling Combs: editor.p5js.org/codingtrain/sketches/kUPncgjvO🕹️ Marbling Raster Pixels: editor.p5js.org/codingtrain/sketches/5b29Taght🕹️ Marbling Raster Pixels - Image: editor.p5js.org/codingtrain/sketches/nb5hSYsgX🕹️ Marbling Raster Pixels - Video: editor.p5js.org/codingtrain/sketches/kVyT302xf🕹️ Marbling Color - animate ink: editor.p5js.org/codingtrain/sketches/HtEtm1vii🕹️ handPose Marbling: editor.p5js.org/codingtrain/sketches/EwQhSqGK5🎥 Previous: youtu.be/6UlGLB_jiCs?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 Paper Marbling: en.wikipedia.org/wiki/Paper_marbling🔗 Tokutaro Yagi: suminagashi.com/meet-the-artisan-tokutaro-yagi🔗 Digital Marbling: blog.amandaghassaei.com/2022/10/25/digital-marbling📄 Mathematical Marbling: doi.org/10.1109/MCG.2011.51🔗 Mathematical Marbling: https://people.csail.mit.edu/jaffer/Marbling/Videos:🎥 The Hydrodynamics of Marbling Art: gfm.aps.org/meetings/dfd-2023/649b3ad8199e4c137897831b🎥 youtu.be/O5wjXoFrau4Related Coding Challenges:🚂 youtu.be/OAcXnzRNiCY🚂 youtu.be/BZUdGqeOD0w🚂 youtu.be/alhpH6ECFvQ🚂 youtu.be/IxdGyqhppisTimestamps:0:00 Introduction1:47 Mathematical Marbling2:16 Explain approach3:20 Start Coding4:20 Dropping paint7:03 Add the circle vertices using polar coordinates10:57 Add a marble function13:24 Refine the algorithm16:45 Add a tine function19:46 Circle detail24:50 Generalize the tine function29:43 Possible variations31:45 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#mathematicalmarbling #fluidsimulation #p5js #javascript
Passenger Showcase and Building a Creative Coding AI Agent? The Coding Train 2024-03-24 | Music from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#geminiapi #shiffbot #node #genuary2024 #javascript
Coding Challenge 182: Apollonian Gasket Fractal The Coding Train 2024-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-182-apollonian-gasketp5.js Web Editor Sketches:🕹️ Apollonian Gasket: editor.p5js.org/codingtrain/sketches/zrq8KHXnO🕹️ Colorful Recursive Gaskets in Gaskets: editor.p5js.org/codingtrain/sketches/leBpmVwaM🎥 Previous: youtu.be/Bxdt6T_1qgc?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 Apollonian Gasket: en.wikipedia.org/wiki/Apollonian_gasket🔗 A Tisket, a Tasket, an Apollonian Gasket: americanscientist.org/article/a-tisket-a-tasket-an-apollonian-gasket🔗 Apollonian Gaskets: mathlesstraveled.com/2016/04/27/apollonian-gaskets🔗 Beyond the Descartes Circle Theorem: arxiv.org/pdf/math/0101066.pdf🔗 The Kiss Precise: nature.com/articles/1371021a0#preview🔗 Frederick Soddy: en.wikipedia.org/wiki/Frederick_Soddy🔗 Problem of Apollonius: en.wikipedia.org/wiki/Problem_of_Apollonius🔗 Four Proofs of a Generalization of the Descartes Circle Theorem: jstor.org/stable/2316373🔗 Beyond the Descartes Circle Theorem: arxiv.org/pdf/math/0101066.pdf🔗 Descartes' theorem: en.wikipedia.org/wiki/Descartes%27_theorem🔗 Complex.js: npmjs.com/package/complex.jsRelated Coding Challenges:🚂 21 Mandelbrot Set with p5.js: youtu.be/6z7GQewK-Ks🚂 22 Julia Set in Processing: youtu.be/fAsaSkmbF5s🚂 77 Recursion: youtu.be/jPsZwrV9ld0🚂 50 Circle Packing: youtu.be/QHEQuoIKgNE🚂 95 Approximating the Value of Pi: youtu.be/5cNnf_7e92Q🚂 96 Visualizing the Digits of Pi: youtu.be/WEd_UIKG-uc🚂 97 The Book of Pi: youtu.be/tbvG9hrJxOU🚂 139 Calculating Digits of Pi with Collisions: youtu.be/PoW8g67XNxA🚂 140 Leibniz Formula for Pi: youtu.be/uH4trBNn540🚂 141 Calculating Digits of Pi with Mandelbrot Set: youtu.be/pn2vlselv_g🚂 169 Pi in the Sky Game: youtu.be/_H9JIwWP7HQ🚂 176 Buffon's Needle: youtu.be/h5ZNcAPXxewTimestamps:0:00 Happy PI Day!!1:40 References3:22 Describe the Apollonian problem5:51 Curvature10:08 Start coding!11:53 Write a function to find the fourth curvature15:31 Complex numbers21:11 Create a complex number class22:52 Square root of -125:32 Square root of a complex number27:57 Implement complex Descartes theorem33:50 Make the circles in the complexDescartes function36:26 Use an array to add recursion41:04 Validate the circles42:35 Check if all 4 circles are tangent48:04 Stop adding circles when radius falls below a threshold49:20 Implement arbitrary arrangement of circles53:14 Debug55:32 Possible variations56:34 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#apolloniangasket #pi #circlepacking #complexnumbers #curvature #descartestheorem #p5js #javascript=====================================================
Coding Challenge 181: Weighted Voronoi Stippling The Coding Train 2024-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-181-weighted-voronoi-stipplingp5.js Web Editor Sketches:🕹️ Weighted Voronoi Stippling: editor.p5js.org/codingtrain/sketches/Z_YV25_4G🕹️ Circumcircle: editor.p5js.org/codingtrain/sketches/eJnSI84Tw🕹️ Delaunay Triangulation: editor.p5js.org/codingtrain/sketches/fuQz_-FnA🕹️ Voronoi Diagram: editor.p5js.org/codingtrain/sketches/GpeT1W8X1🕹️ Voronoi Phyllotaxis: editor.p5js.org/codingtrain/sketches/ydiZeUK8R🕹️ Voronoi Diagram colored by area: editor.p5js.org/codingtrain/sketches/opmU_UQqg🕹️ Lloyd's relaxation: editor.p5js.org/codingtrain/sketches/04sgsAcNu🕹️ Weighted Stippling - Size and Color: editor.p5js.org/codingtrain/sketches/_HTZUBPld🕹️ Weighted Stippling - Abstract Pattern: editor.p5js.org/codingtrain/sketches/9ntWWLXqA🕹️ Weighted Stippling - Video: editor.p5js.org/codingtrain/sketches/7TKSgi16z🎥 Previous: youtu.be/L4u7Zy_b868?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 d3-delaunay: d3js.org/d3-delaunay🔗 Weighted Voronoi Stippling: cs.ubc.ca/labs/imager/tr/2002/secord2002b/secord.2002b.pdf🔗 Sweep Line Algorithm: en.wikipedia.org/wiki/Sweep_line_algorithm🔗 Lloyd's algorithm: en.wikipedia.org/wiki/Lloyd%27s_algorithm🔗 Polygons and meshes by Paul Bourke: paulbourke.net/geometry/polygonmesh🎨 Pablo Jurado Ruiz: instagram.com/pablojuradoruiz🔗 Stippling: en.wikipedia.org/wiki/Stippling🔗 Voronoi Diagram: en.wikipedia.org/wiki/Voronoi_diagram🔗 Delaunay Triangulation: en.wikipedia.org/wiki/Delaunay_triangulation🔗 Mike Bostock's Voronoi Stippling: observablehq.com/@mbostock/voronoi-stipplingVideos:🚂 Pixel Array: youtu.be/nMUMZ5YRxHIRelated Coding Challenges:🚂 C4 Worley Noise: youtu.be/4066MndcyCk🚂 33 Poisson-disc Sampling: youtu.be/flQgnCUxHlwTimestamps:0:00 Hello!0:37 What is a Delaunay triangulation?2:31 d3-delaunay package2:49 Coding the delaunay triangulation.6:38 What is a Voronoi diagram?9:17 voronoi function on the delaunay object10:25 Things you could try with the Voronoi diagram10:56 Lloyd's "relaxation" algorithm12:07 Calculate the average of a polygon's vertices15:30 Calculate the area of a polygon16:45 Calculate the proper centroid of a polygon18:47 What is stippling?19:45 Draw dots based on brightness value of pixel21:50 Calculate a weighted centroid24:51 Using delaunay.find()27:52 Ideas for you to try!28:47 Goodbye!Editing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#delaunaytriangulation #imagestippling #voronoi #sweepalgorithm #lloydsalgorithm #p5js #javascript
I, Robot The Coding Train 2024-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💻 Code Example: github.com/CodingTrain/p5-gemini🎥 Next: youtu.be/0OLMf81BeNUReferences:🔗 ShiffBot: shiffbot.withgoogle.com🔗 Blog post on the development of ShiffBot: developers.googleblog.com/2024/01/how-its-made-learning-through-shiffbot-powered-by-gemini-api.html🔗 Gemini API: https://ai.google.dev🔗 Documentation on the Gemini API: https://ai.google.dev/tutorials/ai-studio_quickstart🔗 Coding Train tiktok: tiktok.com/@codingtrain🔗 Express: expressjs.com🔗 sableraph: twitch.tv/sableraph🔗 CodingGarden: twitch.tv/codinggardenVideos:🎥 Teacher x Large Language Models | Google Lab Sessions: youtube.com/watch?v=FBFcNPa36m8🎥 How to Set Up a Node.js Project: youtu.be/wM3TEvQn2hw🎥 fetch(): youtu.be/tc8DU14qX6IRelated Coding Challenges:🚂 42 Markov Chain Name Generator: youtu.be/eGFJ8vugIWA🚂 79 Number Guessing Chatbot: youtu.be/zGe1m_bLOFk🚂 80 Voice Chatbot with p5.Speech: youtu.be/iFTgphKCP9U🚂 179 Wolfram CA: youtu.be/Ggxt06qSAe4🚂 180 Falling Sand: youtu.be/L4u7Zy_b868Timestamps:0:00:00 Count down starts0:09:09 Welcome to the livestream!0:20:06 ShiffBot0:30:47 Demo ShiffBot0:59:19 Intermission1:05:25 Back from intermission1:08:58 Review showcases1:40:10 Genuary 20241:42:10 Working with the Gemini API1:55:05 Host a p5.js sketch1:59:57 Connect the node.js express server to p52:07:03 Multi-turn conversations2:18:59 Next steps2:23:17 OutroMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#geminiapi #shiffbot #node #genuary2024 #javascript
Coding Challenge 180: Falling Sand The Coding Train 2024-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-180-falling-sandp5.js Web Editor Sketches:🕹️ Falling Sand: editor.p5js.org/codingtrain/sketches/AoH40T6fV🕹️ Falling Sand with Gravity: editor.p5js.org/codingtrain/sketches/Ij5i7a3w4🎥 Previous: youtu.be/Ggxt06qSAe4?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 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.comVideos:🎥 Noita 1.0 Launch Trailer by Nolla Games: youtube.com/watch?v=0cDkmQ0F0Jw🚂 Wolfram CA: youtu.be/Ggxt06qSAe4🚂 The Game of Life: youtu.be/FWSR_7kZuYgRelated Coding Challenges:🚂 179 Wolfram CA: youtu.be/Ggxt06qSAe4🚂 85 The Game of Life: youtu.be/FWSR_7kZuYg🚂 107 Sandpiles: youtu.be/diGjw5tghYU🚂 132 Fluid Simulation: youtu.be/alhpH6ECFvQ🚂 102 2D Water Ripple: youtu.be/BZUdGqeOD0wTimestamps:0:00 Introduction and references2:10 About cellular automata2:47 The rules for a sand simulation3:36 Code! Creating a grid5:04 Animating a falling grain of sand7:32 About matrix columns and rows8:04 Let's account for the bottom edge9:09 Adding mouse interaction9:42 More sophisticated sand behavior10:43 Oops! Some errors to fix11:30 Adding randomness12:26 Handling left and right edges14:00 Checking if mouse is within the canvas14:40 Making it more efficient14:56 More space and more sand16:55 Adding some color!18:54 Challenge complete! Let's do some refactoring20:58 How could we add gravity?21:57 Wrapping upEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#pixels #simulation #fallingsand #fluidsimulation #sandpilemodel #generativeart #p5js #javascript
Coding Challenge 179: Elementary Cellular Automata The Coding Train 2024-01-09 | How is nature hidden in a pile of 0s and 1s? Let's find out by coding a p5.js visualization of the Wolfram Elementary Cellular Automaton! Code: thecodingtrain.com/challenges/179-wolfram-ca🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-wolfram-elementary-cap5.js Web Editor Sketches:🕹️ Wolfram Cellular Automata: editor.p5js.org/codingtrain/sketches/IE77UYZ-G🕹️ Wolfram CA with color: editor.p5js.org/codingtrain/sketches/1w8yOaaDS🕹️ Wolfram CA infinite scroll: editor.p5js.org/codingtrain/sketches/u6ALWY0Kt🕹️ 3D Grid: editor.p5js.org/codingtrain/sketches/m4XoXiWOa🎥 Previous: youtu.be/rVBTxnRyOuE?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 A New Kind of Science: wolframscience.com/nks🔗 Elementary Cellular Automaton: mathworld.wolfram.com/ElementaryCellularAutomaton.html🔗 Pre-Order Nature of Code: nostarch.com/nature-code🔗 The Nature of Code: natureofcode.comRelated Coding Challenges:🚂 85 The Game of Life: youtu.be/FWSR_7kZuYg🚂 123 Chaos Game: youtu.be/7gNzMtYo9n4🚂 119 Binary to Decimal Conversion: youtu.be/meGcdIoTYgwTimestamps:0:00 Hello!2:09 What is an elementary cellular automata?5:41 Explaining the rulesets7:52 Calculating the next generation.10:35 Visualizing the CA14:25 Rule 9016:45 Wolfram Classification.19:19 Adding wrap-around20:37 Suggestions for variations!21:07 Goodbye!Editing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#natureofcode #wolfram #ca #cellularautomata #binarytodecimalconversion #sierpinskitriangle #p5js #javascript
Decade of Code Fundraiser (Celebrating 10 years of Processing Foundation Fellowships!) The Coding Train 2024-01-07 | Celebrate 10 years of the Processing Foundation Fellowships! donorbox.org/to-the-power-of-10 code: thecodingtrain.com/tracks/livestreams/livestreams/decade-of-code💻 Github Repo: github.com/CodingTrain/Logo-Animations🕹️ p5.js Web Editor Sketch: editor.p5js.org/codingtrain/sketches/IxNfhHxJ3💻 Code Example: github.com/CodingTrain/Logo-Animations🎥 Next: youtu.be/1mwguqeEz8cReferences:🔗 Decade of Code Fundraiser: donorbox.org/to-the-power-of-10🔗 Meet our 2023 Processing Fellows!: medium.com/@ProcessingOrg/meet-our-2023-processing-fellows-6433037145bd🔗 Processing Foundation's 2023 Impact Report: https://processingfoundation.report/🔗 sableraph: twitch.tv/sableraph🔗 Anna Carreras's website: annacarreras.comRelated Coding Challenges:🚂 78 Simple Particle System: youtu.be/UcdigVaIYAkTimestamps:0:00:00 Count down starts0:05:00 Welcome to the livestream0:08:10 Introduce Raphael de Courville0:11:08 Processing Foundation0:20:10 Start video0:25:40 Merch for donations0:28:54 Wallpapers0:42:39 Live Preview for VSC0:43:39 Live Share0:46:57 Console output0:51:21 Decide what to code0:59:26 Start coding2:22:59 Contributing your version2:26:39 Logo-Animations2:31:04 OutroMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#processingfoundation #particlesystem #translate #pushandpop #javascript
Pixels in the Style of Vera Molnár #genuary4 #genuary5 The Coding Train 2024-01-06 | Inspired by Structure de Quadrilatères by Vera Molnár
Particles! #genuary #genuary1 #genuary2024 The Coding Train 2024-01-01 | Am I really going to do this every day? Oy.
Clustering Sentence Embeddings with transformers.js and umap-js The Coding Train 2023-12-04 | This is a new topic I'm teaching in my class this fall so recording an extra session to go over a new example!github.com/Programming-from-A-to-Z/A2Z-F23/tree/main/08-embeddingsgithub.com/Programming-from-A-to-Z/Save-Embeddings-JSONeditor.p5js.org/codingtrain/sketches/AebzAbSpUeditor.p5js.org/codingtrain/sketches/9CpF5OVy4editor.p5js.org/codingtrain/sketches/ikGWzG2N6🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: thecodingtrain.com/guides/membership🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train
Coding Train Stickers 2023 Last Call! The Coding Train 2023-11-29 | More at: thecodingtrain.com/members🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/community-contribution-guide.html💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train
Exploring Transformers.js Embeddings and Other Updates The Coding Train 2023-11-26 | Learn more about the game and see it in action at upperstory.com/turingtumble/?utm_source=YouTube&utm_medium=CodingTrain. Use the coupon code CODINGTRAIN for 10% off your total purchase.00:00 Choo choo!06:05 Welcome!10:00 Today's Sponsor Turing Tumble13:52 Making a List25:44 Turing Tumble Demonstration46:25 Passenger Showcase01:09:11 My NYU Syllabus01:15:30 Transformers and EmbeddingsNotes on transformers: github.com/Programming-from-A-to-Z/A2Z-F23/tree/main/07-transformers🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: thecodingtrain.com/guides/membership🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train
I made a Discord Bot that says Choo Choo The Coding Train 2023-11-13 | Learn to create a Discord bot using Discord.js in Node.js. This video walks through setting up a node project, creating a Discord application, and writing code for authentication, slash commands, and bot interaction. Code: thecodingtrain.com/tracks/discord-bots/discord/coding-a-bot🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-how-to-make-a-discord-bot-in-javascript💻 Code Example: github.com/CodingTrain/Discord-Bot-Examples/tree/main/01-discordjs🎥 Previous: youtu.be/wM3TEvQn2hwReferences:🤖 Discord Developer Portal: discord.com/developers/applications📃 Discord API Documentation: discord.com/developers/docs/reference🎨 Discord.js: discord.js.org📄 Discord.js Guide: https://discordjs.guide/💾 Discord Gateway Intents: github.com/CodingTrain/Discord-Bot-Examples/wiki/Discord-GatewayIntents-explainedVideos:🚂 Hiding API keys with .env: youtu.be/17UVejOw3zA🚂 async/await: youtu.be/XO77Fib9tSITimestamps:0:00 Introduction3:39 Setting up the Node.js project5:50 Creating the Discord application6:24 Inviting your Discord bot10:11 Enabling developer mode on Discord10:33 Setting up the .env file12:47 Code! Getting the bot to log into Discord18:16 Creating a slash command24:00 Deploying the slash command25:53 Listening for the command interaction and executing the command30:08 How Discord bots communicate with Discord32:00 Discord.JS documentationCorrections: 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 projectEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#discordbots #javascript #nodejs #discordjs
How to Set Up a Node.js Project The Coding Train 2023-11-09 | Learn how to set up a Node.js project, run JavaScript code outside the browser, and use npm for package management! Code: thecodingtrain.com/tracks/discord-bots/discord/setup-node-project🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-how-to-setup-a-nodejs-project💻 Github Repo: github.com/CodingTrain/node-project-demo🎥 Previous: youtu.be/46WOuOrMwTQ🎥 Next: youtu.be/AvQcTjB3gPgReferences:📂 fs module: nodejs.org/api/fs.html📦 npm registry: npmjs.com🐮 cowsay package: npmjs.com/package/cowsay🖼️ canvas package: npmjs.com/package/canvas🤖 Discord Bot Examples: github.com/CodingTrain/Discord-Bot-ExamplesTimestamps:0:00 Introduction1:47 Running JavaScript code with Node3:04 Creating a Node project7:24 Using built-in Node modules11:51 Installing and using third party packages18:26 Working with existing Node projects24:02 SummaryEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#nodejs #javascript #nodejs
Workflow: Terminal, Shell, Node.js, VSCode The Coding Train 2023-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-workflow-terminal-shell-nodejs-vscode🎥 Next: youtu.be/wM3TEvQn2hwRelated Videos:📊 Working with Data and APIs: youtube.com/playlist?list=PLRqwX-V7Uu6YxDKpFzf_2D84p0cyk4T7X📜 Git and GitHub for Poets: youtube.com/playlist?list=PLRqwX-V7Uu6ZF9C0YMKuns9sLDzK6zoiVTerminal and Shell:🐚 Z Shell: zsh.sourceforge.io🌈 Oh My Zsh: github.com/ohmyzsh/ohmyzsh💪 curl: https://curl.se/Node.js:👾 Node.js: nodejs.org⚙️ NVM: github.com/nvm-sh/nvm🪟 NVM for Windows: github.com/coreybutler/nvm-windowsVSCode:🆚 Visual Studio Code: code.visualstudio.com🌈 Prettier Extension: marketplace.visualstudio.com/items?itemName=esbenp.prettier-vscodeTimestamps:00:00 Introduction02:45 Terminal access03:38 Unix04:51 Shell - a command line interface to the operating system05:30 Oh My Zsh07:27 Node.js08:05 Node Version Manager11:48 Setting the default version of node13:07 Visual Studio Code14:00 Preferences and Extensions15:27 Prettier17:15 Format On Save18:22 Settings.json20:12 Install 'code' command in PATH23:06 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#nodejs #shell #unix #terminal #nvm #vscode #editor #workflow #javascript
Creative Coding for Beginners - Full Course! The Coding Train 2023-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 🚀 Watch this video ad-free on Nebula! nebula.tv/videos/codingtrain-beginners-guide-to-creative-coding-with-processing-full-courseWhether 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!📄 References and Code: github.com/CodingTrain/Creative-Coding-Processing-Full-CourseTimestamps:0:00:00 ⭐️ INTRODUCTION ⭐️0:14:43 How to Download Processing0:17:30 ⭐️ DRAWING WITH CODE ⭐️0:27:58 Shapes0:30:34 The Processing Reference0:39:19 Saving Your Code0:41:03 Code Comments0:42:27 Errors0:44:38 Color0:48:11 Stroke Weight0:50:31 RGB color0:53:45 Bits and Bytes0:56:45 Color Modes0:59:26 Alpha Transparency1:04:39 ⭐️ FLOW ⭐️1:06:31 Setup and Draw1:13:27 mouseX and mouseY1:19:13 mousePressed()1:29:31 ⭐️ VARIABLES ⭐️1:31:39 Creating Your Own1:48:56 Incrementation Operations1:53:20 Random Numbers2:02:46 ⭐️ CONDITIONALS ⭐️2:04:01 The "IF" Statement2:10:30 "ELSE"2:18:30 Logical Operators2:28:47 The Bouncing Ball2:40:38 Boolean Variables2:50:01 ⭐️ LOOPS ⭐️2:51:30 The While Loop2:57:49 Variable Scope3:00:10 The For Loop3:04:48 Nested Loops3:12:29 ⭐️ ARRAYS ⭐️3:18:44 Indexing3:28:02 Iteration3:40:29 ⭐️ FUNCTIONS ⭐️3:43:48 Defining Your Own3:49:39 Modularity3:52:33 Reusability3:57:00 Return Types4:02:30 ⭐️ CLASSES AND OBJECTS ⭐️4:25:18 Constructor Arguments4:34:30 Arrays of Objects4:54:21 Enhanced Loop4:56:20 ⭐️ CONFETTI PROJECT ⭐️5:03:15 ⭐️ CONCLUSION ⭐️Editing by Mathieu BlanchetteAnimations by Jason HeglundResearch and Additional Code by Melissa Rodriguez: instagram.com/hellomelissarodriguezMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#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 #java
New Full Processing Course Announcement (and other updates) The Coding Train 2023-09-25 | Subscribe to Nebula for the new Processing course! go.nebula.tv/codingtrainTopics:0:00 Hello11:26 Nebula Lifetime promotion and new Processing course42:36 Nature of Code updates53:47 Hacktoberfest / manually submitting showcases58:30 Update about member sticker packet mailing1:15:49 New logo and p5.js sketchCode:Logo sketch: editor.p5js.org/codingtrain/sketches/p599bQ3saRepo for Coding Train logo: github.com/CodingTrain/Coding-Train-LogoProcessing Course repo: github.com/CodingTrain/Creative-Coding-Processing-Full-CourseVideos: Autoencoder livestream: youtube.com/watch?v=Y9w2PYfIf34🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/Guides/community-contribution-guide.html🚩 Suggest Topics: github.com/CodingTrain/Rainbow-Topics💡 GitHub: github.com/CodingTrain💬 Discord: discord.gg/hPuGy2g💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain📚 Books: amazon.com/shop/thecodingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🐘 Mastodon @shiffman@mastoton.social🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
Beginner Creative Coding Course now on Nebula! The Coding Train 2023-09-22 | Be the first to watch by signing up for Nebula! All with Processing 4. 5+ hours of material. For total beginners. Coming to YouTube in October! go.nebula.tv/codingtrain
Did I finish Nature of Code? The Coding Train 2023-08-26 | 🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/Guides/community-contribution-guide.html🚩 Suggest Topics: github.com/CodingTrain/Rainbow-Topics💡 GitHub: github.com/CodingTrain💬 Discord: discord.gg/hPuGy2g💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain📚 Books: amazon.com/shop/thecodingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🐘 Mastodon @shiffman@mastoton.social🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
All aboard the new Coding Train website! The Coding Train 2023-05-31 | The Coding Train has a new website! thecodingtrain.comDesign Systems International: https://designsystems.internationalCoding Train Case Study: https://designsystems.international/work/the-coding-train/Video thanks to the ITP/IMA Documentation LabEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
ITP/IMA Pre-Show The Coding Train 2023-05-14 | Come for updates about The Coding Train and the Nature of Code, stay for a live stream of the ITP/IMA spring show! https://itp.nyu.edu/show youtube.com/watch?v=d-VPJC2hAho🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/Guides/community-contribution-guide.html🚩 Suggest Topics: github.com/CodingTrain/Rainbow-Topics💡 GitHub: github.com/CodingTrain💬 Discord: discord.gg/hPuGy2g💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain📚 Books: amazon.com/shop/thecodingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🐘 Mastodon @shiffman@mastoton.social🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
Coding Challenge 178: Climate Spiral The Coding Train 2023-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-178-visualizing-data🕹️ p5.js Web Editor Sketch: editor.p5js.org/codingtrain/sketches/r69De6khN🎥 Previous video: youtu.be/IxdGyqhppis?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All videos: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🌥️ National Centre for Atmospheric Science: ncas.ac.uk🌥️ Ed Hawkin's website: edhawkins.org🌎 NASA Earth Observatory - Global Temperatures: earthobservatory.nasa.gov/world-of-change/global-temperatures🌎 GISS Surface Temperature Analysis (GISTEMP v4): data.giss.nasa.gov/gistemp🌎 GISS Surface Temperature Analysis FAQ: data.giss.nasa.gov/gistemp/faq🌎 GLOBAL SURFACE TEMPERATURE CHANGE: pubs.giss.nasa.gov/docs/2010/2010_Hansen_ha00510u.pdf🌎 Improvements in the GISTEMP Uncertainty Model: agupubs.onlinelibrary.wiley.com/doi/10.1029/2018JD029522🌊 National Centers for Environmental Information: ncei.noaa.gov/access/metadata/landing-page/bin/iso?id=gov.noaa.ncdc:C00934🔗 Suggestion from ABohyn: github.com/CodingTrain/Suggestion-Box/issues/1789🔗 p5.loadTable: p5js.org/reference/#/p5/loadTable🔗 p5.TableRow: p5js.org/reference/#/p5.TableRow🔗 lerpColor(): p5js.org/reference/#/p5/lerpColorVideos:🎥 Climate Spiral: youtube.com/watch?v=jWoCXLuTIkI🚂 Polar Coordinates: youtu.be/O5wjXoFrau4🚂 Translate, Rotate, Push/Pop: youtu.be/o9sgjuh-CBMRelated Coding Challenges:🚂 48 White House Social Media Data Visualization: youtu.be/UrznYJltZrU🚂 58 3D Earthquake Data Visualization: youtu.be/dbs4IYGfAXc🚂 96 Visualizing the Digits of Pi: youtu.be/WEd_UIKG-uc🚂 109 Visualizing 500,000 Subscribers: youtu.be/Ae73YY_GAU8Timestamps: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 website3:17 Preview the data4:34 Upload the data5:13 Use loadTable() to preload the data7:01 Check out the data9:28 Set up the base pattern10:42 Polar Coordinates12:36 Add the month labels16:11 Time for the data!17:05 Draw the spiral18:09 Set up global variables19:04 Map the x, y positions to the data20:27 Loop through all of the data21:57 Check for null values22:43 Animate the spiral25:17 Add one month at a time28:47 Add color to the spiral29:42 Connect the points with a line segment34:45 Use lerpColor() to vary color38:00 Use parseFloat() to convert a string to a float38:40 We have the climate spiral40:16 Suggestions for possible variations40:42 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#data #visualization #datavisualization #climatespiral #climatechange #p5js #javascript
Coding Challenge 177: Soft Body Physics The Coding Train 2023-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-177-soft-body-characterp5.js Web Editor Sketches:🕹️ Soft Body Character: editor.p5js.org/codingtrain/sketches/2PInK4yQ2🕹️ Soft Body Character Enhanced: editor.p5js.org/codingtrain/sketches/6hhdl9omt🕹️ Soft Body Dancing Skeleton: editor.p5js.org/codingtrain/sketches/dg1wrHrpg🕹️ Soft Body Letters: editor.p5js.org/codingtrain/sketches/8MyUnoi13🕹️ Blank Canvas: editor.p5js.org/codingtrain/sketches/ccwlnhtji🎥 Previous video: youtu.be/h5ZNcAPXxew?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All videos: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 Nature of Code: https://nature-of-code-2nd-edition.netlify.app/🔗 ToxicLibs.js: http://haptic-data.com/toxiclibsjs🔗 ToxicLibs Java Reference: shiffman.github.io/toxiclibs-javadocs🔗 Advanced Character Physics: http://www.cs.cmu.edu/afs/cs/academic/class/15462-s13/www/lec_slides/Jakobsen.pdf🔗 Thi.ng: https://thi.ng/Videos:🚂 Toxiclibs Verlet Physics playlist: youtube.com/watch?v=E67e0RX-7Ew&list=PLRqwX-V7Uu6aiaU4s30tXvUmwGMlb9UUS🚂 Matter.js playlist: youtube.com/watch?v=urR596FsU68&list=PLRqwX-V7Uu6bLh3T_4wtrmVHOrOEM1ig_🎥 Physics of JellyCar: youtu.be/3OmkehAJoyo🎥 The Making of Nokia and Friends: youtube.com/watch?v=g20QOQP6kSURelated Coding Challenges:🚂 20 3D Cloth with Toxiclibs: youtu.be/jrk_lOg_pVA🚂 63 Texturing Cloth Simulation: youtu.be/JunJzIe0hEoTimestamps:0:00 Introduction2:51 Physics libraries5:30 Elements in ToxicLibs5:47 Start coding7:04 Object destructuring8:10 Add gravity9:00 Adding elements to the world10:35 Updating the physics world11:40 Adding a spring15:23 Refactor code18:07 Inheritance18:57 Super class23:31 Spring length25:44 Create a closed-filled shape to draw the character26:49 Suggestions for variations27:07 Other types of springs27:36 Update about the Nature of Code book!28:56 OutroEditing by Mathieu BlanchetteAnimations by Jason HeglundMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#softbody #toxiclibs #verletphysics #p5js #javascript
Coding Challenge 176: Buffons Needle The Coding Train 2023-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🚀 Watch this video ad-free on Nebula nebula.tv/videos/codingtrain-coding-challenge-buffons-needlep5.js Web Editor Sketches:🕹️ Buffon's Needle: editor.p5js.org/codingtrain/sketches/zqytzJAZN🕹️ Line Line Intersection: editor.p5js.org/codingtrain/sketches/htO0scRB1🕹️ Probability Density Function Graph: editor.p5js.org/codingtrain/sketches/eMaEGlfmu🎥 Previous video: youtu.be/PHfKCxjsmos?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 All videos: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpHReferences:🔗 Buffon's Needle: en.wikipedia.org/wiki/Buffon%27s_needle_problem🔗 Analysis and Simulation: https://mste.illinois.edu/activity/buffon/🔗 Pickup Sticks & Pi: https://ogden.eu/pi/Related Coding Challenges:🚂 95 Approximating the Value of Pi: youtu.be/5cNnf_7e92Q🚂 126 Toothpicks: youtu.be/-OL_sw2MiYw🚂 145 Ray Casting 2D: youtu.be/TOEi6T2mtHoTimestamps:0:00 Happy Pi Day 2023!0:45 Introduce Buffon's Needle1:40 Unpack the math4:40 Let toothpick fall at an angle7:08 The probability that the toothpick crosses the border7:27 Uniform probability density function8:12 Illustrate the probability with a graph10:49 Approximating the value of Pi11:11 Calculating the area under the curve12:48 Resources for Buffon's Needle13:28 Start Coding13:53 Draw vertical lines14:20 Add a toothpick15:02 Draw background in setup15:57 We have to use the built-in value of Pi17:00 Find the closest column17:22 Determine if the toothpick intersects the column18:10 Rotate the line relative to the y-axis18:50 Draw the toothpick as a vertical line19:40 Improve the visuals20:48 Approximate the value of Pi using the probability that a toothpick intersects a column23:45 Suggestions for variations24:08 New Passenger Showcase page on the Coding Train website24:38 Easter eggEditing by Mathieu BlanchetteAnimations by Jason HeglundPi Day Song by Will from AmericaMusic from Epidemic Sound🚂 Website: thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Suggestion-Box💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-ConductThis description was auto-generated. If you see a problem, please open an issue: github.com/CodingTrain/thecodingtrain.com/issues/new#piday #pi #buffonsneedle #buffon #p5js #javascript
Coding Train Live!: Genuary Speed Run Challenge! The Coding Train 2023-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/ ☄️ Coding Train on Nebula: go.nebula.tv/codingtrain💡Genuary Repo: github.com/CodingTrain/Genuary-2023Timestamps:0:00 Livestream starts20:14 Timer starts20:32 Genuary 1 - Perfect GIF loop25:24 Genuary 2 - Made in 10 minutes32:13 Genuary 3 - Glitch Art40:35 Genuary 4 - Intersections46:45 Genuary 5 - Debug View50:00 Genuary 6 - Steal Like an Artist55:25 Genuary 7 - Sample a color palette from your favorite movie/album cover1:00:18 Genuary 8 - Signed Distance Functions1:08:12 Genuary 9 - Plants1:16:01 Genuary 10 - Generative Music1:21:48 Genuary 11 - Suprematism1:33:30 Genuary 12 - Tessellation1:41:25 Genuary 13 - Something you’ve always wanted to learn1:53:21 Genuary 14 - Aesemic2:02:18 Genuary 15 - Sine waves2:04:16 Genuary 16 - Reflection of a reflection2:13:44 Genuary 17 - A grid inside a grid inside a grid2:21:25 Genuary 18 - Definitely not a grid2:22:10 Genuary 19 - Black and white2:25:25 Genuary 20 - Art Deco2:28:27 Genuary 21 - Persian Rug2:41:14 Genuary 22 - Shadows2:46:00 Genuary 23 - More Moiré2:50:55 Genuary 24 - Textile3:01:37 Genuary 25 - Yayoi Kusama3:13:12 Genuary 26 - My kid could have made that3:15:10 Genuary 27 - In the style of Hilma Af Klint3:21:54 Genuary 28 - Generative poetry3:35:00 Genuary 29 - Maximalism3:47:30 Genuary 30 - Minimalism3:49:01 Genuary 31 - Deliberately break one of your previous images🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/Guides/community-contribution-guide.html🚩 Suggest Topics: github.com/CodingTrain/Rainbow-Topics💡 GitHub: github.com/CodingTrain💬 Discord: discord.gg/hPuGy2g💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain📚 Books: amazon.com/shop/thecodingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🐘 Mastodon @shiffman@mastoton.social🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
I broke ChatGPT! #creativecoding #ai #shorts The Coding Train 2023-01-18 | Was ChatGPT trained on Coding Train challenges?Recursive Fractal Trees Challenge:thecodingtrain.com/challenges/14-fractal-trees-recursiveRecursive Fractal Tree short:youtube.com/shorts/j6txbhwP9jo🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/guides/passenger-showcase-guide🚩 Suggest Topics: github.com/CodingTrain/Rainbow-Topics💡 GitHub: github.com/CodingTrain💬 Discord: thecodingtrain.com/discord💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: nebula.tv/codingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
Coding Train 2022 in Review, Plans for 2023 The Coding Train 2023-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!💻 2023 GIF editor.p5js.org/codingtrain/sketches/Uzj1dZTZ6Timecodes:0:00 Start of stream6:30 New opening animation20:47 White Board: review 2022/plans for 202337:20 Nebula50:27 Answer viewer questions1:02:43 Reviewing 2022 livestreams1:04:23 Twitch livestreams1:20:53 A Year in the Life Twitter 20222:40:47 Let's Code: Genuary 1st -- GIF LoopLinks Discussed:🔗 Genuary 2023 https://genuary.art🔗 Oregon Trail github.com/CodingTrain/Oregon-Trail🔗 github.com/Lumon-Industries/Macrodata-Refinement🚂 Website: http://thecodingtrain.com👾 Share Your Creation! thecodingtrain.com/Guides/community-contribution-guide.html🚩 Suggest Topics: github.com/CodingTrain/Rainbow-Topics💡 GitHub: github.com/CodingTrain💬 Discord: discord.gg/hPuGy2g💖 Membership: http://youtube.com/thecodingtrain/join🛒 Store: standard.tv/codingtrain📚 Books: amazon.com/shop/thecodingtrain🖋️ Twitter: twitter.com/thecodingtrain📸 Instagram: instagram.com/the.coding.train🐘 Mastodon @shiffman@mastoton.social🎥 Coding Challenges: youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH🎥 Intro to Programming: youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA🔗 p5.js: p5js.org🔗 p5.js Web Editor: editor.p5js.org🔗 Processing: processing.org📄 Code of Conduct: github.com/CodingTrain/Code-of-Conduct
