Creating a React App

If your app has constraints not well-served by existing frameworks, you prefer to build your own framework, or you just want to learn the basics of a React app, you can .

Full-stack frameworks

These recommended frameworks support all the features you need to deploy and scale your app in production. They have integrated the latest React features and take advantage of React’s architecture.

Next.js (App Router)

is a React framework that takes full advantage of React’s architecture to enable full-stack React apps.

Terminal

npx create-next-app@latest

Next.js is maintained by . You can to any hosting provider that supports Node.js or Docker containers, or to your own server. Next.js also supports which doesn’t require a server.

React Router (v7)

is the most popular routing library for React and can be paired with Vite to create a full-stack React framework. It emphasizes standard Web APIs and has several for various JavaScript runtimes and platforms.

To create a new React Router framework project, run:

Terminal

npx create-react-router@latest

React Router is maintained by .

Expo (for native apps)

is a React framework that lets you create universal Android, iOS, and web apps with truly native UIs. It provides an SDK for that makes the native parts easier to use. To create a new Expo project, run:

Terminal

npx create-expo-app@latest

If you’re new to Expo, check out the .

Expo is maintained by . Building apps with Expo is free, and you can submit them to the Google and Apple app stores without restrictions. Expo additionally provides opt-in paid cloud services.

Other frameworks

There are other up-and-coming frameworks that are working towards our full stack React vision:

: TanStack Start is a full-stack React framework powered by TanStack Router. It provides a full-document SSR, , server functions, bundling, and more using tools like Nitro and Vite.
: Redwood is a full stack React framework with lots of pre-installed packages and configuration that makes it easy to build full-stack web applications.

Profundizar

Which features make up the React team’s full-stack architecture vision?

Next.js’s App Router bundler fully implements the official . This lets you mix build-time, server-only, and interactive components in a single React tree.

For example, you can write a server-only React component as an async function that reads from a database or from a file. Then you can pass data down from it to your interactive components:

Next.js’s App Router also integrates . This lets you specify a loading state (like a skeleton placeholder) for different parts of your user interface directly in your React tree:

Server Components and Suspense are React features rather than Next.js features. However, adopting them at the framework level requires buy-in and non-trivial implementation work. At the moment, the Next.js App Router is the most complete implementation. The React team is working with bundler developers to make these features easier to implement in the next generation of frameworks.

Start From Scratch

If your app has constraints not well-served by existing frameworks, you prefer to build your own framework, or you just want to learn the basics of a React app, there are other options available for starting a React project from scratch.

Starting from scratch gives you more flexibility, but does require that you make choices on which tools to use for routing, data fetching, and other common usage patterns. It’s a lot like building your own framework, instead of using a framework that already exists. The have built-in solutions for these problems.

If you want to build your own solutions, see our guide to for instructions on how to set up a new React project starting with a build tool like , , or .

If you’re a framework author interested in being included on this page, .