Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
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
20 changes: 10 additions & 10 deletions src/docs/frontend/bareui.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,18 +39,18 @@ composer require leafs/bareui

:::

Once installed, BareUI will be available in your Leaf app on the `bareui()` method. This makes it easy to use BareUI from anywhere in your app.
Once installed, BareUI will be available in your Leaf app on the `template()` method. This makes it easy to use BareUI from anywhere in your app.

```php
app()->bareui()->render('welcome');
```php:no-line-numbers
app()->template()->render('welcome');
```

## Configuring BareUI

BareUI doesn't require any real configuration to work, but you need to tell it where to look for your templates. You can do this using the `config()` method. If you are using Leaf MVC, this has already been done for you in the `config/view.php` file, so you can skip this step.

```php
app()->bareui()->config('path', './views');
```php:no-line-numbers
app()->template()->config('path', './views');
```

This will tell BareUI to look for templates in the `views` directory in your project. Now that BareUI knows where to look for templates, you can start writing your templates.
Expand Down Expand Up @@ -82,8 +82,8 @@ BareUI templates are regular PHP files, so you can create your templates using P

Once you have your template, you can render it using the `render` method. This method takes in the name of the template to render and an array of data to pass to the template.

```php
echo app()->bareui()->render('welcome');
```php:no-line-numbers
echo app()->template()->render('welcome');
```

When rendering a template, you don't need to include the `.view.php` extension in the template name. BareUI automatically adds it for you when it looks for the template file. So, you only need to pass the name of the template without the extension, and BareUI will handle the rest!
Expand Down Expand Up @@ -118,15 +118,15 @@ This is an empty HTML page with a PHP tag that echoes a variable. On its own, th
To pass data to this `$name` variable, you can pass an array of data as the second argument to the `render()` method. This array should contain the same keys as the variables you want to use in the template.

```php
echo app()->bareui()->render('welcome', [
echo app()->template()->render('welcome', [
'name' => 'Something',
]);
```

This will render the template and replace the `$name` variable with the value `'Something'`. You can pass as many variables as you want to the template, and they will all be available in the template file. These values can be anything from strings to arrays, objects, or even functions.

```php [app.php]
echo app()->template->render('products', [
echo app()->template()->render('products', [
'items' => [
['name' => 'Item 1'],
['name' => 'Item 2'],
Expand Down Expand Up @@ -197,7 +197,7 @@ BareUI supports all the control structures you'd expect in a templating engine.

As you guessed, any valid PHP code can be used in BareUI templates. This means you can use any PHP function, class, or method in your templates. This makes BareUI a powerful templating engine that can handle any task you throw at it.

## Sub-templates
## Sub-templates/Partials

Sub-templates are templates that are included in other templates. This allows you to break your templates into smaller, more manageable pieces that can be reused across multiple templates. This is a great way to keep your templates DRY and avoid repeating yourself.

Expand Down
14 changes: 9 additions & 5 deletions src/docs/frontend/blade.md
Original file line number Diff line number Diff line change
Expand Up @@ -25,9 +25,13 @@ This video by The Net Ninja will help you get started with blade.

## Setting Up

Blade comes with Leaf MVC out of the box, fully configured and ready to use. However, if you're using Leaf Core, you'll need to set up Blade yourself. Don't worry, it's pretty easy. All you need to do is install Blade, configure it to match your project's setup, and you're good to go.
::: info Blade + Leaf MVC

You can install Leaf Blade with the Leaf CLI:
Blade comes with Leaf MVC out of the box, fully configured and ready to use. However, if you're using Leaf Core, you'll need to set up Blade yourself.

:::

You can install Leaf Blade using the Leaf CLI:

::: code-group

Expand All @@ -43,7 +47,7 @@ composer require leafs/blade

After this, you just need to inform Leaf of Blade's existence:

```php
```php:no-line-numbers
app()->attachView(Leaf\Blade::class);
```

Expand Down Expand Up @@ -87,7 +91,7 @@ This should look pretty familiar if you know HTML (of course you do). The only d

Remember we set up Blade earlier? Now we can use it to render our Blade views. Here's how you can render the `hello.blade.php` view we created earlier:

```php
```php:no-line-numbers
echo app()->blade()->render('hello', ['name' => 'Michael']);
```

Expand All @@ -105,7 +109,7 @@ app()->blade()->directive('datetime', function ($expression) {

Which allows you to use the following in your blade template:

```html
```blade:no-line-numbers
Current date: @datetime($date)
```

Expand Down
20 changes: 18 additions & 2 deletions src/docs/frontend/tailwind.md
Original file line number Diff line number Diff line change
Expand Up @@ -103,6 +103,22 @@ That's it! You now have Tailwind CSS set up in your Leaf project. You can start

Be sure to start your vite server by running:

```bash:no-line-numbers
npm run dev
::: code-group

```bash:no-line-numbers [Leaf CLI]
leaf view:dev
```

```bash:no-line-numbers [npm]
npm i && npm run dev
```

```bash:no-line-numbers [pnpm]
pnpm i && pnpm run dev
```

```bash:no-line-numbers [yarn]
yarn && yarn dev
```

:::
4 changes: 2 additions & 2 deletions src/docs/frontend/third-party.md
Original file line number Diff line number Diff line change
Expand Up @@ -20,7 +20,7 @@ composer require smarty/smarty

Once installed, you need to tell Leaf about your engine. Leaf will try to cache your engine for future use. You can do this using the `attachView()` method on the app instance:

```php
```php:no-line-numbers
app()->attachView(Smarty::class);
```

Expand Down Expand Up @@ -48,7 +48,7 @@ Unlike Leaf Core, Leaf MVC comes with a view manager that makes Leaf aware of an

The first step is to head over to your `public/index.php` file and attach Smarty to Leaf:

```php
```php:no-line-numbers
app()->attachView(Smarty::class);
```

Expand Down
28 changes: 22 additions & 6 deletions src/docs/frontend/vite.md
Original file line number Diff line number Diff line change
Expand Up @@ -73,16 +73,32 @@ Once you've installed Vite, you can start loading your assets using the the `vit

Here's an example of how you can load a CSS file:

```php
::: code-group

```blade:no-line-numbers [Blade]
{{ vite('css/app.css') }}
```

```php:no-line-numbers [BareUI]
<?php echo vite('css/app.css'); ?>
```

:::

You can also load multiple assets at once by passing in an array of assets:

```php
::: code-group

```blade:no-line-numbers [Blade]
{{ vite(['app.css', 'app.js']) }}
```

```php:no-line-numbers [BareUI]
<?php echo vite(['app.css', 'app.js']); ?>
```

:::

The `vite()` helper function will automatically load the correct assets depending on the environment. In development, it will load the assets from the vite server with Hot Module Replacement, while in production, it will load the assets from the build folder.

## Vite Config
Expand All @@ -108,7 +124,7 @@ export default defineConfig({

The Leaf Vite plugin requires an array of entry points for your application. These may be JavaScript or CSS files, and include preprocessed languages such as TypeScript, JSX, and Sass. You don't need to pass all your assets here, just the entry points.

Besides the Vite config file, you can also configure the server component for Vite. With this, you can set a couple of defaults for your assets.
Besides the Vite config file, you can also configure the server component to set a few defaults for Vite. This is is only necessary if you are NOT using Leaf MVC. You can configure the server component by calling the `config` method on the `Vite` class:

```php
\Leaf\Vite::config([
Expand All @@ -119,11 +135,9 @@ Besides the Vite config file, you can also configure the server component for Vi

Unlike the `vite.config.js` file, this configuration is done in PHP and is completely optional.

Once again if you're using Leaf MVC or if you installed Vite using the `view:install` command, this is done for you automatically.

## Running Vite

Vite comes with a development server that you can use to serve your assets. This is true for the Leaf Vite integration as well. This is a bit different from the traditional way of serving assets with PHP because you need to run a separate server for your assets. You can start your Vite server by running:
Vite comes with a development server that you can use to serve your frontend assets. This is a bit different from the traditional way of serving assets with PHP because you need to run a separate server for your assets. You can start your Vite server by running:

::: code-group

Expand All @@ -147,6 +161,8 @@ yarn && yarn dev

This will install the necessary dependencies and start your Vite server. You don't need to do anything with the Vite server, just keep it running in the background and Leaf will take care of the rest.

**You need to keep the Vite server running in a separate terminal window while you work on your project.**

## Adding Aliases

Vite allows you to set up aliases for your assets. This can be done by adding an `alias` key to your vite config. For example, to set up an alias for the `@` symbol, you can do:
Expand Down
18 changes: 9 additions & 9 deletions src/docs/mvc/controllers.md
Original file line number Diff line number Diff line change
Expand Up @@ -54,7 +54,7 @@ You can have as many methods as you want in your controller. Each method should

After defining a controller with the methods that you will use to handle your routes, you need to tell Leaf when to load a controller and which method to call. You can do this by defining a route in your `app/routes/` directory, and then calling the method in the controller that should handle the route. Here's an example:

```php
```php:no-line-numbers
app()->get('/users', 'UsersController@index');
```

Expand Down Expand Up @@ -83,7 +83,7 @@ You can find the views documentation [here](/docs/frontend/)

When you're building web apps, sometimes you need extra functionality when someone visits a route. For example, maybe only logged-in users should be able to see certain pages. To manage this, Leaf lets you add route parameters like middleware to your routes. This feature also works for controllers and uses the same syntax as function route handlers. Here's an example:

```php
```php:no-line-numbers
app()->get('/users', ['middleware' => 'auth', 'UsersController@index']);
```

Expand All @@ -95,7 +95,7 @@ Leaf makes it super easy to set up routes for common actions like creating, read

To get started, you can generate a resource controller using the Aloe CLI:

```bash
```bash:no-line-numbers
php leaf g:controller photos --resource
```

Expand Down Expand Up @@ -146,7 +146,7 @@ class PhotosController extends Controller {

You can then define your routes like this:

```php
```php:no-line-numbers
app()->resource('/photos', 'PhotosController');
```

Expand All @@ -164,33 +164,33 @@ This will automatically set up all the routes you need for CRUD operations on th

API resource controllers are similar to resource controllers, but they return JSON responses instead of HTML which means that the `create` and `edit` methods are not included. You can generate an API resource controller using the Aloe CLI:

```bash
```bash:no-line-numbers
php leaf g:controller photos --api
```

You can load the controller in your routes like this:

```php
```php:no-line-numbers
app()->apiResource('/photos', 'PhotosController');
```

## Aloe Console Helper

Allow has a few more shortcuts you can incorporate into your controller generation:

```bash
```bash:no-line-numbers
php leaf g:controller <ControllerName> -m
```

This command will generate your controller together with a model that corresponds to the controller name. The model will be generated in the `app/models` directory.

```bash
```bash:no-line-numbers
php leaf g:controller <ControllerName> -t
```

The `-t` flag will generate a controller with a frontend template that corresponds to the controller name. The template will be generated in the `app/views` directory.

```bash
```bash:no-line-numbers
php leaf g:controller <ControllerName> -a
```

Expand Down