diff --git a/docs/developer-docs/getting-started/quickstart/react-quickstart.mdx b/docs/developer-docs/getting-started/quickstart/react-quickstart.mdx index 69ff57bcd1..e5a6249487 100644 --- a/docs/developer-docs/getting-started/quickstart/react-quickstart.mdx +++ b/docs/developer-docs/getting-started/quickstart/react-quickstart.mdx @@ -101,27 +101,19 @@ dfx --version -#### 2. Download the React template. - -Create a new empty directory, then download the [project template](https://github.com/rvanasa/vite-react-motoko/tree/main/src): +#### 2. Create a new project. ``` -mkdir react-project -cd react-project -npx degit jessiemongeon1/vite-react-motoko +dfx new react-project --type motoko --frontend react ``` -This example project uses [Motoko](/docs/current/motoko/main/getting-started/motoko-introduction), React, and TypeScript template to create a simple counter application. - -#### 3. Setup the project using `npm`. +This generates a simple "Hello, [name]!" application that uses [Motoko](/docs/current/motoko/main/getting-started/motoko-introduction), React, and TypeScript. -``` -npm run setup -``` -#### 4. Deploy the project. +#### 3. Deploy the project. ``` +cd react-project dfx deploy --playground ``` @@ -130,3 +122,9 @@ dfx deploy --playground Open the `frontend` URL in a web browser. You'll see the template React frontend interface. *Congratulations, you just created your first internet-native React app!* + +:::info + +You can try other templates. Run `dfx new -h` for more information about the supported backend and frontend options. + +:::