> Canonical URL: https://codingcat.dev/podcast/2-36-Building-in-CodeSandbox-with-Adewale-Ace-Abati

# Building in CodeSandbox with Adewale "Ace" Abati

🎧 Podcast Episode · S2E36August 24, 2022

# Building in CodeSandbox with Adewale "Ace" Abati

![](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/5025b84c224a43867c61a0a83063d3bb04ce97af-1920x1080.jpg?w=1920&h=1080&q=82&fit=max&auto=format)[@CodingCatDev62.5K / 100K Subscribers Goal](https://www.youtube.com/@codingcatdev?sub_confirmation=1)[Subscribe on YouTube→](https://www.youtube.com/@codingcatdev?sub_confirmation=1)[Watch on YouTube App ↗](https://www.youtube.com/watch?v=5azEeJEyb1o&list=UUnKZ8gEb78zXKMi1ns-IQ2g)[![Alex Patterson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)[![Brittney Postma](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/f25e504779cb6ebb7c0dd7df367f2c7490e17784-735x735.png?w=96&h=96&q=82&fit=max&auto=format)Brittney Postma](/author/brittney-postma)[![Adewale Abati](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/e8d12f13db294d3038f36e06182de01e0e1f5ac0-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Adewale Abati](/guest/ace-kyd)🎧 Listen & Subscribe[Spotify](https://open.spotify.com/episode/5cl1JKnso0s054qMl4aJQn)[Apple](https://podcasts.apple.com/us/podcast/2-36-building-in-codesandbox-with-adewale-ace-abati/id1491655542?i=1000577382449)[YouTube](https://www.youtube.com/watch?v=5azEeJEyb1o&list=PLUKgAjyG9B0ZhUEXp9eVa7h4L__FDW3uV)[Subscribe on YouTube (62.5K / 100K) →](https://www.youtube.com/@codingcatdev?sub_confirmation=1)[Pocket Casts](https://pca.st/episode/4bb81549-129d-427d-ae49-19b9a948c8f8)[Castbox](https://castbox.fm/episode/id2508485-id525165952)[Castro](https://castro.fm/episode/VitEoD)[Overcast](https://overcast.fm/itunes1491655542)[RSS](https://anchor.fm/s/115b203c/podcast/rss)

## Episode Sponsors.

[![CodingCat.dev tutorial cover image](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/1564a576c0c19e1b857c9bfba3cfb6364e7af223-2400x1350.jpg?w=1920&q=82&fit=max&auto=format)Partner & Sponsor

### Storyblok

Have you already discovered Storyblok? They have an official Svelte SDK! 74,000 + developers & marketers use it to deliver powerful content experiences on any frontend: Websites, eCommerce, mobile apps, AR/VR, or voice content!](https://www.storyblok.com/?utm_source=codingcat&utm_medium=sponsor&utm_campaign=AWA_SPON_PURRFECT_TRA&utm_content=purrfect-podcast)✏️ Visual Architecture Diagram

## how this episode connects together.

Follow AJ from first principles to production-ready architecture.

Let’s build it!✏️ Visual Diagram: Building in CodeSandbox with Adewale "Ace" Abati✓ Good PatternVISUAL DIAGRAM[Diagram Walkthrough]Step-by-step diagram breakdown for Building in CodeSandbox with Adewale "Ace" Abati: start with Adewale Abati, implement Architecture & Patterns, and ship to production.AAA Contrast Verified

**Building in CodeSandbox with Adewale "Ace" Abati ** is a CodingCat.dev podcast episode featuring Adewale Abati alongside Alex Patterson and Brittney Postma focused on JavaScript, React, HTML. Adewale “Ace” Abita, shows us how to use CodeSandbox to improve your developer experience and collaboration. Watch the full video breakdown on [**YouTube**](https://www.youtube.com/watch?v=5azEeJEyb1o) or explore the architectural notes, chapters, and official documentation links below.

## Questions

- Can you tell us more about yourself?
- Can you tell us what dev is like in Nigeria? It seems to be getting bigger every month.
- How does someone typically use [CodeSandbox](https://codesandbox.io/)?
- How is [CodeSandbox](https://codesandbox.io/) different than [CodePen](https://codepen.io/)
- [GitPod](https://gitpod.io/)
- [StackBlitz](https://stackblitz.com/)

- Does CodeSandbox have plans to move to web containers vs spinning up Docker containers?[https://codesandbox.io/post/open-beta](https://codesandbox.io/post/open-beta)

- Demo Time: Can you show us how to interact
- [Getting started with Docker](https://codesandbox.io/docs/projects/tutorial/getting-started-with-docker)

## Technical Overview: Building in CodeSandbox with Adewale "Ace" Abati

2.36 - Building in CodeSandbox with Adewale "Ace" Abati: Adewale “Ace” Abita, shows us how to use CodeSandbox to improve your developer experience and collaboration. https://codingcat.dev/podcast/2-36-Building-in-CodeSandbox-with-Adewale-"Ace"-Abati Sponsors: Storyblok
Have you already discovered Storyblok? They have an official Svelte SDK! 74,000 + de

When applying the concepts from **Building in CodeSandbox with Adewale "Ace" Abati**  in a production codebase, teams working with JavaScript, React, HTML should align their implementation with the [**MDN JavaScript Reference**](https://developer.mozilla.org/en-US/docs/Web/JavaScript) (ECMAScript specifications, Web APIs, and runtime fundamentals). Structuring your workflow around repeatable patterns, automated verification, and clear separation of concerns helps prevent regressions as your application scales.

### Key Engineering Takeaways

- **Core Topic Focus: ** Practical strategies for JavaScript, React, HTML covered in "Building in CodeSandbox with Adewale "Ace" Abati" (Adewale “Ace” Abita, shows us how to use CodeSandbox to improve your developer experience and collaboration.).
- **Production Implementation: ** Combine the architectural patterns demonstrated in this podcast with the official [MDN JavaScript Reference](https://developer.mozilla.org/en-US/docs/Web/JavaScript) for type safety, performance, and long-term maintainability.
- **Hands-On Video Walkthrough: ** Follow along with the live coding demos and discussion on [YouTube (Building in CodeSandbox with Adewale "Ace" Abati)](https://www.youtube.com/watch?v=5azEeJEyb1o) and subscribe to [CodingCat.dev on YouTube](https://www.youtube.com/@CodingCatDev?sub_confirmation=1) for weekly deep dives.

## Video Chapters & Timestamps

Jump directly to any segment of [**Building in CodeSandbox with Adewale "Ace" Abati**](https://www.youtube.com/watch?v=5azEeJEyb1o) on YouTube using the timestamped chapters below:

- [**00:00**](https://www.youtube.com/watch?v=5azEeJEyb1o&t=0s): PM (EDT)

## Resources, Links & Official Documentation

- **Watch on YouTube: ** [Building in CodeSandbox with Adewale "Ace" Abati Full Video](https://www.youtube.com/watch?v=5azEeJEyb1o) (plus [Subscribe to CodingCat.dev](https://www.youtube.com/@CodingCatDev?sub_confirmation=1))
- **storyblok.com: ** [https://www.storyblok.com/?utm_source=codingcat&utm_medium=sponsor&utm_campaign=AWA_SPON_PURRFECT_TRA&utm_content=purrfect-podcast](https://www.storyblok.com/?utm_source=codingcat&utm_medium=sponsor&utm_campaign=AWA_SPON_PURRFECT_TRA&utm_content=purrfect-podcast)
- **Show Pick: ** [The Terminal List (picked by Alex Patterson)](https://www.primevideo.com/detail/The-Terminal-List/0NGB908JKDOZ29WLQ2GS45USOV)
- **Show Pick: ** [Up and Running with Remix | egghead.io (picked by Alex Patterson)](https://egghead.io/courses/up-and-running-with-remix-b82b6bb6)
- **Show Pick: ** [Centered.App (picked by Brittney Postma)](https://www.centered.app/)
- **Show Pick: ** [Yabai (picked by Brittney Postma)](https://github.com/koekeishiya/yabai)
- **Show Pick: ** [Naruto (picked by Adewale Abati)](https://www.crunchyroll.com/en-gb/naruto)
- **Show Pick: ** [Chakra UI (picked by Adewale Abati)](https://chakra-ui.com/)
- [**Adewale Abati Guest Profile & Episodes on CodingCat.dev**](/guest/ace-kyd)
- [**Adewale Abati on GitHub**](https://github.com/acekyd)
- [**Episode Sponsor: Storyblok**](https://www.storyblok.com/?utm_source=codingcat&utm_medium=sponsor&utm_campaign=AWA_SPON_PURRFECT_TRA&utm_content=purrfect-podcast)
- [**MDN JavaScript Reference:**](https://developer.mozilla.org/en-US/docs/Web/JavaScript) ECMAScript specifications, Web APIs, and runtime fundamentals
- [**React Official Reference:**](https://react.dev/reference/react) Hooks, Server Components, and UI state patterns
- [**MDN HTML Reference:**](https://developer.mozilla.org/en-US/docs/Web/HTML) Semantic markup, accessibility attributes, and document structure

## Related CodingCat.dev Tutorials & Podcast Episodes

- [**RxFire in Svelte 3 using Firebase Firestore and Authentication**](/post/rxfire-in-svelte-3-using-firebase-firestore-and-authentication): Introduction to Svelte3, Firebase, and RxFire. RxFire provides a set of observable creation methods. You simply call a function with some parameters to receive ...
- [**RxFire in ReactJS using Firebase Firestore and Authentication**](/post/rxfire-in-reactjs-using-firebase-firestore-and-authentication): Introduction to Create React App, Firebase, and RxFire. RxFire provides a set of observable creation methods. You simply call a function with some parameters to...
- [**How OAuth, MCP, and the OpenAI Apps SDK, Power the Next Generation of Interactive AI Experiences (with Stytch & OpenAI)**](/podcast/how-oauth-mcp-and-the-openai-apps-sdk-power-the-next-generation-of-interactive-ai-experiences): Curious about OAuth, MCP servers, and building cool ChatGPT apps? Hear from Max of Stytch as we dive deep, break down the tech, and build a Tamagotchi together!

## Frequently Asked Questions (FAQ)

### What are the main takeaways from Building in CodeSandbox with Adewale "Ace" Abati?

Adewale “Ace” Abita, shows us how to use CodeSandbox to improve your developer experience and collaboration. 2.36 - Building in CodeSandbox with Adewale "Ace" Abati: Adewale “Ace” Abita, shows us how to use CodeSandbox to improve your developer experience and collaboration. https://codingcat.dev/podcast/2-36-Building-in-CodeSandbox-with-Adewale-"Ace"-Abati Sponsors: Storyblok
Have you already discovered Storyblok? They have an official Svelte SDK! 74,000 + de Throughout this podcast, Adewale Abati breaks down real-world implementation details for JavaScript, React, HTML so developers can apply these patterns directly in production.

### How do you implement JavaScript best practices in production?

When adopting JavaScript and React in a production stack, start by validating your configuration against the [**MDN JavaScript Reference**](https://developer.mozilla.org/en-US/docs/Web/JavaScript) (ECMAScript specifications, Web APIs, and runtime fundamentals). Focus on incremental adoption, automated testing, and observability so your team can measure performance and developer velocity improvements at each stage.

### Where can I watch the full Building in CodeSandbox with Adewale "Ace" Abati walkthrough and find related code resources?

You can watch the complete video session for [**Building in CodeSandbox with Adewale "Ace" Abati**](https://www.youtube.com/watch?v=5azEeJEyb1o) on the [**CodingCat.dev YouTube channel**](https://www.youtube.com/@CodingCatDev?sub_confirmation=1). For a deeper dive into JavaScript, check out our related guide: [**RxFire in Svelte 3 using Firebase Firestore and Authentication**](/post/rxfire-in-svelte-3-using-firebase-firestore-and-authentication).

## ✏️ Episode Summary

2.36 - Building in CodeSandbox with Adewale "Ace" Abati: Adewale “Ace” Abita, shows us how to use CodeSandbox to improve your developer experience and collaboration.

https://codingcat.dev/podcast/2-36-Building-in-CodeSandbox-with-Adewale-"Ace"-Abati

Sponsors:

Storyblok
Have you already discovered Storyblok? They have an official Svelte SDK! 74,000 + de

## episode picks.

### 🐾 Adewale Abati

- [Naruto](https://www.crunchyroll.com/en-gb/naruto)
- [Chakra UI](https://chakra-ui.com/)

### 🐾 Alex Patterson

- [The Terminal List](https://www.primevideo.com/detail/The-Terminal-List/0NGB908JKDOZ29WLQ2GS45USOV)
- [Up and Running with Remix | egghead.io](https://egghead.io/courses/up-and-running-with-remix-b82b6bb6)

### 🐾 Brittney Postma

- [Centered.App](https://www.centered.app/)
- [Yabai](https://github.com/koekeishiya/yabai)

## recent episodes.

[All Episodes→](/podcasts)[![GenAI for Engineers, What](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/3e48f44739be2aabf3aaa805e51b3a6328979153-1920x1080.png?w=1920&q=82&fit=max&auto=format)](/podcast/genai-for-engineers-what-s-real-what-s-not-and-what-s-coming)November 19, 2025[AI & MCP Agents](/topic/ai)

### [GenAI for Engineers, What's Real, What's Not and What's Coming](/podcast/genai-for-engineers-what-s-real-what-s-not-and-what-s-coming)

Curious about GenAI for engineers? Learn what's real, what's not, and what's next in AI.

[![Alex Patterson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)[![Balki Kodarapu](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/25fd44884e232394eb74b776fcec7e8d13330ca0-1060x794.png?rect=133,0,794,794&w=96&h=96&q=82&fit=max&auto=format)Balki Kodarapu](/guest/balki-kodarapu)[![How OAuth, MCP, and the OpenAI Apps SDK, Power the Next Generation of Interactive AI Experiences (with Stytch & OpenAI)](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/0beb99900f4c24e284df2dee3e2d740062c6ce96-1920x1080.png?w=1920&q=82&fit=max&auto=format)](/podcast/how-oauth-mcp-and-the-openai-apps-sdk-power-the-next-generation-of-interactive-ai-experiences)November 4, 2025[AI & MCP Agents](/topic/ai)

### [How OAuth, MCP, and the OpenAI Apps SDK, Power the Next Generation of Interactive AI Experiences (with Stytch & OpenAI)](/podcast/how-oauth-mcp-and-the-openai-apps-sdk-power-the-next-generation-of-interactive-ai-experiences)

Curious about OAuth, MCP servers, and building cool ChatGPT apps? Hear from Max of Stytch as we dive deep, break down the tech, and build a Tamagotchi together!

[![Alex Patterson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/a606dfaa381aab08ddbe16a33fe1d3e1fb37c927-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Alex Patterson](/author/alex-patterson)[![Max Gerber](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/4497bb7ada0e39b4cd13b0e3ca00c930389dab02-1292x1088.png?rect=102,0,1088,1088&w=96&h=96&q=82&fit=max&auto=format)Max Gerber](/guest/max-gerber)