Skip to content

Improve README description #599

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open

Improve README description #599

Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 27 additions & 4 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,12 +35,35 @@

### Quick Start

If you want to start a new React project from scratch then we recommend [Create React App](https://github.com/facebook/create-react-app), but `@pixi/react` should work with any React application (Remix, Next.js, etc).
To add `@pixi/react` to an existing React application, just install the dependencies:
**If you want to start a new React project from scratch, we recommend one of the following options:**

1. **Use the official [CLI tool to create PixiJS](https://pixijs.io/create-pixi/) projects, and choose the React
template:**

Select the React template from Framework Templates:

```bash
? Select a type of template: › - Use arrow-keys. Return to submit.
Bundler Templates
❯ Framework Templates
Creation Templates
Extension

✔ Select a type of template: › Framework Templates
? Select a variant: › - Use arrow-keys. Return to submit.
❯ React
```

**This will create a new React + Vite project, with Pixi.js and `@pixi/react` already preconfigured!**

2. **Manual React + Vite setup:**

You can also install [React + Vite](https://vite.dev/guide/), or use any other React-based framework (e.g. Remix,
Next.js, etc).
To add `@pixi/react` to an existing React project, simply install the required dependencies:
Comment on lines +38 to +63
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

PixiJs Create actually provides the --template flag which can greatly simplify these instructions:

Suggested change
**If you want to start a new React project from scratch, we recommend one of the following options:**
1. **Use the official [CLI tool to create PixiJS](https://pixijs.io/create-pixi/) projects, and choose the React
template:**
Select the React template from Framework Templates:
```bash
? Select a type of template: › - Use arrow-keys. Return to submit.
Bundler Templates
❯ Framework Templates
Creation Templates
Extension
✔ Select a type of template: › Framework Templates
? Select a variant: › - Use arrow-keys. Return to submit.
❯ React
```
**This will create a new React + Vite project, with Pixi.js and `@pixi/react` already preconfigured!**
2. **Manual React + Vite setup:**
You can also install [React + Vite](https://vite.dev/guide/), or use any other React-based framework (e.g. Remix,
Next.js, etc).
To add `@pixi/react` to an existing React project, simply install the required dependencies:
If you want to start a new React project from scratch, we recommend using [PixiJS Create](https://pixijs.io/create-pixi/) with the PixiJS React template:
```bash
npm create pixi.js@latest pixi-project -- --template framework-react
```
If you prefer to setup your project manually, or you're installing in an existing project, PixiJS React can be installed via your package manager:


#### Install Dependencies
```bash
npm install pixi.js@^8.2.6 @pixi/react
npm install pixi.js @pixi/react
```

#### Pixie React Usage
Expand Down