Update Nuxt Generator doc

create-client/index.md

@@ -10,7 +10,7 @@ and native mobile apps from APIs supporting the [Hydra](http://www.hydra-cg.com/
 It is able to generate apps using the following frontend stacks:
 
 - [Next.js](nextjs.md)
-- [Nuxt.js](nuxtjs.md)
+- [Nuxt](nuxt.md)
 - [Quasar](quasar.md)
 - [Vuetify](vuetify.md)
 - [React](react.md)

create-client/nuxt.md

@@ -0,0 +1,102 @@
+# Nuxt Generator
+
+Bootstrap a [Nuxt 3](https://nuxt.com/) application:
+
+```console
+npx nuxi init my-app
+cd my-app
+```
+
+Install the required dependencies:
+
+```console
+yarn add dayjs @pinia/nuxt qs @types/qs
+```
+
+To generate the code you need for a given resource, run the following command:
+
+```console
+yarn create @api-platform/client https://demo.api-platform.com . --generator nuxt --resource foo
+```
+
+Replace the URL with the entrypoint of your Hydra-enabled API. You can also use an OpenAPI documentation with `https://demo.api-platform.com/docs.json` and `-f openapi3`.
+
+Omit the resource flag to generate files for all resource types exposed by the API.
+
+Add Pinia module in `nuxt.config.ts`:
+
+```typescript
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  // ...
+  modules: ["@pinia/nuxt"],
+  // ...
+});
+```
+
+Delete `app.vue` as it will prevent Nuxt router to work correctly.
+
+Optionally, install Tailwind to get an app that looks good:
+
+```console
+yarn add -D tailwindcss postcss autoprefixer
+yarn tailwindcss init -p
+```
+
+Add this code in `nuxt.config.ts`:
+
+```typescript
+// https://nuxt.com/docs/api/configuration/nuxt-config
+export default defineNuxtConfig({
+  // ...
+  css: ['~/assets/css/main.css'],
+  postcss: {
+    plugins: {
+      tailwindcss: {},
+      autoprefixer: {},
+    },
+  },
+  // ...
+});
+```
+
+And this code in `tailwind.config.js`:
+
+```javascript
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+  content: [
+    "./components/**/*.{js,vue,ts}",
+    "./layouts/**/*.vue",
+    "./pages/**/*.vue",
+    "./plugins/**/*.{js,ts}",
+    "./nuxt.config.{js,ts}",
+    "./app.vue",
+  ],
+  theme: {
+    extend: {},
+  },
+  plugins: [],
+}
+```
+
+Create the file `assets/css/main.css` and add this code in it:
+
+```css
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
+```
+
+You can launch the server with:
+
+```console
+yarn dev -o
+````
+
+Go to `https://localhost:3000/books/` to start using your app.
+
+## Screenshots
+
+![List](images/nuxt/create-client-nuxt-list.png)
+![Edit](images/nuxt/create-client-nuxt-edit.png)

distribution/index.md

@@ -20,7 +20,7 @@ The easiest and most powerful way to get started is [to download the API Platfor
 
 * the API skeleton, including [the Core library](../core/index.md), [the Symfony framework](https://symfony.com/) ([optional](../core/bootstrap.md)) and [the Doctrine ORM](https://www.doctrine-project.org/projects/orm.html) ([optional](../core/extending.md))
 * [the client scaffolding tool](../create-client/) to generate [Next.js](../create-client/
-) web applications from the API documentation ([Nuxt.js](https://nuxtjs.org/), [Vue](https://vuejs.org/), [Create React App](https://reactjs.org), [React Native](https://facebook.github.io/react-native/), [Quasar](https://quasar.dev/) and [Vuetify](https://vuetifyjs.com/) are also supported)
+) web applications from the API documentation ([Nuxt](https://nuxt.com/), [Vue](https://vuejs.org/), [Create React App](https://reactjs.org), [React Native](https://facebook.github.io/react-native/), [Quasar](https://quasar.dev/) and [Vuetify](https://vuetifyjs.com/) are also supported)
 * [a beautiful admin interface](../admin/), built on top of React Admin, dynamically created by parsing the API documentation
 * all you need to [create real-time and async APIs using the Mercure protocol](../core/mercure.md)
 * a [Docker](../deployment/docker-compose.md) definition to start a working development environment in a single command, providing containers for the API and the Next.js web application

outline.yaml

@@ -82,7 +82,7 @@ chapters:
     items:
       - index
       - nextjs
-      - nuxtjs
+      - nuxt
       - vuetify
       - quasar
       - react