Skip to content

CreateReactAdmin.md

Latest commit

 

History

History
127 lines (89 loc) · 4.7 KB

CreateReactAdmin.md

File metadata and controls

127 lines (89 loc) · 4.7 KB
layout default
title The create-react-admin CLI

create-react-admin

Use create-react-admin to quickly bootstrap a react-admin project using Vite. It's the preferred way to create a new react-admin application.

<iframe src="https://www.youtube-nocookie.com/embed/i_TbS7quzww" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen style="aspect-ratio: 16 / 9;width:100%;margin-bottom:1em;"></iframe>

Usage

npx create-react-admin@latest your-admin-name

This will create an empty react-admin application in a directory called your-admin-name, powered by Vite.js, and install the dependencies.

You can run the app with:

cd your-admin-name
npm run dev

Tip: You can replace npx with npm, yarn or bun:

# Using npx
npx create-react-admin@latest your-admin-name
# Using npm
npm create react-admin@latest your-admin-name
# Using yarn
yarn create react-admin your-admin-name
# Using bun
bun create react-admin@latest your-admin-name

Tip: If you need to pass extra options, depending on the command you choose you may need to add -- before the arguments:

# `npx` doesn't require the `--` before the arguments
npx create-react-admin@latest your-admin-name --interactive
# `npm create` does require the `--` before the arguments
npm create react-admin@latest your-admin-name -- --interactive

Options

The command accepts the following options:

  • --interactive: Enable the CLI interactive mode
  • --data-provider: Set the data provider to use ("data-fakerest", "data-simple-rest", "data-json-server", "supabase" or "none")
  • --auth-provider: Set the auth provider to use ("local-auth-provider" or "none")
  • --resource: Add a resource that will be initialized with guessers (can be used multiple times). Set to "skip" to bypass the interactive resource step.
  • --install: Set the package manager to use for installing dependencies ("yarn", "npm", "bun" or "skip" to bypass the interactive install step)

--interactive

When using this option, the terminal will ask you to choose:

--data-provider

create-react-admin currently supports five presets for the application's data provider:

  • fakerest: A client-side data provider that use a JSON object for data, powered by FakeRest.
  • json-server: A data provider based on the JSON Server API
  • simple-rest: A data provider for simple REST APIs
  • supabase: A data provider for Supabase. The auth-provider and resources steps will be skipped.
  • none (default): To configure the data provider yourself

You can set your data provider directly with the --data-provider option:

npx create-react-admin@latest your-admin-name --data-provider json-server

--auth-provider

create-react-admin currently supports two presets to set the application's auth provider which are:

  • local-auth-provider: Hard coded username/password.
  • none (default): No authProvider.

You can set your auth provider directly with the --auth-provider option:

npx create-react-admin@latest your-admin-name --auth-provider local-auth-provider

--resource

create-react-admin creates an empty app by default. You can initialize CRUD pages for some resources with the --resource option:

npx create-react-admin@latest your-admin-name --resource posts --resource comments

Warning: the --resource flag is incompatible with a --data-provider supabase due to a specific <AdminGuesser> component from ra-supabase.

--install

create-react-admin can install dependencies using any of the following package managers:

  • npm (default)
  • yarn
  • bun
  • pnpm
  • none (if you want to install dependencies yourself)

You choose an alternative package manager with the --install option:

npx create-react-admin@latest your-admin-name --install bun