Skip to content

Commit

Permalink
Add pages for Twig-View and PHP-View (#726)
Browse files Browse the repository at this point in the history
* Add Twig and PHP-View pages
  • Loading branch information
odan committed Jul 15, 2024
1 parent 1217c42 commit 206bb3f
Show file tree
Hide file tree
Showing 4 changed files with 168 additions and 126 deletions.
2 changes: 2 additions & 0 deletions _config.yml
Original file line number Diff line number Diff line change
Expand Up @@ -89,6 +89,8 @@ defaults:
- title: Add Ons
items:
- [/docs/v4/features/templates.md, Templates]
- [/docs/v4/features/twig-view.md, Twig Templates]
- [/docs/v4/features/php-view.md, PHP Templates]
- title: Contributing
items:
- [/docs/v4/contributors/strategy.md, Branching Strategy]
Expand Down
71 changes: 71 additions & 0 deletions docs/v4/features/php-view.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,71 @@
---
title: PHP Templates
---

## The slim/php-view component

The [PHP-View](https://github.com/slimphp/PHP-View) PHP component helps you render PHP templates.

## Installation

```
composer require slim/php-view
```

## Usage

You can use it with Slim like this:

```php
<?php

use Slim\Factory\AppFactory;
use Slim\Views\PhpRenderer;

require __DIR__ . '/../vendor/autoload.php';

// Create App
$app = AppFactory::create();

$app->get('/hello', function ($request, $response) {
$renderer = new PhpRenderer(__DIR__ . '/../templates');

$viewData = [
'name' => 'John',
];

return $renderer->render($response, 'hello.php', $viewData);
})->setName('profile');

$app->run();
```

Create a directory in your project root: `templates/`

Create a template file within the templates directory: `templates/hello.php`

**Template content:**

```php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Slim Example</title>
</head>
<body>
<h1>Hello, <?= htmlspecialchars($name, ENT_QUOTES | ENT_SUBSTITUTE, 'UTF-8') ?></h1>
</body>
</html>
```

Output:

```
Hello John
```

**Security note:** It's important to ensure that the dynamic
output is properly [escaped](https://github.com/slimphp/PHP-View?tab=readme-ov-file#escaping-values).

132 changes: 6 additions & 126 deletions docs/v4/features/templates.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,133 +8,13 @@ Each Slim application route is responsible for preparing and returning an approp

> Slim's "view" is the HTTP response.
That being said, the Slim project provides the [Twig-View](#the-slimtwig-view-component) and [PHP-View](#the-slimphp-view-component) components to help you render templates to a PSR7 Response object.

## The slim/twig-view component

The [Twig-View][twigview] PHP component helps you render [Twig][twig] templates in your application.
This component is available on Packagist, and it's easy to install with Composer like this:

[twigview]: https://github.com/slimphp/Twig-View
[twig]: http://twig.symfony.com/

<figure markdown="1">
```bash
composer require slim/twig-view
```
<figcaption>Figure 1: Install slim/twig-view component.</figcaption>
</figure>

Next, you need to add the slim/twig-view middleware to the Slim app:

<figure markdown="1">
```php
<?php
use Slim\Factory\AppFactory;
use Slim\Views\Twig;
use Slim\Views\TwigMiddleware;

require __DIR__ . '/vendor/autoload.php';

// Create App
$app = AppFactory::create();

// Create Twig
$twig = Twig::create('path/to/templates', ['cache' => false]);

// Add Twig-View Middleware
$app->add(TwigMiddleware::create($app, $twig));
```
<figcaption>Figure 2: Add slim/twig-view middleware.</figcaption>
</figure>

**Note:** For production scenarios, `cache` should be set to some `'path/to/cache'` to store compiled templates (thus avoiding recomplication on every request).
For more information, see [Twig environment options](http://twig.symfony.com/doc/3.x/api.html#environment-options)

Now you can use the `slim/twig-view` component service inside an app route to render a template and write it to a PSR-7 Response object like this:

<figure markdown="1">
```php
$app->get('/hello/{name}', function ($request, $response, $args) {
$view = Twig::fromRequest($request);
return $view->render($response, 'profile.html', [
'name' => $args['name']
]);
})->setName('profile');

// Run app
$app->run();
```
<figcaption>Figure 3: Render template with slim/twig-view container service.</figcaption>
</figure>

In this example, `$view` invoked inside the route callback is a reference to the `\Slim\Views\Twig` instance returned by the `fromRequest` method.
The `\Slim\Views\Twig` instance's `render()` method accepts a PSR-7 Response object as its first argument, the Twig template path as its second argument, and an array of template variables as its final argument.
The `render()` method returns a new PSR-7 Response object whose body is the rendered Twig template.

### The url_for() method

The `slim/twig-view` component exposes a custom `url_for()` function to your Twig templates.
You can use this function to generate complete URLs to any named route in your Slim application.
The `url_for()` function accepts two arguments:

1. A route name
2. A hash of route placeholder names and replacement values

The second argument's keys should correspond to the selected route's pattern placeholders.
This is an example Twig template that draws a link URL for the "profile" named route shown in the example Slim application above.

```html
{% raw %}
{% extends "layout.html" %}

{% block body %}
<h1>User List</h1>
<ul>
<li><a href="{{ url_for('profile', { 'name': 'josh' }) }}">Josh</a></li>
</ul>
{% endblock %}
{% endraw %}
```

## The slim/php-view component

The [PHP-View][phpview] PHP component helps you render PHP templates.
This component is available on Packagist and can be installed using Composer like this:

[phpview]: https://github.com/slimphp/PHP-View

<figure markdown="1">
```
composer require slim/php-view
```
<figcaption>Figure 6: Install slim/php-view component.</figcaption>
</figure>

You can use it with Slim like this:

<figure markdown="1">
```php
<?php
use Slim\Factory\AppFactory;
use Slim\Views\PhpRenderer;

require __DIR__ . '/vendor/autoload.php';

// Create App
$app = AppFactory::create();

$app->get('/hello/{name}', function ($request, $response, $args) {
$renderer = new PhpRenderer('path/to/templates');
return $renderer->render($response, "hello.php", $args);
})->setName('profile');

$app->run();
```
<figcaption>Figure 8: Render template with slim/php-view service.</figcaption>
</figure>
That being said, the Slim project provides the [Twig-View](twig-view.html) and [PHP-View](php-view.html) components
to help you render templates to a PSR-7 Response object.

## Other template systems

You are not limited to the `Twig-View` and `PHP-View` components.
You can use any PHP template system provided that you ultimately write the rendered template output to the PSR-7 Response object's body.
You can use any PHP template system provided that you ultimately
write the rendered template output to the PSR-7 Response object's body.


89 changes: 89 additions & 0 deletions docs/v4/features/twig-view.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
---
title: Twig Templates
---

## The slim/twig-view component

The [Twig-View][twigview] PHP component helps you render [Twig][twig] templates in your application.
This component is available on Packagist, and it's easy to install with Composer like this:

[twigview]: https://github.com/slimphp/Twig-View
[twig]: https://twig.symfony.com/

## Installation

```
composer require slim/twig-view
```

## Usage

Next, you need to add the middleware to the Slim app:

```php
<?php

use Slim\Factory\AppFactory;
use Slim\Views\Twig;
use Slim\Views\TwigMiddleware;

require __DIR__ . '/../vendor/autoload.php';

// Create App
$app = AppFactory::create();

// Create Twig
$twig = Twig::create('path/to/templates', ['cache' => false]);

// Add Twig-View Middleware
$app->add(TwigMiddleware::create($app, $twig));
```

**Note:** For production scenarios, `cache` should be set to some
`'path/to/cache'` to store compiled templates (thus avoiding recompilation on every request).
For more information, see [Twig environment options](https://twig.symfony.com/doc/3.x/api.html#environment-options)

Now you can use the `slim/twig-view` component service inside
an app route to render a template and write it to a PSR-7 Response object like this:

```php
$app->get('/hello', function ($request, $response) {
$view = Twig::fromRequest($request);

return $view->render($response, 'profile.html', [
'name' => 'John',
]);
})->setName('profile');

// Run app
$app->run();
```

In this example, `$view` invoked inside the route callback is a reference to the `\Slim\Views\Twig` instance returned by the `fromRequest` method.
The `\Slim\Views\Twig` instance's `render()` method accepts a PSR-7 Response object as its first argument, the Twig template path as its second argument, and an array of template variables as its final argument.
The `render()` method returns a new PSR-7 Response object whose body is the rendered Twig template.

### The url_for() method

The `slim/twig-view` component exposes a custom `url_for()` function to your Twig templates.
You can use this function to generate complete URLs to any named route in your Slim application.
The `url_for()` function accepts two arguments:

1. A route name
2. A hash of route placeholder names and replacement values

The second argument's keys should correspond to the selected route's pattern placeholders.
This is an example Twig template that draws a link URL for the "profile" named route shown in the example Slim application above.

```html
{% raw %}
{% extends "layout.html" %}

{% block body %}
<h1>User List</h1>
<ul>
<li><a href="{{ url_for('profile', { 'name': 'josh' }) }}">Josh</a></li>
</ul>
{% endblock %}
{% endraw %}
```

0 comments on commit 206bb3f

Please sign in to comment.