Website marketing using high authority backlinks from popular website's, find out more at webcentreplus.com or email colin@webcentreplus.com
Click Here!

creative coding

Coding Challenge #147: Chrome Dinosaur Game (with Speech Commands machine learning model!)



In this challenge, I attempt to make my own version of Google’s Dinosaur Game (T-Rex run!) with a unique twist — controlling the dinosaur (unicorn, in this case) with a machine learning Speech Commands model!

💻 Code: https://thecodingtrain.com/CodingChallenges/147-chrome-dinosaur

Links discussed… Continue reading

Coding Challenge #66: JavaScript Countdown Timer



In this video, I use the p5.js library to create a web-based countdown timer. I discuss the native JavaScript method setInterval() as well as p5’s millis().

💻Challenge: https://thecodingtrain.com/CodingChallenges/066-timer.html

Links discussed in this video:
🔗millis() reference: https://p5js.org/reference/#/p5/millis
🔗getURLParams() reference: https://p5js.org/reference/#/p5/getURLParams

🚂Website:… Continue reading

1.1: Code! Programming for Beginners with p5.js



Welcome aboard! This is the introductory video to start programming JavaScript with p5.js for total beginners.

💻 Code: https://thecodingtrain.com/Tutorials/1-p5js-basics/1.1-introduction.html
🎥 Next video: https://youtu.be/MXs1cOlidWs

Links discussed in this video:
🔗 Hello p5.js Web Editor!: https://medium.com/processing-foundation/hello-p5-js-web-editor-b90b902b74cf
🔗 p5.js Web Editor: https://editor.p5js.org/
🔗… Continue reading

11.3: Chrome Extensions: Content Scripts – Programming with Text



In this video, I cover “content scripts” for chrome extensions. The content script is a JavaScript file that runs in the context of a web page (and can be used to modify that page.)

Next video: https://youtu.be/ew9ut7ixIlI
Chrome Extensions playlist:… Continue reading

Coding Challenge #27: Fireworks!



In this 4th of July themed Coding Challenge, I build an HTML5 canvas Fireworks simulation from scratch using the p5.js JavaScript library. I also show how to use Processing to create 3D Fireworks. This code is based off of my… Continue reading

Build a Full Stack Twitter Clone with Coding Garden



CJ is an Educator, Full Stack Developer and Maker. He streams himself live coding tutorials and walk throughs about Full Stack Web Development and other related tech on the YouTube channel Coding Garden with CJ.

https://www.youtube.com/channel/UCLNgu_OupwoeESgtab33CCw
https://coding.garden/

Deployed app: https://meower.now.sh/… Continue reading

1.5: Errors & Console – p5.js Tutorial



In this video, I take a look at the p5.js console and error messages.

🎥 Next video: https://youtu.be/xJcrPJuem5Q
🎥 All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA

🔗 https://p5js.org/
🔗 p5.js Web Editor: https://editor.p5js.org/

🚂 Website: http://thecodingtrain.com/
💖 Patreon: https://patreon.com/codingtrain
🛒 Store: https://www.designbyhumans.com/shop/codingtrain/
📚 Books:… Continue reading

Coding Challenge #83: Chrome Extension with p5.js Sketch



In this coding challenge, I attempt to make a chrome extension that overlays a drawing canvas (using the p5.js library) on all webpages.

Coding Challenge on Chrome Extensions: https://youtu.be/8zMMOdI5SOk
Chrome Extensions playlist: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6bL9VOMT65ahNEri9uqLWfS

Support this channel on Patreon: https://patreon.com/codingtrain
To… Continue reading

Coding Challenge #26: 3D Supershapes



In this Coding Challenge, I use the “superformula” to make a 3D “supershape” in Processing. This is part 4 of a multi-part series on superformulas, superellipses and supershapes

Support this channel on Patreon: https://patreon.com/codingtrain

Send me your questions and coding… Continue reading

Coding Challenge #136.1: Polar Perlin Noise Loops



In this challenge, I follow the path of a circle in 2D Perlin noise space in order to use noise values that loop. #PerlinNoiseLoop

💻https://thecodingtrain.com/CodingChallenges/136-polar-perlin-noise-loops.html

🔗 Étienne Jacob’s tweet: https://twitter.com/i/status/1096403588069425152
🔗 Étienne Jacob’s Blog Post: https://necessarydisorder.wordpress.com/2017/11/15/drawing-from-noise-and-then-making-animated-loopy-gifs-from-there/

🎥 Heart Curve: https://youtu.be/oUBAi9xQ2X4… Continue reading

Archives