Why I’m Building an Open-Source Frontend Engineering Handbook

A developer is building an open-source Frontend Engineering Handbook to address the gap between framework tutorials and real-world engineering challenges. The project covers architecture, state management, AI-assisted development, and other topics often scattered across resources. The developer aims to create a practical guide for production frontend engineering, including AI-friendly practices.

Every frontend developer eventually reaches the same point. You know React. You know TypeScript. You know how to build components. But then you join a real project. Suddenly the questions are no longer about writing a component — they’re about engineering. How should the project be structured? Where should authentication logic live? When is React Context enough? When should React Query own the data? How do you prevent a codebase from becoming impossible to maintain? What makes a frontend application scalable? How do AI coding tools fit into modern development? These are the questions I kept asking myself while working on frontend applications. The problem wasn’t the lack of information. The problem was that the information was scattered across hundreds of blog posts, GitHub repositories, conference talks, documentation pages, and personal notes. Tutorials Teach Frameworks Modern tutorials are excellent at teaching frameworks. You can easily learn: React Vue Angular Next.js TypeScript But very few resources explain what happens after that. How do experienced teams actually build production frontend applications? How do they organize folders? How do they write maintainable code? How do they review pull requests? How do they optimize performance? How do they scale applications from one developer to twenty? Those are engineering problems — not framework problems. Frontend Engineering Is a Different Skill Writing React code doesn’t automatically make someone a frontend engineer. Frontend engineering includes topics such as: Project architecture Feature-based organization Authentication and authorization API design State management Data fetching strategies Performance optimization Accessibility Error handling Testing CI/CD Monitoring Code quality Documentation Team conventions These subjects rarely live in one place. AI Has Changed the Way We Build Software Another reason I started this project is the rise of AI coding assistants. Learn about Medium’s values Today many developers use tools like Claude Code, Codex, Cursor, GitHub Copilot, and others. These tools can generate code remarkably well. But they work best when a project has: a clear architecture, consistent conventions, meaningful documentation, predictable folder structures, and explicit engineering standards. In other words, AI benefits from good engineering just as much as humans do. That’s why I also want this handbook to cover AI-friendly development practices alongside traditional frontend engineering. What I’m Building I’m building an open-source repository that aims to become a practical handbook for modern frontend engineering. Instead of being another collection of links, the goal is to explain why certain engineering decisions are made and when different approaches make sense. Some of the planned topics include: Frontend Architecture React & TypeScript State Management Authentication React Query API Patterns Performance Accessibility Testing Deployment AI-assisted Development Project Documentation Engineering Best Practices Production Checklists The repository is still in its early stages, but it will continue to grow over time. Why Open Source? Because engineering knowledge improves through discussion. Every experienced frontend developer has learned lessons that aren’t written in official documentation. Some learned them after debugging production outages. Some after rewriting an application. Some after reviewing thousands of pull requests. I hope this repository becomes a place where those lessons can be collected and shared. I’d Love Your Ideas If you’ve spent time building frontend applications, I’m interested in hearing: What engineering topic do you think deserves more attention? What lessons did you learn the hard way? What do most frontend tutorials completely ignore? Those ideas can help shape this handbook into something genuinely useful for the community. Repository GitHub https://github.com/ualiyou/frontend-engineering https://github.com/ualiyou/frontend-engineering If you find the project useful, consider starring the repository or contributing ideas. The goal is simple: create a practical reference for frontend engineers that keeps improving over time.