Skip to content

Commit 006cd52

Browse files
committed
feat: update view:install and g:template docs
1 parent f5d3bac commit 006cd52

File tree

1 file changed

+26
-29
lines changed

1 file changed

+26
-29
lines changed

src/docs/frontend/inertia.md

Lines changed: 26 additions & 29 deletions
Original file line numberDiff line numberDiff line change
@@ -6,48 +6,28 @@ In short, Inertia let's you use your favourite frontend framework together with
66

77
## Setting Up
88

9-
We've simplified the whole setup process into one command for you. Whether you are using Leaf MVC or just Leaf, you can use the CLI to scaffold a basic UI integration using your preferred frontend tooling.
9+
We've simplified the whole setup process into one command for you. Whether you are using Leaf MVC or just Leaf, you can use the CLI to scaffold a basic UI integration using your preferred frontend tooling. Simply run the `view:install` command with the name of the frontend framework you want to use.
1010

1111
To get started, you can run:
1212

1313
::: code-group
1414

1515
```bash:no-line-numbers [Leaf MVC CLI]
16-
php leaf view:install
17-
```
18-
19-
```bash:no-line-numbers [Leaf CLI]
20-
leaf view:install
21-
```
22-
23-
:::
24-
25-
This will prompt you to select your preferred frontend framework. You can choose from Vue, React, and Svelte. There is also support for styling with Tailwind/Bootstrap. After selecting your preferred framework, Leaf will automatically install and setup inertia for you, including examples for you to get started with.
26-
27-
::: tip view:install
28-
29-
If you know the specific frontend framework you want to use, you can pass the `--{framework}` flag to the `view:install` command. For example, to install inertia for Vue, you can run:
30-
31-
```bash:no-line-numbers
3216
php leaf view:install --vue
33-
```
34-
35-
:::
36-
37-
You can then start your server which will automatically start both your Leaf server and your frontend server:
38-
39-
::: code-group
40-
41-
```bash:no-line-numbers [Leaf MVC CLI]
42-
php leaf serve
17+
php leaf view:install --react
18+
php leaf view:install --svelte
4319
```
4420

4521
```bash:no-line-numbers [Leaf CLI]
46-
leaf serve
22+
leaf view:install --vue
23+
leaf view:install --react
24+
leaf view:install --svelte
4725
```
4826

4927
:::
5028

29+
This will automatically set up everything you need to get started with Inertia and your preferred frontend framework. You can then start your development server and start building your app.
30+
5131
## Setting up your routes
5232

5333
Adding Inertia to your Leaf app doesn't change the way you handle routing, it just replaces your PHP views with your frontend framework. This means you are still going to use Leaf's routing system to handle your routes:
@@ -101,7 +81,7 @@ export default function Home({ name }) {
10181
}
10282
```
10383

104-
```jsx [Home.vue]
84+
```vue [Home.vue]
10585
<script setup>
10686
import Layout from './Layout';
10787
import { Head } from '@inertiajs/vue3';
@@ -138,6 +118,23 @@ defineProps({ name: String });
138118

139119
You can find more information on using Inertia with your frontend framework in the [Inertia documentation](https://inertiajs.com/).
140120

121+
## Generating Inertia Views
122+
123+
Leaf MVC makes your life easier by providing a command to generate views for you. You can use the `g:template` command to generate a new Inertia view:
124+
125+
```bash:no-line-numbers
126+
php leaf g:template Home --jsx # React
127+
php leaf g:template Home --vue # Vue
128+
php leaf g:template Home --svelte # Svelte
129+
php leaf g:template home # Blade
130+
```
131+
132+
You can also specify the directory where you want the view to be generated:
133+
134+
```bash:no-line-numbers
135+
php leaf g:template Home --jsx --dir=components
136+
```
137+
141138
## Manually setting up inertia
142139

143140
If you don't want to use the Leaf CLI, you can manually setup inertia. This guide will show you how to setup inertia with Vite and React. You can use this guide to setup inertia with any frontend framework.

0 commit comments

Comments
 (0)