Using CSS in JS with Stitches

Using CSS in JS with Stitchesis a CodingCat.dev podcast episode featuring Pedro Duarte alongside Alex Patterson and Brittney Postma focused on CSS, JavaScript. We sit down with Pedro Duarte to talk all about using CSS in JavaScript and why Modulz created Stitches. Using CSS in JS with Stitches: https://codingcat.dev/podcast/1-29-using-css-in-js-with-stitchesWatch the full video breakdown onYouTubeor explore the architectural notes, chapters, and official documentation links below.

Questions

1. What is CSS in JS?
2. Why use CSS in JS?
3. Why did Modulz create Stitches?
4. What's special about Stitches?
5. Is Stitches similar to styled components?
6. How does it differ from libraries like Emotion and Chakra?

Links

• Stitches docs
• Stitches repo
• Stitches twitter
• The Future of the Front-End
• Radix UI
• NPM Comparison of libraries

Technical Overview: Using CSS in JS with Stitches

Using CSS in JS with Stitches: https://codingcat.dev/podcast/1-29-using-css-in-js-with-stitches

When applying the concepts fromUsing CSS in JS with Stitchesin a production codebase, teams working with CSS, JavaScript should align their implementation with theMDN CSS Reference(Modern layout, Grid, Flexbox, animations, and cascade layers). 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 CSS, JavaScript covered in "Using CSS in JS with Stitches" (We sit down with Pedro Duarte to talk all about using CSS in JavaScript and why Modulz created Stitches.).
• Production Implementation:Combine the architectural patterns demonstrated in this podcast with the officialMDN CSS Referencefor type safety, performance, and long-term maintainability.
• Hands-On Video Walkthrough:Follow along with the live coding demos and discussion onYouTube (Using CSS in JS with Stitches)and subscribe toCodingCat.dev on YouTubefor weekly deep dives.

Resources, Links & Official Documentation

• Watch on YouTube:Using CSS in JS with Stitches Full Video(plusSubscribe to CodingCat.dev)
• Show Pick:Invincible TV Show (picked by Alex Patterson)
• Show Pick:JS and Friends Conference (picked by Alex Patterson)
• Show Pick:The Differing Perspectives on CSS-in-JS (picked by Brittney Postma)
• Show Pick:Snowpack (picked by Brittney Postma)
• Show Pick:Two Distant Strangers, on Netflix (picked by Pedro Duarte)
• Pedro Duarte Guest Profile & Episodes on CodingCat.dev
• Pedro Duarte on GitHub
• Pedro Duarte Official Website
• MDN CSS Reference:Modern layout, Grid, Flexbox, animations, and cascade layers
• MDN JavaScript Reference:ECMAScript specifications, Web APIs, and runtime fundamentals

Related CodingCat.dev Tutorials & Podcast Episodes

• Creating a Better Vue with Nuxt: We chat with Daniel Roe about how he became a member of the Nuxt team and how Nuxt fits into the Vue.js ecosystem.
• Teaching Others to Code Lessons Learned: In this episode we sit down with Prince Wilson and talk about his experience teaching at an in person bootcamp.
• Payload CMS: We chat with Dan Ribbens about Payload CMS a self-hosted, headless JavaScript CMS.

Frequently Asked Questions (FAQ)

What are the main takeaways from Using CSS in JS with Stitches?

We sit down with Pedro Duarte to talk all about using CSS in JavaScript and why Modulz created Stitches. Using CSS in JS with Stitches: https://codingcat.dev/podcast/1-29-using-css-in-js-with-stitches Throughout this podcast, Pedro Duarte breaks down real-world implementation details for CSS, JavaScript so developers can apply these patterns directly in production.

How do you implement CSS best practices in production?

When adopting CSS and JavaScript in a production stack, start by validating your configuration against theMDN CSS Reference(Modern layout, Grid, Flexbox, animations, and cascade layers). 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 Using CSS in JS with Stitches walkthrough and find related code resources?

You can watch the complete video session forUsing CSS in JS with Stitcheson theCodingCat.dev YouTube channel.For a deeper dive into CSS, check out our related guide:Creating a Better Vue with Nuxt.