概览
NextRanger 是我在处理严肃前端工作时所使用的起点。其前提是：团队认同却无法强制执行的约定终将逐渐失效，因此每一条重要规则都以 lint 规则、类型定义或失败测试的形式表达，而不是写在 README 中的一段文字。
架构
默认使用 Server Components 的 Next.js App Router、严格模式的 TypeScript，以及具有单向依赖关系的模块优先结构：路由依赖模块，模块依赖共享代码，共享代码依赖第三方封装层，且方向永不逆转。每个第三方依赖包都恰好拥有一个负责的封装层，使升级与错误处理都集中在一个经过审查的文件中。
工程实践
一个自定义 ESLint 插件负责强制执行分层策略、包所有权规则、仅限 TSX 的组件写法，以及翻译覆盖率要求。Vitest 与 Playwright 覆盖了单元测试、集成测试、端到端测试、无障碍测试与可视化测试，并配备支持从右到左排版的国际化能力、基于 nonce 的 CSP 策略，以及在任何合并前运行完整测试集的 CI 关卡。
- 角色
- 作者。设计了架构模型、自定义 ESLint 规则集与质量关卡。
- 类别
- 全栈
- 技术栈
- Next.jsReactTypeScriptESLintVitestPlaywrightTailwind CSS
- 编程语言
- TypeScript