Coding Challenge #39: Mad Libs Generator

Subscribers:
1,750,000
Published on ● Video Link: https://www.youtube.com/watch?v=ziBO-U2_t3k



Duration: 20:34
42,526 views
689


In this coding challenge, I make a Mad Libs web application using p5.js and tabletop.js (a JavaScript library for connecting to google sheet data.) Code: https://thecodingtrain.com/challenges/39-madlibs-generator

๐Ÿ•น๏ธ p5.js Web Editor Sketch: https://editor.p5js.org/codingtrain/sketches/8gVGg0VR3

๐ŸŽฅ All videos: https://www.youtube.com/playlist?list=PLRqwX-V7Uu6ZiZxtDDRCi6uhfTH4FilpH

References:
๐Ÿ“ƒ Tabletop.js: https://github.com/jsoma/tabletop
๐Ÿ—’๏ธ Papa Parse: https://www.papaparse.com/
๐Ÿ’ป Programming from A to Z Github: https://github.com/shiffman/A2Z-F16

Live Stream Archive:
๐Ÿ”ด Coding Train Live 61: https://youtu.be/Fe1sy9fkTKQ?t=6952s

Related Coding Challenges:
๐Ÿš‚ #37 Diastic Machine: https://youtu.be/u-HUtrpyi1c
๐Ÿš‚ #39 Mad Libs Generator: https://youtu.be/ziBO-U2_t3k
๐Ÿš‚ #42 Markov Chain Name Generator: https://youtu.be/eGFJ8vugIWA

Timestamps:
0:00 Introduction and what Mad Libs is
2:15 Making the Google Form
4:59 About getting the data into the program
6:25 Using tabletop.js
7:23 Getting the data from our spreadsheet
10:43 Creating a button
12:04 Using regular expressions to replace the blanks
14:46 Making the callback function to replace the words
16:50 Picking random words from the entries
18:47 The end result
19:15 So many possibilities to try!
20:11 Goodbye!

Editing by Mathieu Blanchette
Animations by Jason Heglund
Music from Epidemic Sound

๐Ÿš‚ 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

๐Ÿ“„ Code of Conduct: https://github.com/CodingTrain/Code-of-Conduct

This description was auto-generated. If you see a problem, please open an issue: https://github.com/CodingTrain/thecodingtrain.com/issues/new

#madlibs #googleforms #datacollecting #javascript #p5js #tabletopjs







Tags:
coding
programming
p5.js
week
rainbow
live
creative coding
coding challenge
javascript (programming language)
daniel shiffman
javascript
p5.js tutorial
p5js
tutorial
programming challenge
javascript string object
js string object
user input
tabletop.js
google spreadsheet javascript
google form javascript
user input javascript
google spreadsheet js
madlibs
madlibs generator
madlibs web application
madlibs javascript