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

Aly

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

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.