Frontend · Backend · JavaScript

A 9-Day Full-Stack Rebuild with Codex: From Vue 2 to Nuxt 4 and NestJS

By 航栈 · Aug 18, 2026

Read original on juejin.cn ↗ Google Translate ↗ Alt translation

This rebuild demonstrates a practical, disciplined workflow for using AI coding agents on a real production system, not a greenfield demo. The developer's domain expertise in frontend, UI, and infrastructure remained the critical decision-making layer; Codex accelerated execution but did not replace the judgment needed to keep a 36,000-line codebase coherent, secure, and visually consistent.

Summary

Hangzhan, a long-running Chinese developer community site, was migrated from a Vue 2 and ThinkPHP 5 stack to Nuxt 4, NestJS 11, and Prisma. The 36,000-line codebase was refactored feature by feature, with Codex reading the entire project to trace dependencies across pages, composables, controllers, and database models. The developer gave Codex bounded, specific tasks with explicit constraints on what not to change and how to verify completion, rather than open-ended prompts. Data migration scripts handled years of inconsistent historical content, while SSR smoke tests confirmed that search engines would receive complete, correct HTML. The entire core refactoring, from first baseline commit to production configuration, took nine days.

Takeaways

— Codex was directed to read the entire project first and trace dependencies across files before making changes, avoiding the copy-paste bottleneck of chat-based AI tools.

— Tasks were framed as bounded, verifiable units with explicit constraints: what not to change, which existing APIs to preserve, and what checks define completion.

— Data migration scripts handled years of inconsistent historical content by splitting the process into read-clean-preview-import-verify stages, with manual confirmation required before destructive writes.

— SSR smoke tests were added to verify that production-built pages return complete HTML containing real database titles, not just that pages look correct in a browser.

— CSS iteration with Codex required periodic cleanup passes to remove duplicate rules, invalid selectors, and values that should be design variables, preventing style rot from rapid iteration.

— Production deployment rules enforced a hard stop: if type checking, building, or migration fails at any step, the release halts and PM2 is not reloaded.

— A full-stack rebuild of a 151-file, 30-model codebase was completed in nine days by one developer using Codex as an execution partner, not a magic generator.

Conclusions

Codex's project-wide context window changes the task granularity from 'write this function' to 'resolve this feature across the stack,' which shifts the developer's role from code author to system reviewer and product decision-maker.

The developer's existing expertise became more critical with AI assistance, not less. Judging whether an SSR implementation is correct, whether component code is becoming disorganized, or whether a database operation is safe all required deep domain knowledge that Codex cannot supply.

Vague design feedback like 'make it look better' reliably produced generic, trend-chasing UI. Specific, observable critiques about whitespace, visual weight, border density, and typographic hierarchy produced results that matched the site's existing design language.

The most time-saving use of Codex was not component generation but the tedious, error-prone work of data cleaning, migration scripting, and link validation that a human would find draining and likely to miss edge cases in.

Concepts & terms

SSR Smoke Test

An automated test that starts a production-built web server and API, queries real database content, requests key pages, and verifies that the returned HTML contains expected data like article titles, rather than just checking HTTP status codes.

Prisma

A Node.js and TypeScript ORM that generates a type-safe database client from a declarative schema, managing migrations and providing autocompletion for database queries.

Turborepo

A build system for JavaScript/TypeScript monorepos that caches task outputs and parallelizes execution, so only changed packages are rebuilt.

From the discussion

Featured comments

用户7969973280737

Page buttons jump and shake badly when clicked—unacceptable for a frontend dev.

航栈

Ah, I deliberately made that jelly effect [grin]

三里桥大西瓜 → 航栈

Too stiff, no transition.

See top comments, translated →

Source: juejin.cn ↗ Google Translate ↗ Backup ↗