Build a custom API + app in 4 hours · Web Dev Challenge S2.E1

Sponsored by Postman — What could you create if you had 30 minutes to plan and 4 hours to build? Michael Liendo, Will Johnson, Abbey Perini, Alex Riviere, Brittany Ellich, and Dave Schwantes took on the Web Dev Challenge to find out. *THE CHALLENGE* _Build a custom API — and an app that consumes it — that makes something in your life a little more convenient._ Not every app needs to be the Next Big Thing. Sometimes you have a specific problem, challenge, or even just a pet peeve that can be solved with software. And these days, building an app that’s just for personal use is faster than ever. For this challenge, your team needs to create a custom API that uses at least one third-party source and extends it in some way. You’ll also need to build a web app that interacts with your API. The end result should be a system that adds convenience to your life. This could be something larger and practical, like automating something tedious you have to do over and over again (e.g. turn important incoming emails into calendar invites and/or Discord notifications), or it could be something fun and silly (e.g. use data from your wearable fitness device to calculate how many mini Snickers bars you’ve earned today). *THE TOOLS* Your app must use Postman as part of the build. Postman (https://codetv.link/postman) is the most popular tool out there for working with APIs. This challenge is all about collaboration, so you’re going to be using the *mock server feature* primarily, which will allow you to design your API surface together, then divide the work of building the API itself and building the app that consumes that API with confidence that they’ll fit together perfectly once they’re both ready. - Mock server feature: https://learning.postman.com/docs/designing-and-developing-your-api/mocking-data/setting-up-mock/ While not required, Postman _also_ has additional features and tools that might prove useful in the challenge: - The Public API Network (https://www.postman.com/explore) — this is a *huge* collection of public APIs that you can use as part of your build - AI Protocol (https://www.postman.com/product/ai-agent-builder/) — if you’re thinking of adding an LLM into your build, this handy tool will let you test your user input and system prompts on different models without having to wire up all the code for it first — you only need your API key *THE DEVS* Michael Liendo (@focusotter) https://focusotter.com/ Will Johnson https://x.com/willjohnsonio Abbey Perini (@abbeyperini) https://abbeyperini.dev/contact Alex Riviere (@fimion) https://alex.party Brittany Ellich https://brittanyellich.com Dave Schwantes (@DorkRawk) https://dinosaurseateverybody.com *THE ADVISORS* Sterling Chin (@SterlingChin) https://x.com/SilverJaw82 Jason Lengstorf (@codetv-dev) https://jason.energy/links *THE APPS* - Brittany and Dave's CoParent app: https://github.com/dorkrawk/coparent - Abbey and Alex's Dinner's Ready app: https://github.com/abbeyperini/dinners-ready - Michael and Will's HusbandGram app: https://github.com/mtliendo/husband-gram Tech used in this episode includes Nuxt, Vuetify, Vite, React, Ruby, Sinatra, react-dnd, SQLite, AWS, S3, AppSync, Claude, Eleven Labs, Twilio, and more. *THE GEAR* The workstations in this series are made possible through sponsorships from these wonderful companies: - BenQ RD280U monitors: https://codetv.link/benq - Uplift Desks: https://codetv.link/uplift - Keychron K8 Pro keyboards: https://codetv.link/keychron - Anglepoise desk lamps: https://codetv.link/anglepoise - Ugmonk desk accessories: https://codetv.link/ugmonk See the full desk setup here: https://codetv.link/uses *THE STUDIO* CodeTV Studio was built with generous support from Algolia. Add search to any app fast: https://codetv.link/algolia ---------------------------------------------------------------------- Get early access to new videos, exclusive bonus content and other perks, and join me in building a happier, healthier, friendlier web dev community! https://codetv.dev/support ---------------------------------------------------------------------- Chapters: 0:00 In this episode... 0:36 Welcome + the challenge 0:59 Required tool + meet your advisor + what is Postman? 2:15 Planning phase starts 3:32 Meet Brittany and Dave + their app idea 4:53 Meet Abbey and Alex + their app idea 6:11 Meet Michael and Will + their app idea 8:56 Advisor Jason Lengstorf weighs in on the teams' plans 9:19 Advisor Sterling Chin weighs in on the teams' plans 9:43 Build phase starts 13:35 Progress check ins 19:18 Late stage check ins 21:00 App demos, powered by BenQ 21:04 Team Fueled By Coffee (Brittany and Dave) app demo 23:30 Team Everything Is Awesome (Abbey and Alex) app demo 26:43 Team Ominous Malaysian Tiger (Michael and Will) app demo 30:04 Closing thoughts