• Developed a fully reactive website to showcase a podcast network's work and expand their reach amongst listeners and other podcasters.

• Integrated with Spreaker's API to pull podcast episode information and stats.

• Users could authenticate with Google's Firebase Auth and make customizations to their page, such as embedding Twitch streams, tweets, or Patreon buttons.

• Using a cloud function, scraped podcast episode data daily from the spreaker API, stored in firebase, and displayed an infinite scrolling list of all network episodes.

• Filling out forms sent out emails to both parties via cloud functions.

• Server-Side rendered pages in a cloud function and cached in Google's CDN for performance and SEO.

• OAuth2 Handshake with Spreaker to fetch and store episode information and play statics for display in graphs visible to admins.

Try it out: podhub-bd87b.web.app

(⚠ The original podhub url has been abandoned as the group has disbanded, but it’s still accessible from the firebase hosting URL.  Some images are also now broken)

In addition, almost all of the podcasts have been removed from the Spreaker account, so only a few podcasts (mostly) work, like North Shore Nine.

Skills Developed

• Collecting vague requirements from clients and iterating on designs based on received feedback.  A large percentage of time was spent on this.

• Became much more familiar with Google cloud technologies.  As well as utilizing the local emulation tools provided by google for local development and automated testing.

• Gained tons of experience integrating with external APIs, Implementing the OAuth2 handshake, and managing data.

Technology

• Next JS - Built on react.

• Google Firebase for user auth, document store, and cloud functions.

• Hosted as a cloud function.  Static pages generated on request and cached in the CDN.

• Completely custom, hand-crafted CSS. No UI framework of any kind.

• Jest unit tests.

Showcase