The Minimal React App Setup You Need [2025]

Deciding which tools to use while building a React web application is subjective, but in this post, I will propose a minimum set of tools needed to build a simple React application. This post will help you to build and get the React application up and running in just a few minutes.

1. Vite (For Bundling)

Vite is now the go-to choice for most of the developers while building a React application from scratch. I wrote a detailed article about why is that the case — "Create React App (CRA) is Deprecated, Officially: What's Next?".

Vite will take care of the build process and bundle React in a javascript bundle ready to be deployed. As a matter of fact, Vite provides React templates which you can use to quickly spin-up a Vite/React repository — "Scaffolding Your First Vite Project".

npm create vite@latest my-react-app -- --template react-ts

All of the templates Vite provides - create-vite.

2. React Router (For Routing)

React Router might not be the best solution for routing in React, but it is one of the stable solutions out there. If you want a more modern solution, then there's Tanstack Router from the Tanstack ecosystem which is a great contender for React Router.

Tanstack Router provides in-built type-safety (typescript support) with file based routing approach unlike React Router which has a more declarative component based approach.

3. Shadcn (For UI components)

Shadcn is the modern UI library which has almost every component you need. Not only that, those components are customizable and can be built up on. It works well with tailwindcss.

Some other notable UI libraries include MUI, Ant Design, Chakra UI, and Mantine.

4. Tanstack Query (For Query State Management)

Tanstack Query is by far the most important and useful tool in modern React applications. API query management is one of the most boilerplate-y tasks while building a React application. I always think about how to manage those API calls, their states, and how they impact the UI. All of that is solved by Tanstack Query (React Query) which is a complete and state-of-the-art solution for query state management.

From maintaining, caching, refetching queries to having dependable and conditional queries, almost every query fetching problem is solved by Tanstack Query.

5. Zustand (For Global State Management)

I really don't like React Context API for top-level state management as it re-renders everything in between (even if it doesn't consume/use the context).

And I don't blame React Context API for that. It is meant to trigger a re-render because we are wrapping the components under a Provider and it assumes that every child will be affected by it. So, the Context is attached to a parent and all of its children. But, true global state doesn't necessarily have to be attached to a React component. It has to be truly global.

In fact, React Redux also uses the React Context API internally to pass store data to deeply nested components, which doesn't make it truly global.

That's where Zustand comes into action. Zustand provides global states which aren't attached to the React Component lifecycle. Another nice perf optimization one can do while using Zustand is using atomic selectors instead of selecting the entire store state at once.

const ReactComponent = () => {
    // ❌ - returns a new object ever single time
    const { inventory, users } = useShopStore();

    // ✅ - atomic values which stay the same if unchanged
    const inventory = useShopStore(state => state.inventory);
    const users = useShopStore(state => state.users);

    // ...
}

Thoughts

The above list is not exhaustive and it is the bare-minimum set of tools required to build a simple React application. I am not saying that this is the ultimate React setup which should be used for every application. You might not even need global state management for instance, and in that case you are free to skip Zustand. But it's a great start if you quickly want to get things running.