Aviron, Microsoft MVP
Build a Fullstack App with Codex
4 hours, 41 minutes
CC
Course Description
Learn reliable agentic workflows for building complex fullstack apps! Plan each feature thoroughly, then delegate implementation to Codex. Build a robust testing process to review changes, trace bugs, and maintain ownership over the code. Build a real-time auction-style application with asynchronous workflows, mock payment processing, and a real-world production stack!
Prerequisite: Familiarity with TypeScript, API development, databases, automated testing, git, and the terminal. Prior Codex experience is helpful but not required.
Preview
Course Details
Published: September 30, 2026
Learn Straight from the Experts Who Shape the Modern Web
Your Path to Senior Developer and Beyond
- 300+ In-depth courses
- 24 Learning Paths
- Industry Leading Experts
- Live Interactive Workshops
Table of Contents
Introduction
Section Duration: 8 minutes
Spencer Schneidenbach begins the course by introducing the auction-style website built throughout the course. The project will solve real-world backend architecture challenges such as competing bids, concurrency, locking, event-driven workflows, auction completion, and real-time page updates. The frontend work will be minimal and mostly used as a measure of success.
Codex Overview
Section Duration: 53 minutes
Spencer spends a few minutes introducing Codex's features. Coding agents like Codex operate as loops that process messages using an LLM. Fundamental features include access to a file system, a command line, and various models. Effort and speed settings balance intelligence and responsiveness; medium effort and fast mode are preferred for workshop speed.
Spencer discusses the different thinking levels in AI coding agents, which balance model effort, usage limits, and the complexity of a task. In his day-to-day work, Spencer prefers high or extra-high thinking levels and typically avoids fast mode to prioritize quality over speed.
Spencer walks through the application's tech stack. The auction site will be a full-stack TypeScript app with a PostgreSQL database and messaging with RabbitMQ. Toward the end of the course, Jaeger will be added for observability.
Spencer discusses the Grill Me custom skill used throughout the course to guide the decisions and features in the application. Each feature will be broken down into vertical slices, allowing the application to be built and verified incrementally.
Spencer demonstrates Codex's Browser Use feature and shares best practices for the Agents.md file. Browser use is a favorite LLM feature for front-end development, enabling automated navigation and interaction with web apps. The agents.md file provides essential project context and constraints to guide the LLM’s coding behavior.
Auctions & Bidding
Section Duration: 46 minutes
Spencer walks through the process of creating the initial auction sites. Each iteration of the application will rely on the constraints in the Agents.md file. These include following strict typing, input validation, and explicit database migrations. Also, running relevant tests after changes, generating visual aids like mermaid diagrams for architectural clarity, and using the browser for UI testing and Playwright for automated browser tests, with visible rather than headless runs.
Spencer runs through the "Grill Me" session for creating the auctions and users. Two rounds of grilling are used during the course for brevity, but in a typical workflow, Spencer recommends grilling until all details are fully understood.
Spencer inspects the database schema, tables, indexes, seed data, API endpoints, Zod validation, migrations, and automated tests before proceeding to the application-level review. Spencer emphasizes the importance of TypeScript checks and real browser-based verification loops for catching issues.
Spencer adds constraints to the bidding system, like users can place bids, but creators cannot bid on their own items. Validation is added to ensure bids meet minimum increments, and the system supports CRUD operations for auctions and bids.
Bid Concurrency
Section Duration: 52 minutes
Spencer explains the concurrency issue with multiple bids arriving at the same time on an auction. Establishing better testing practices will add back pressure on agentic coding tools and help catch and verify these edge cases.
Spencer prompts Codex to create Playwright end-to-end tests to reproduce the concurrency issue. By using Playwright, the developer can also see the issue visually and develop a plan to fix the bug. A "Bidding War" test is created, which tiles four bidding windows on screen.
Spencer works through the grilling plan for fixing the concurrency database problem. Concurrency protection is primarily implemented via row-level locking in Postgres. Other bidding business rules are established to address potential edge cases proactively.
Spencer spends a few minutes explaining row locking in Postgres. This technique locks a specific database row during a transaction, preventing other transactions from editing it simultaneously. In the application, this will ensure requests for the same auction are processed one at a time, avoiding conflicts like duplicate or stale bids.
Spencer works on the auction-close behavior in the application. A visual clock is added to improve testability. Spencer also specifies how auction and bidding workflows should handle time and state transitions, and why backend changes must be validated through the user-facing experience. Additional tips for managing AI context, reviewing generated code, and validating a completed bidding feature from backend to frontend are included in this lesson.
Spencer recommends leveraging other models in a code review process. There are adversarial review methods in which Claude and Codex argue to reach a ground truth, but these are token-intensive and costly. A simpler approach is to kick off a code review using the built-in skill and point it at the last commit or a base branch.
Real-Time UI Updates
Section Duration: 37 minutes
Spencer explains how to replace page-refresh-based bid updates with real-time updates using WebSockets. Redis is introduced as a fast cache and backplane that allows Socket.IO messages to reach users across multiple distributed application instances. Spencer begins implementing this architecture, prompting Codex to design the solution and discussing how WebSockets compare with webhooks for broadcasting events.
Spencer monitors Codex as the real-time user updates are implemented. He reviews the architectural diagram and shares some advice for pausing/resuming/forking conversations in agentic coding tools.
Spencer introduces a minor defect in the codebase to demonstrate additional debugging techniques with Codex.
Winning & Closing
Section Duration: 26 minutes
Spencer designs the closing and checking architecture. A dedicated service polls the database for auctions that have ended but are not closed. Polling is simple but common in real-world systems despite inefficiencies. Once an auction has ended, a workflow to close the auction is triggered.
Spencer introduces RabbitMQ, which is a messaging queue system. It can compose loosely-coupled services and route messages so they can be processed by a consumer. In the auction application, the close worker writes auction close events to an outbox table, and the notification worker asynchronously picks up these messages from RabbitMQ to notify users.
Checkout & Observability
Section Duration: 55 minutes
Spencer discusses how Codex Goals are an effective tool when combined with a ticketing system. The goal skill directs Codex to pursue a broad goal without stopping until it is achieved. It manages tasks by creating a task list and tracking progress. Goals are best used with broad tasks and success criteria rather than prescriptive instructions.
Spencer included a mock Stripe service in the repo for simulating the checkout process. The mock service mimics Stripe behavior, focusing on success and failure scenarios using test card numbers (e.g., 4242 for success). The service is kept simple, avoiding real authentication and shipping or tax calculations.
Spencer demonstrates a GitHub workflow for submitting and reviewing pull requests. Codex needs access to the repo to work in a fully automated state. Spencer emphasizes that passing tests and type checks are not enough and that real browser testing can uncover missing functionality or defects.
Spencer introduces observability and stresses the importance of having insights into application behaviors. Jaeger is added to trace auction lifecycle events: bids, auction close, and payment processing. Traces include spans with metadata such as auction ID, bid ID, and purchase ID. Business outcomes like rejected bids or payment declines are recorded as business events, not errors.
Spencer reviews the Jaeger addition and runs the final tests in the application. With added observability, LLMs can inspect trace data to find problems quickly, provided they use strong safety practices such as business-grade data protections and read-only production access.
Wrapping Up
Section Duration: 1 minute
Spencer wraps up the course with a summary of best-practices for working with agentic coding tools like Codex.
Earn a Completion Certificate
After completing this course, you'll receive a certificate of completion that serves as proof of your achievement, showcasing your expertise, and commitment to professional development. You can easily share this certificate on your LinkedIn profile to highlight your new skills and demonstrate continuous learning to potential employers and professional connections.
