Coding Train Live 109: WebGL with p5.js
506In this live session, I explore the p5.js WEBGL renderer. I cover some fundamentals and attempt a viewer-suggested coding challenge to recreate a classic beesandbombs GIF.
Timestamps:
20:55 - Introduction to WebGL in p5.js
36:05 - 3D Geometry
50:55 - Lights and Material
1:51:36 - Coding Challenge: Bees and Bombs
🚂 Website: http://thecodingtrain.com/
👾 Share Your Creation! https://thecodingtrain.com/guides/passenger-showcase-guide
🚩 Suggest Topics: https://github.com/CodingTrain/Suggestion-Box
💡 GitHub: https://github.com/CodingTrain
💬 Discord: https://thecodingtrain.com/discord
💖 Membership: http://youtube.com/thecodingtrain/join
🛒 Store: https://standard.tv/codingtrain
🖋️ Twitter: https://twitter.com/thecodingtrain
📸 Instagram: https://www.instagram.com/the.coding.train/
🎥 Coding Challenges: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH
🎥 Intro to Programming: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6Zy51Q-x9tMWIv9cueOFTFA
🔗 p5.js: https://p5js.org
🔗 p5.js Web Editor: https://editor.p5js.org/
🔗 Processing: https://processing.org
References:
Bees and Bombs on Twitter: https://twitter.com/beesandbombs/status/940639806522085376
2017 Google Summer of Code Grand Wrap-Up Post: https://medium.com/@ProcessingOrg/2017-google-summer-of-code-grand-wrap-up-post-16680b1438db
Three.js: https://threejs.org/
The Coding Train on Amazon: https://www.amazon.com/shop/thecodingtrain
p5.js reference: https://p5js.org/reference/
Bees and Bombs: https://beesandbombs.tumblr.com/
Videos:
p5-manager: https://youtu.be/LdWleSHQTcw
Simple Harmonic Motion: https://youtu.be/GvwPwIUSYqE
Source Code for the all Video Lessons: https://github.com/CodingTrain/Rainbow-Code
For More Live Streams: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6bxnFR6no70vlxxuxDEzflz
Help us caption & translate this video!
https://amara.org/v/dXkl/
📄 Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct