Створіть вашу першу сторінку в Symfony

Дата оновлення перекладу 2022-12-15

Створіть вашу першу сторінку в Symfony

Створення нової сторинки - не важливо, чи буде це сторінка HTML, чи JSON – це простий процес, який складається з 2 кроків:

Створіть маршрут: Маршрут – це URL (наприкад, /about) вашої сторінки та вказівка на контролер;
Створіть контролер: Контролер – це РНР-функція, написана вами, яка створює сторінку. Ви берете вхідну інформацію запиту, та використовуєте її для створення об'єкта Symfony Response, який може містити HTML зміст, рядок JSON або навіть бінарний файл на кшталт зображення чи PDF.

Screencast

Віддаєте перевагу відео-урокам? Подивість серіал Чудова розробка з Symfony.

Створення сторінки: маршрут та контролер

Tip

Перед тим, як продовжувати, переконайтеся в тому, що ви прочитали главу про установку, і можете викликати застосунок Symfony зі свого браузера.

Припустимо, ви хочете створити сторінку /lucky/number, яка буде генерувати щаслие (добре, випадкове) число, та відображати його. Для цього створіть "клас контролера" та всередині нього - метод "контролера":

        1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
        <?php
// src/Controller/LuckyController.php
namespace App\Controller;

use Symfony\Component\HttpFoundation\Response;

class LuckyController
{
    public function number(): Response
    {
        $number = random_int(0, 100);

        return new Response(
            '<html><body>Lucky number: '.$number.'</body></html>'
        );
    }
}
    

Тепер вам треба проасоціювати цю функцію контролера з публічним URL (наприклад, /lucky/number), щоб метод number() виконувався, коли користувач переходить за посиланням. Ця асоціація визначається шляхом створенна маршруту в файлі config/routes.yaml:

        1
2
3
4
5
6
        # config/routes.yaml

# ім'я маршруту "app_lucky_number" поки не має значення
app_lucky_number:
    path: /lucky/number
    controller: App\Controller\LuckyController::number
    

Ось і все! Якщо ви використовуєте веб-сервер Symfony, спробуйте його, перейшовши за посиланням: http://localhost:8000/lucky/number

Якщо ви побачите відображене щасливе число - вітаємо! Однак перед тим, як бігти грати в лотерею, подвіться, як це працює. Пам'ятаєте два кроки для створення сторінки?

Створіть контролер і метод: Це функція, в якій ви будуєте сторінку та повертаєте об'єкт Response. Ви дізнаєтеся більше про контролери у розділі про них, включно з тим, як повертати відповіді JSON.
Створіть маршрут: У config/routes.yaml, маршрут визначає URL до вашої сторінки (path), та який controller викликати. Ви дізнаєтеся більше про маршрутизацію у розділі про неї, включно з тим, як створювати змінні URL;

Маршрути анотацій

Замість того, щоб визначати ваш маршрут на YAML, Symfony також дозволяє вам використовувати маршрути атрибутів. Атрибути вбудовуються в PHP, починаючи з версії PHP 8. У більш ранніх версіях PHP ви можете використовувати анотації. Щоб зробити це, встановіть пакет анотацій.

        1
        $ composer require annotations
    

You can now add your route directly above the controller:

        1
2
3
4
5
6
7
8
9
10
11
12
13
        // src/Controller/LuckyController.php

// ...
+ use Symfony\Component\Routing\Annotation\Route;

class LuckyController
{
+   #[Route('/lucky/number')]
    public function number(): Response
    {
        // це виглядає точно так само
    }
}
    

Ось і все! Сторінка http://localhost:8000/lucky/number працюватиме точно так само, як і раніше! Анотації є рекомендованим способом конфігурації маршрутів.

Автоматична установка рецептів за допомогою Symfony Flex

Можливо ви не помітили, але коли ви виконали composer require annotations, сталися дві особливі речі, обидві - завдяки потужному плагіну Composer на ім'я Flex.

По-перше, annotations - це не справжнє ім'я пакету: це додаткове ім'я (тобто, ярлик), який Flex зводить до sensio/framework-extra-bundle.

По-друге, після того, як було завантажено цей пакет, Flex виконав рецепт, який є набором автоматичних інструкцій, які повідомляють Symfony, як інтегрувати зовнішній пакет. `_Рецепти Flex` існують для багатьох пакетів (див. `symfony.sh`_) і мають можливість робити багато чого, на кшталт додавання файлів конфігурації, створення каталогів, оновлення .gitignore та додавання нової конфігурації у ваш файл .env. Flex автоматизує установку пакетів, щоб ви могли повернутися до написання коду.

Команда bin/console

Ваш проект вже містить в собі потужний інструмент налагодження: команду bin/console. Спробуйте виконати її:

        1
        $ php bin/console
    

Ви маєте побачити список команд, які можуть надати вам інформацію про налагодження, допомогти згенерувати код, згенерувати міграції бази даних та багато іншого. Коли ви будете встановлювати більше пакетів, ви будете бачити більше команд.

Щоб отримати список усіх маршрутів у вашій системі, використайте команду debug:router:

        1
        $ php bin/console debug:router
    

Зараз ви маєте побачити ваш маршрут app_lucky_number зверху:

Ви також побачите маршрути налагодження під app_lucky_number -- більше про маршрути налагодження буде у наступному розділі.

Ви дізнаєтеся ще про багато команд далі!

Tip

Якщо ваша оболонка підтримується, ви також можете налаштувати підтримку завершення консолі. Це автоматично заповнює команди та інше введення при використанні bin/console. Див. документ Console , щоб дізнатися більше про те, як налаштувати заповнення.

Панель інструментів веб-налагодження: налагодження мрії

Однією з неймовірних функцій Symfony є Web Debug Toolbar (панель інструментов веб-налагодження): панелі, яка відображає величезну кількість інформації налагодження знизу вашої сторінки при розробці. Це все включено при установці з використанням пакету Symfony під назвою symfony/profiler-pack.

Ви побачите темну панель знизу сторінки. Ви дізнаєтеся більше про всю інформацію, яку вона містить, далі, але не бійтеся експериментувати: наведіть курсор та натискайте на різні іконки, щоб отримати інформацію про маршрутизацію, продуктивність, ведення логів та іншу.

Відображення шаблону

Якщо вашому контролеру необхідно повертати HTML, то ви, скоріш за все, захочете використовувати шаблон. На щастя, в Symfony є шаблонізатор Twig – простий, багатофункціональний та насправді класний.

Спочатку встановіть Twig:

        1
        $ composer require twig
    

Далі, переконайтеся в тому, що LuckyController розширює базовий клас Symfony Controller:

        1
2
3
4
5
6
7
8
9
10
        // src/Controller/LuckyController.php

// ...
+ use Symfony\Bundle\FrameworkBundle\Controller\Controller;

- class LuckyController
+ class LuckyController extends Controller
{
    // ...
}
    

Тепер використайте зручну функцію render(), щоб відобразити шаблон. Предайте їй змінну number, щоб ви могли використовувати її в Twig:

        1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
        // src/Controller/LuckyController.php
namespace App\Controller;

use Symfony\Component\HttpFoundation\Response;
// ...

class LuckyController extends AbstractController
{
    #[Route('/lucky/number')]
    public function number(): Response
    {
        $number = random_int(0, 100);

        return $this->render('lucky/number.html.twig', [
            'number' => $number,
        ]);
    }
}
    

Файли шаблонів живуть в каталозі templates/, який було створено для вас автоматично при установці Twig. Створіть новий каталог templates/lucky з новим файлом number.html.twig всередині:

        1
2
        {# templates/lucky/number.html.twig #}
<h1>Ваше щасливе число - {{ number }}</h1>
    

Синтаксіс {{ number }} використовується для відображення змінних у Twig. Оновіть ваш браузер, щоб отримати ваше нове щасливе число!

http://localhost:8000/lucky/number

Тепер вам може бути цікаво, куди поділася Панель інструментів веб-налагодження: вона пропала, так як в поточному шаблоні немає тегу </body>. Ви можете додати елемент тіла самостійно, або розширити base.html.twig, який містить всі елементи HTML за замовчуванням.

У статті шаблони, ви дізнаєтеся все про Twig: як проходити цикл, відображати інші шаблони та на повну використовувати його потужну систему наслідування шаблонів.

Перевірка структури проекту

Чудові новини! Ви вже працювали всередині найважливіших каталогів вашого проекту:

config/: Містить... конфігурацію, звичайно! Ви будете конфігурувати маршрут, сервіси та пакети.
src/: Тут живе весь ваш PHP-код.
templates/: Всі ваші шаблони Twig живуть тут.

Більшість часу ви працюватимете в src/, templates/ або config/. По мірі читання книги, ви дізнаєтеся, що можна робити в кожному з цих місць.

А що щодо інших каталогів у проекті?

bin/: Відомий файл bin/console живе тут (і інші, менш важливі виконувані файли).
var/: Тут зберігаються автоматично створені файли, такі як файли кешу (var/cache/) та логи (var/log/).
vendor/: Тут знаходяться сторонні бібліотеки (наприклад, «постачальник»)! Вони зазвичай завантажуються за допомогою менеджеру пакетів Composer.
public/: Це кореневий документ вашого проекту: тут ви розміщуєте будь-які ваші файли, доступні публічно.

І коли ви встановлюватимете нові пакети, за необхідності нові каталоги будуть створені автоматично.

Що далі?

Вітаємо! Ви вже починаєте опановувати Symfony та вивчаєте новий спосіб побудови чудових, функціональних, швидких та підтримуваних додатків.

Добре, час закінчити опанування базових знань, прочитавши наступні статті:

Після цього, дізнайтеся про інші важливі аспекти на кшталт сервіс-контейнера, системи форм, використання Doctrine (якщо вам потрібно використовувати базу даних) та інших!

Повеселіться!