Skip to content

Guide · Open source

How to use react-static: install the CLI and create a project

Updated · written with AI from the project's own documentation and checked against our catalogue data

React Static is an open-source progressive static site generator for React. It turns React components and your data into plain HTML pages, then runs each page as a React app in the browser. This guide shows how to install the CLI, create a project and find the official docs, and it explains the maintenance status you should weigh before starting anything new.

React Staticreact-static/react-static · ★ 10.3k · MIT

Quick start

  1. 1Confirm the project fits. Check that you are maintaining an existing react-static site or migrating from Create React App. For a new project, the README suggests Remix or Next.js.
  2. 2Install Node.js and npm or yarn. These are the prerequisites listed in the README.
  3. 3Install the CLI. Run npm i -g react-static, or yarn global add react-static.
  4. 4Create a project. Run react-static create and follow the prompts.
  5. 5Check the help output. Run react-static --help to see available commands.
  6. 6Read the docs. Start with the Core Concepts and Configuration pages linked from the README.

Check whether react-static fits your project first

The README says react-static is now in maintenance-only mode and that no new major versions will be released. It recommends Remix or Next.js as alternatives.

It is a reasonable choice mainly for keeping an existing react-static v7 site running, or for moving a Create React App project to a static build setup without ejecting.

  • Good fit: developers who already know React and want a static site
  • Good fit: teams migrating from Create React App
  • Good fit: maintaining an existing react-static v7 site
  • Poor fit: new projects, which the README advises against
  • Poor fit: people without React experience, since the tool assumes React knowledge

Install the react-static CLI with npm or yarn

The README lists Node.js and npm or yarn as prerequisites. Install the CLI globally using whichever package manager you have.

  • npm: run the install command below
  • yarn: use the yarn alternative below
npm i -g react-static # or yarn global add react-static

Create a new project

Once the CLI is installed, the README's quick start uses the create command to start a new project.

react-static create

Get help from the command line

The CLI includes a help flag. Run it to see the commands and options available in your installed version.

react-static --help

Understand how react-static builds pages

React Static gathers your data and templates, splits them into static files using webpack, and exports a list of routes you provide as HTML files. Those HTML files can be served from any static file server.

Each exported page is also a code-split React application. After a page loads, React mounts that app onto the existing HTML, and pages you are likely to visit next are preloaded so navigation feels instant.

  • Pre-rendered HTML supports SEO
  • Client-side navigation runs after the page loads
  • Data can come from anywhere, according to the README

Use react-static as a Create React App replacement

The README describes react-static as a replacement for Create React App that offers a similar zero-config developer experience. You do not need to eject to customise the build. You can use existing plugins or write your own.

React Static also works as a single-page app if there is only one index.html file, so you do not need to build a static site.

Find the official documentation

The README links to the main documentation pages. The repository also notes that the docs shown are for v7, and older versions are available through GitHub branches.

  • Overview: /docs/
  • Core Concepts: /docs/concepts.md
  • Guides: /docs/guides/
  • Configuration: /docs/config.md
  • API: /docs/api.md
  • Plugins: /docs/plugins/
  • Migration notes: /CHANGELOG.md

What people use it for

  • Keeping an existing react-static v7 site online and working
  • Migrating a Create React App project to a static build without ejecting
  • Publishing a content-driven marketing or blog site that needs pre-rendered HTML for SEO
  • Building a single-page React app that uses one index.html file

Frequently asked questions

Is react-static free to use?

Yes. The repository is licensed under MIT. The README does not list any paid tier.

What do I need to install react-static?

The README lists Node.js and npm or yarn as prerequisites. You install the CLI globally with npm i -g react-static or yarn global add react-static.

Is react-static still maintained?

It is in maintenance-only mode. The README says no new major versions will be released, so it only receives maintenance work.

What are the alternatives to react-static?

The README recommends Remix and Next.js. The repository also lists Gatsby and Create React App as comparable projects.

Do I need to know React to use react-static?

Yes. The README says the tool assumes React knowledge, and it is aimed at developers who already know React.

Does react-static help with SEO?

The README says react-static exports pre-rendered HTML pages and lists SEO friendliness as a feature, which suits projects that want HTML for search engines plus client-side navigation.

New agent skills, repos and AI tools — every week

The best new skills and open-source projects, the fastest-growing repos, and one free prompt. Five minutes to read. Unsubscribe anytime.

Our verdict

Use react-static if you already know React and need to keep an existing v7 site running, or move a Create React App project to a static build without ejecting. For a new project, the README points you to Remix or Next.js, and people without React experience should choose a tool that does not assume it.

Install options & downloads