From 6b5e8d74f8c88af75ef6017b161e5fd006726749 Mon Sep 17 00:00:00 2001 From: Bharat Kashyap Date: Thu, 9 Jan 2025 10:04:07 -0800 Subject: [PATCH] [docs] Improve example README files (#4580) Signed-off-by: Jan Potoms <2109932+Janpot@users.noreply.github.com> Co-authored-by: Jan Potoms <2109932+Janpot@users.noreply.github.com> --- examples/core/auth-nextjs-email/README.md | 2 ++ .../auth-nextjs-pages-nextauth-4/README.md | 2 ++ examples/core/auth-nextjs-pages/README.md | 2 ++ examples/core/auth-nextjs-passkey/README.md | 2 ++ examples/core/auth-nextjs-themed/README.md | 2 ++ examples/core/auth-nextjs/README.md | 2 ++ examples/core/auth-vite/README.md | 10 ++++++ examples/core/firebase-vite/README.md | 23 ++++++++++++ examples/core/tutorial/README.md | 35 +++++++++++++++++++ examples/core/vite/README.md | 12 +++++++ 10 files changed, 92 insertions(+) create mode 100644 examples/core/tutorial/README.md diff --git a/examples/core/auth-nextjs-email/README.md b/examples/core/auth-nextjs-email/README.md index da6cc6f9471..ef8a4f3cdce 100644 --- a/examples/core/auth-nextjs-email/README.md +++ b/examples/core/auth-nextjs-email/README.md @@ -50,6 +50,8 @@ To copy this example and customize it for your needs, run ```bash npx create-toolpad-app@latest --example auth-nextjs-email +# or +pnpm dlx create-toolpad-app@latest --example auth-nextjs-email ``` and follow the instructions in the terminal. diff --git a/examples/core/auth-nextjs-pages-nextauth-4/README.md b/examples/core/auth-nextjs-pages-nextauth-4/README.md index 80d024ea5dd..04efdfad123 100644 --- a/examples/core/auth-nextjs-pages-nextauth-4/README.md +++ b/examples/core/auth-nextjs-pages-nextauth-4/README.md @@ -24,6 +24,8 @@ To copy this example and customize it for your needs, run ```bash npx create-toolpad-app@latest --example auth-nextjs-pages-nextauth-4 +# or +pnpm dlx create-toolpad-app@latest --example auth-nextjs-pages-nextauth-4 ``` and follow the instructions in the terminal. diff --git a/examples/core/auth-nextjs-pages/README.md b/examples/core/auth-nextjs-pages/README.md index 002b2e45075..65b93a7ad4f 100644 --- a/examples/core/auth-nextjs-pages/README.md +++ b/examples/core/auth-nextjs-pages/README.md @@ -46,6 +46,8 @@ To copy this example and customize it for your needs, run ```bash npx create-toolpad-app@latest --example auth-nextjs-pages +# or +pnpm dlx create-toolpad-app@latest --example auth-nextjs-pages ``` and follow the instructions in the terminal. diff --git a/examples/core/auth-nextjs-passkey/README.md b/examples/core/auth-nextjs-passkey/README.md index 7bf46b3ea61..65a8272086c 100644 --- a/examples/core/auth-nextjs-passkey/README.md +++ b/examples/core/auth-nextjs-passkey/README.md @@ -40,6 +40,8 @@ To copy this example and customize it for your needs, run ```bash npx create-toolpad-app@latest --example auth-nextjs-passkey +# or +pnpm dlx create-toolpad-app@latest --example auth-nextjs-passkey ``` and follow the instructions in the terminal. diff --git a/examples/core/auth-nextjs-themed/README.md b/examples/core/auth-nextjs-themed/README.md index cb926fe14dc..9c9b9a314ee 100644 --- a/examples/core/auth-nextjs-themed/README.md +++ b/examples/core/auth-nextjs-themed/README.md @@ -24,6 +24,8 @@ To copy this example and customize it for your needs, run ```bash npx create-toolpad-app@latest --example auth-nextjs-themed +# or +pnpm dlx create-toolpad-app@latest --example auth-nextjs-themed ``` and follow the instructions in the terminal. diff --git a/examples/core/auth-nextjs/README.md b/examples/core/auth-nextjs/README.md index dc87ac7fecd..71b291d1002 100644 --- a/examples/core/auth-nextjs/README.md +++ b/examples/core/auth-nextjs/README.md @@ -34,6 +34,8 @@ GITHUB_CLIENT_SECRET= ```bash npx auth secret +# or +pnpm dlx create-toolpad-app@latest --example auth-nextjs ``` ### GitHub configuration diff --git a/examples/core/auth-vite/README.md b/examples/core/auth-vite/README.md index f84b2a951b3..a86ab692ed2 100644 --- a/examples/core/auth-vite/README.md +++ b/examples/core/auth-vite/README.md @@ -2,6 +2,16 @@ This template provides a minimal setup to get React working in Vite with HMR. +## Clone using `create-toolpad-app` + +To copy this example and customize it for your needs, run + +```bash +npx create-toolpad-app@latest --example auth-vite +# or +pnpm dlx create-toolpad-app@latest --example auth-vite +``` + Currently, two official plugins are available: - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh diff --git a/examples/core/firebase-vite/README.md b/examples/core/firebase-vite/README.md index 49e6fa69d16..1af1339ef97 100644 --- a/examples/core/firebase-vite/README.md +++ b/examples/core/firebase-vite/README.md @@ -2,6 +2,29 @@ This template provides a minimal setup to get React working in Vite with HMR, and authentication with Firebase. +## Setting up + +The project requires a `.env` with the following variables: + +```bash +VITE_FIREBASE_API_KEY= +VITE_FIREBASE_AUTH_DOMAIN= +VITE_FIREBASE_PROJECT_ID= +VITE_FIREBASE_STORAGE_BUCKET= +VITE_FIREBASE_MESSAGE_SENDER_ID= +VITE_FIREBASE_APP_ID= +``` + +## Clone using `create-toolpad-app` + +To copy this example and customize it for your needs, run + +```bash +npx create-toolpad-app@latest --example firebase-vite +# or +pnpm dlx create-toolpad-app@latest --example firebase-vite +``` + Currently, two official plugins are available: - [@vitejs/plugin-react](https://github.com/vitejs/vite-plugin-react/blob/main/packages/plugin-react/README.md) uses [Babel](https://babeljs.io/) for Fast Refresh diff --git a/examples/core/tutorial/README.md b/examples/core/tutorial/README.md new file mode 100644 index 00000000000..47c0fedd221 --- /dev/null +++ b/examples/core/tutorial/README.md @@ -0,0 +1,35 @@ +# Toolpad Core - Tutorial + +This example provides a minimal setup to get Toolpad Core working with the Next.js App Router. + +## Getting Started + +First, run the development server: + +```bash +npm run dev +# or +yarn dev +# or +pnpm dev +# or +bun dev +``` + +Open [http://localhost:5173](http://localhost:5173) with your browser to see the result. + +## Clone using `create-toolpad-app` + +To copy this example and customize it for your needs, run + +```bash +npx create-toolpad-app@latest --example tutorial +# or +pnpm dlx create-toolpad-app@latest --example tutorial +``` + +and follow the instructions in the terminal. + +## The source + +[Check out the source code](https://github.com/mui/toolpad/tree/master/examples/core/tutorial/) diff --git a/examples/core/vite/README.md b/examples/core/vite/README.md index 1ef91e1e4f0..32a31ab198a 100644 --- a/examples/core/vite/README.md +++ b/examples/core/vite/README.md @@ -18,6 +18,18 @@ bun dev Open [http://localhost:5173](http://localhost:5173) with your browser to see the result. +## Clone using `create-toolpad-app` + +To copy this example and customize it for your needs, run + +```bash +npx create-toolpad-app@latest --example vite +# or +pnpm dlx create-toolpad-app@latest --example vite +``` + +and follow the instructions in the terminal. + ## The source [Check out the source code](https://github.com/mui/toolpad/tree/master/examples/core/vite/)