I've learned the fundamentals of Node.js and Express, including authentication, connecting a database, and building a small full-stack app with server-rendered EJS pages. For my next project, I want to keep using Node and Express for the backend but build the frontend with React. I already designed the UI in Figma and planned the site's functionality, but I'm unsure how to organize the work. Should I build all the React pages first and then create the backend, or develop both sides together? I also don't understand the best way to connect a React frontend to an Express backend. Any practical advice or recommended resources would be appreciated.
2 Answers
Treat Express as an API server when using React. Create routes that return JSON rather than rendered HTML, for example endpoints for fetching records, signing in, or creating new data. In React, start by using the browser’s built-in fetch function—often inside a useEffect hook for loading data—to call those endpoints and update component state with the response. As the application grows, a data-fetching library such as React Query can make caching, loading states, and errors easier to manage.
Build the app incrementally with one complete feature at a time. Instead of finishing every React page before touching the backend, choose something small—such as logging in or creating a post—and implement the entire flow: the React interface, the Express API route, the database operation, and the response shown in the UI. Once that works, repeat the process for the next feature. It keeps the project manageable and exposes integration problems early.
That approach makes sense, but I’m still unsure how the React side fits into the first feature since I haven’t used React with an API before.
Thanks, that gives me a clear starting point: build a small React screen, create the matching Express JSON endpoint, and connect them with fetch before moving on.