> Canonical URL: https://codingcat.dev/topic/architecture

# Architecture Courses, Podcasts & Blog Posts | CodingCat.dev

🛡️ DevOps & Architecture Hub

# Architecture.

Distributed Systems, Trade-Off Matrices & Visual Architecture Diagrams

Explore CodingCat.dev hands-on courses, video lessons, podcast episodes, and technical deep-dive blog posts covering Architecture: Distributed Systems, Trade-Off Matrices & Visual Architecture Diagrams.

[Search All Architecture Content](/search?q=Architecture)![Architecture official logo](/logos/tags/architecture-lockup-light.svg)![Architecture official logo](/logos/tags/architecture-lockup-dark.svg)Official Architecture Brand Lockup (95 Blog Posts · 3 Episodes)✏️ Architecture Production Architecture Diagram✓ Good PatternVISUAL DIAGRAM[Diagram Walkthrough]How Architecture fits into a modern, type-safe full-stack production architecture on CodingCat.dev.AAA Contrast Verified

## Architecture Courses.

[All Courses→](/courses)[![The Odin Project 8: Backend APIs (Hono vs. Express), Auth & Getting Hired](https://cdn.sanity.io/images/hfh83o0w/production/0f323960dbbd1ad5c7c96a7be3e70a27c3b628ca-1376x768.png?w=1376&q=82&fit=max&auto=format)](/course/odin-nodejs-backend-and-getting-hired)November 4, 2026[![](/logos/tags/hono-symbol-light.svg)![](/logos/tags/hono-symbol-dark.svg)Hono](/topic/hono)[![](/logos/tags/nodejs-symbol-light.svg)![](/logos/tags/nodejs-symbol-dark.svg)Node.js](/topic/nodejs)

### [The Odin Project 8: Backend APIs (Hono vs. Express), Auth & Getting Hired](/course/odin-nodejs-backend-and-getting-hired)

Build end-to-end typed backend APIs with Hono RPC and Zod, implement secure HTTP-only session cookies and OAuth, and master the 2026 engineering portfolio & system design interview.

[![The Odin Project 6: Modern React 19, State Architecture & TypeScript](https://cdn.sanity.io/images/hfh83o0w/production/638109d3eb8a895902f71dbb25851fa9c1ddbc69-1376x768.png?w=1376&q=82&fit=max&auto=format)](/course/odin-modern-react-and-typescript)November 4, 2026[![](/logos/tags/astro-symbol-light.svg)![](/logos/tags/astro-symbol-dark.svg)Astro](/topic/astro)[![](/logos/tags/react-symbol-light.svg)![](/logos/tags/react-symbol-dark.svg)React](/topic/react)

### [The Odin Project 6: Modern React 19, State Architecture & TypeScript](/course/odin-modern-react-and-typescript)

Master React 19 components, strict TypeScript props, derived state vs. useEffect traps, Server Actions, and island hydration in Astro.

[![The Odin Project 3: Intermediate HTML, Modern Forms & CSS Grid Architecture](https://cdn.sanity.io/images/hfh83o0w/production/7c9064f71f2104b855c2c5cbdc387a70c416c135-1376x768.png?w=1376&q=82&fit=max&auto=format)](/course/odin-intermediate-html-and-css-grid)November 4, 2026[![](/logos/tags/html-symbol-light.svg)![](/logos/tags/html-symbol-dark.svg)HTML](/topic/html)[![](/logos/tags/css-symbol-light.svg)![](/logos/tags/css-symbol-dark.svg)CSS](/topic/css)

### [The Odin Project 3: Intermediate HTML, Modern Forms & CSS Grid Architecture](/course/odin-intermediate-html-and-css-grid)

Master 2D CSS Grid layouts, Subgrid, CSS Custom Properties, fluid clamp() typography, container queries, and zero-JS form validation with :user-valid.

## Architecture Blog Posts.

Showing 8 of 95 blog postsFiltered: Architecture[Open Full Topic Hub →](/topic/architecture)[![Dockerless Serverless GPUs: How I Built a Fast, Cheap AI SaaS with RunPod Flash](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/78383c8986667bc1eaa504786488d88f212929a8-1280x720.jpg?w=1280&q=82&fit=max&auto=format)](/post/dockerless-serverless-gpus-fast-cheap-ai-saas-with-runpod-flash)October 6, 2026[![](/logos/tags/ai-symbol-light.svg)![](/logos/tags/ai-symbol-dark.svg)AI & Agents](/topic/ai)[![](/logos/tags/docker-symbol-light.svg)![](/logos/tags/docker-symbol-dark.svg)Docker](/topic/docker)

### [Dockerless Serverless GPUs: How I Built a Fast, Cheap AI SaaS with RunPod Flash](/post/dockerless-serverless-gpus-fast-cheap-ai-saas-with-runpod-flash)

Hosted image APIs cost 3 to 4 cents per generation. Using RunPod Flash for dockerless serverless GPUs, FlashFun.dev drops that to a fraction of a cent, turning $1 into 500 to 3,000 images. Here is the full architecture, the benchmarks, and the code.

[![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)[![The Firebase plugin is now available in Codex: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/4e2c8e99f437cb576972d406ec32394a82a19480-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-09-firebase-plugin-for-codex)September 29, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [The Firebase plugin is now available in Codex: Web Architecture & Implementation Guide](/post/firebase-2026-09-firebase-plugin-for-codex)

Alex Patterson's hands-on web engineering breakdown of "The Firebase plugin is now available in Codex" (2026-09-28). Learn how to wire up Firebase, Google Cloud, Web Dev, AI in production web apps.

[![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)[![Alex Patterson and AJ the Cat presenting the Dual-Plane Agent-Ready Web Stack with WebMCP and Streamable HTTP MCP](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/dd8b89a42ee37457891b58d39c6273a31ac013e4-1376x768.jpg?w=1376&q=82&fit=max&auto=format)](/post/agent-ready-web-architecture-webmcp-streamable-mcp-llms-txt)September 22, 2026[![](/logos/tags/cloudflare-symbol-light.svg)![](/logos/tags/cloudflare-symbol-dark.svg)Cloudflare](/topic/cloudflare)[![](/logos/tags/html-symbol-light.svg)![](/logos/tags/html-symbol-dark.svg)HTML](/topic/html)

### [Architecting the Agent-Ready Web: Combining Client-Side WebMCP, Streamable HTTP MCP, and RFC 9727 Discovery](/post/agent-ready-web-architecture-webmcp-streamable-mcp-llms-txt)

A complete walkthrough of CodingCat.dev's dual-plane Agent-Ready Web Architecture: pairing client-side W3C WebMCP tools (document.modelContext and declarative HTML forms) with edge Streamable HTTP MCP endpoints, RFC 9727 API catalogs, and Markdown content negotiation.

[![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)[![Introducing Firebase spend caps: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/392bc87dfef2dc84500e0b62caba8202d9b4d8f2-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-09-firebase-spend-caps)September 15, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [Introducing Firebase spend caps: Web Architecture & Implementation Guide](/post/firebase-2026-09-firebase-spend-caps)

Alex Patterson's hands-on web engineering breakdown of "Introducing Firebase spend caps" (2026-09-14). Learn how to wire up Firebase, Google Cloud, Web Dev, AI in production web apps.

[![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)[![5 ways to use Gemini text-to-speech (TTS) in your apps with Firebase AI Logic: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/d5d0edc486ad017758c6960fc08167782dffce04-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-09-ai-logic-text-to-speech)September 10, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [5 ways to use Gemini text-to-speech (TTS) in your apps with Firebase AI Logic: Web Architecture & Implementation Guide](/post/firebase-2026-09-ai-logic-text-to-speech)

Alex Patterson's hands-on web engineering breakdown of "5 ways to use Gemini text-to-speech (TTS) in your apps with Firebase AI Logic" (2026-09-09). Learn how to wire up Firebase, Google Cloud, Web Dev, AI in production web apps.

[![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)[![Authentication made easy: Building a secure e-commerce shopping cart with Firebase: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/501fecb50b0a3d09664436db091b57ec1f9aba5f-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-09-secure-shopping-cart-firebase)September 2, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [Authentication made easy: Building a secure e-commerce shopping cart with Firebase: Web Architecture & Implementation Guide](/post/firebase-2026-09-secure-shopping-cart-firebase)

Alex Patterson's hands-on web engineering breakdown of "Authentication made easy: Building a secure e-commerce shopping cart with Firebase" (2026-09-01). Learn how to wire up Firebase, Google Cloud, Web Dev, TypeScript in production web apps.

[![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)[![3 ways to optimize Firebase Remote Config fetch usage: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/3d8872f8acf479880cdb4b66ee720778b166e7b4-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-08-optimize-remote-config-usage)September 1, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [3 ways to optimize Firebase Remote Config fetch usage: Web Architecture & Implementation Guide](/post/firebase-2026-08-optimize-remote-config-usage)

Alex Patterson's hands-on web engineering breakdown of "3 ways to optimize Firebase Remote Config fetch usage" (2026-08-31). Learn how to wire up Firebase, Google Cloud, Web Dev, TypeScript in production web apps.

[![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)[![Eval-driven development: How we build better agent skills for Firebase: Web Architecture & Implementation Guide](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/63dd10fad2de317ce952f2aa991373a31105af3b-1200x630.svg?w=1200&q=82&fit=max&auto=format)](/post/firebase-2026-08-eval-driven-development-agent-skills)August 12, 2026[![](/logos/firebase/firebase-symbol.png)![](/logos/firebase/firebase-symbol.png)Firebase](/topic/firebase)[![](/logos/tags/google-cloud-symbol-light.svg)![](/logos/tags/google-cloud-symbol-dark.svg)Google Cloud](/topic/google-cloud)

### [Eval-driven development: How we build better agent skills for Firebase: Web Architecture & Implementation Guide](/post/firebase-2026-08-eval-driven-development-agent-skills)

Alex Patterson's hands-on web engineering breakdown of "Eval-driven development: How we build better agent skills for Firebase" (2026-08-11). Learn how to wire up Firebase, Google Cloud, Web Dev, AI in production web apps.

[![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)

No matching blog posts found for this filter.

Try clearing the filter above to browse the full feed.

Loading more blog posts...✓ All blog posts loaded

## Architecture Podcast Episodes.

Showing 3 of 3 episodesFiltered: Architecture[Open Full Topic Hub →](/topic/architecture)[![AI for System Design and Architecture Documentation](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/b43bd666d412b682acb84db7ec9971753b1edf24-1920x1080.png?w=1920&q=82&fit=max&auto=format)](/podcast/ai-for-system-design-and-architecture-documentation)July 8, 2024[![](/logos/tags/ai-symbol-light.svg)![](/logos/tags/ai-symbol-dark.svg)AI & Agents](/topic/ai)[![](/logos/tags/design-symbol-light.svg)![](/logos/tags/design-symbol-dark.svg)Design](/topic/design)

### [AI for System Design and Architecture Documentation](/podcast/ai-for-system-design-and-architecture-documentation)

Learn how AI transforms system design and architecture with insights from Multiplayer's CTO. Explore new tools and collaborative features for developers.

[![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)[![Thomas Johnson](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/78e9507c153e7fdc74e1bcf0aaa7babb97c85e1a-720x720.png?w=96&h=96&q=82&fit=max&auto=format)Thomas Johnson](/guest/thomas-johnson)[![Supabase an Open Source Alternative](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/9dd03afc201190ce96f5f04df5d0913cbf45a354-1920x1080.png?w=1920&q=82&fit=max&auto=format)](/podcast/2-3-supabase-an-open-source-alternative)January 19, 2022[![](/logos/tags/supabase-symbol-light.svg)![](/logos/tags/supabase-symbol-dark.svg)Supabase](/topic/supabase)[![](/logos/tags/architecture-symbol-light.svg)![](/logos/tags/architecture-symbol-dark.svg)Architecture](/topic/architecture)

### [Supabase an Open Source Alternative](/podcast/2-3-supabase-an-open-source-alternative)

We sit down with Jon Meyers, developer advocate at Supabase. We talk all about supabase and the architecture features along with a live demo.

[![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)[![Jon Meyers](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/e0d76b2ff5883a51386dd531b898f9944a1cb4be-400x400.jpg?w=96&h=96&q=82&fit=max&auto=format)Jon Meyers](/guest/jon-meyers)[![SocialBee with Ove and Vlad](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/19aff6d7dcef4db7ab33863ac98d3a40714df018-1920x1080.png?w=1920&q=82&fit=max&auto=format)](/podcast/1-7-socialbee-with-ovi-negrean-and-vlad-hosu)January 1, 2021[![](/logos/tags/architecture-symbol-light.svg)![](/logos/tags/architecture-symbol-dark.svg)Architecture](/topic/architecture)

### [SocialBee with Ove and Vlad](/podcast/1-7-socialbee-with-ovi-negrean-and-vlad-hosu)

A discussion with SocialBee founders Ovi Negrean and Vlad Hosu. We talk about the SAAS product SocialBee and how it is used for people to save time posting to socials. The architecture and technology used to create the platform.

[![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)[![Ovi Negrean](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/22f10807fe22f98c285541557036357e8f12455a-450x450.jpg?w=96&h=96&q=82&fit=max&auto=format)Ovi Negrean](/guest/ovi-negrean)[![Vlad Hosu](https://cdn.sanity.io/media-libraries/mlttp0BZbCpV/images/b9761a49dbb70a3d9c35cc65c070fa55ceca434a-450x450.jpg?w=96&h=96&q=82&fit=max&auto=format)Vlad Hosu](/guest/vlad-hosu)

No matching episodes found for this filter.

Try clearing the filter above to browse the full feed.

Loading more episodes...✓ All episodes loaded