Skip to content

Commit de26824

Browse files
authored
Reorder installation sections and add to readme for consistency (#433)
* Move template up in installation instructions Ported from recent changes in reduxjs/react-redux#1543 * Fix heading levels for accessibility * Don't assume React is used in installation * Add installation to readme
1 parent 84483e6 commit de26824

File tree

2 files changed

+37
-12
lines changed

2 files changed

+37
-12
lines changed

README.md

Lines changed: 27 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -7,11 +7,34 @@
77

88
**The official, opinionated, batteries-included toolset for efficient Redux development**
99

10-
`npm install @reduxjs/toolkit`
11-
1210
(Formerly known as "Redux Starter Kit")
1311

14-
### Purpose
12+
## Installation
13+
14+
### Using Create React App
15+
16+
The recommended way to start new apps with React and Redux Toolkit is by using the [official Redux+JS template](https://github.com/reduxjs/cra-template-redux) for [Create React App](https://github.com/facebook/create-react-app), which takes advantage of React Redux's integration with React components.
17+
18+
```sh
19+
npx create-react-app my-app --template redux
20+
```
21+
22+
### An Existing App
23+
24+
Redux Toolkit is available as a package on NPM for use with a module bundler or in a Node application:
25+
26+
```bash
27+
# NPM
28+
npm install @reduxjs/toolkit
29+
30+
# Yarn
31+
yarn add @reduxjs/toolkit
32+
```
33+
34+
It is also available as a precompiled UMD package that defines a `window.RTK` global variable.
35+
The UMD package can be used as a [`<script>` tag](https://unpkg.com/@reduxjs/toolkit/dist/redux-toolkit.umd.js) directly.
36+
37+
## Purpose
1538

1639
The **Redux Toolkit** package is intended to be the standard way to write Redux logic. It was originally created to help address three common concerns about Redux:
1740

@@ -23,7 +46,7 @@ We can't solve every use case, but in the spirit of [`create-react-app`](https:/
2346

2447
This package is _not_ intended to solve every possible use case for Redux, and is deliberately limited in scope. It does _not_ address concepts like "reusable encapsulated Redux modules", data fetching, folder or file structures, managing entity relationships in the store, and so on.
2548

26-
### What's Included
49+
## What's Included
2750

2851
Redux Toolkit includes:
2952

docs/introduction/quick-start.md

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -35,6 +35,16 @@ Redux Toolkit includes:
3535

3636
## Installation
3737

38+
### Using Create React App
39+
40+
The recommended way to start new apps with React and Redux Toolkit is by using the [official Redux+JS template](https://github.com/reduxjs/cra-template-redux) for [Create React App](https://github.com/facebook/create-react-app), which takes advantage of React Redux's integration with React components.
41+
42+
```sh
43+
npx create-react-app my-app --template redux
44+
```
45+
46+
### An Existing App
47+
3848
Redux Toolkit is available as a package on NPM for use with a module bundler or in a Node application:
3949

4050
```bash
@@ -48,14 +58,6 @@ yarn add @reduxjs/toolkit
4858
It is also available as a precompiled UMD package that defines a `window.RTK` global variable.
4959
The UMD package can be used as a [`<script>` tag](https://unpkg.com/@reduxjs/toolkit/dist/redux-toolkit.umd.js) directly.
5060

51-
## Create a React Redux App
52-
53-
The recommended way to start new apps with React and Redux Toolkit is by using the [official Redux+JS template](https://github.com/reduxjs/cra-template-redux) for [Create React App](https://github.com/facebook/create-react-app), which takes advantage of React Redux's integration with React components.
54-
55-
```sh
56-
npx create-react-app my-app --template redux
57-
```
58-
5961
## Help and Discussion
6062

6163
The **[#redux channel](https://discord.gg/0ZcbPKXt5bZ6au5t)** of the **[Reactiflux Discord community](http://www.reactiflux.com)** is our official resource for all questions related to learning and using Redux. Reactiflux is a great place to hang out, ask questions, and learn - come join us!

0 commit comments

Comments
 (0)