Створення блогу на Symfony 2.8.1 lts

Вступне слово

У цій серії статей ми розглянемо створення блогу Symfony 2. За основу взято і переведений проект розробника Даррена Рису http://tutorial.symblog.co.uk/. Перед написанням цієї статті я звернувся до нього, і він дав свою згоду на переклад з поправками під версію Symfony 2.8.1 lts, за що я йому дуже вдячний.

Також хочеться відзначити, що ці статті зроблені для початківців, я не хочу виступати в ролі вчителя і у мене немає досвіду комерційної розробки на цьому фреймворку. Так що, якщо це прочитає людина, яка добре розбирається в Symfony2 і помітить якісь недоліки, буду радий критики і зауважень. Хотілося б, щоб кожен, хто має можливість і бажання, вніс свій внесок у ці статті і по можливості при виявленні будь-яких помилок, помилок і т. д. на них вказав.

Також ви знаєте, що Symfony2 є купа документації і статей, в тому числі на Хабре, відео на youtube і т. д., так що цей проект не є чимось новим.

Мені б дуже хотілося, щоб ми розробили цей проект разом з вами, дуже сподіваюся, що всі, хто доторкнеться до цього керівництву, отримає для себе якусь користь.

Проект доступний на github.

Поїхали!

Введення

Реалізовувати наш проект я буду в ОС Windows 10, IDE PHPStorm 10.0.3. Вам теж рекомендую використовувати цю IDE, але якщо ви використовуєте щось інше будь, CodeLobster, NotePad++ і т. д., нічого страшного.

Керівництво розділене на кілька частин, кожна з яких охоплює різні аспекти Symfony 2 та її компонентів.

Частини керівництва

[Частина 1] — Конфігурація Symfony2 і шаблонів
[Частина 2] — Сторінка з контактною інформацією: валідатори, форми та електронна пошта
[Частину 3] — Модель Блогу: Використання Doctrine 2 і Фікстур даних
[Частину 4] — Модель коментарів: Додавання коментарів, Репозиторій Doctrine 2 та Міграції
[Частину 5] — Настройка view: розширення Twig, Sidebar і Assetic
[Частину 6] — Тестування: Unit і Functional з допомогою PHPUnit

Це керівництво ставить своєю метою охопити часто зустрічаються завдання, з якими ви стикаєтеся при створенні веб-сайтів за допомогою Symfony2.

1. Бандли
2. Контролери
3. Шаблони (Використання Twig
4. Модель – Doctrine 2
5. Міграції
6. Фікстури даних
7. Валідатори
8. Форми
9. Маршрутизація
10. Asset
11. Електронна пошта
12. Безпека
13. Користувач сесії
14. Генерація CRUD (Create Read Update, Delete — Створення Читання Оновлення Видалення)

Symfony2 є легко настроюється фреймворком і надає ряд різних способів виконання однієї і тієї ж задачі. Прикладом цього може бути можливість написання параметрів конфігурації в форматах YAML, XML, PHP або анотаціях, а також створення шаблонів за допомогою Twig або PHP. Щоб зробити це керівництво як можна більш простим ми будемо використовувати формат YAML та анотації для конфігурації і Twig для шаблонів.

Частина 1

Огляд

У цій частині будуть розглянуті перші кроки при створенні сайту на Symfony2. Ми завантажимо і налаштуємо Symfony2.8.1 lts, створимо бандл Blog і встановимо основні шаблони HTML. В кінці цієї частини у вас буде настроєний сайт, який буде доступний за адресою http://localhost:8000. Сайт буде містити основну структуру HTML блогу і деякий контент.

У цій частині:

1. Налаштування програми Symfony2
2. Symfony2 Бандли
3. Маршрутизація
4. Контролери
5. Шаблонизатор Twig

Установка Symfony2 з допомогою Composer на ОС WindowsВстановіть Composer глобально для ОС Windows можна завантажити інсталятор за посиланням https://getcomposer.org/Composer-Setup.exe так само у вас повинен бути встановлений PHP в моєму випадку версія PHP 5.6

Зазвичай він входить до складу серверних платформ типу Open Server, а також включає в себе необхідний нам MySQL і безліч інших утиліт так само ви можете використовувати XAMPP або щось інше на ваш смак.

Далі відкрийте консоль, перейдіть в каталог, в якому хочете розмістити свій проект, і введіть:

php -r "file_put_contents('symfony', file_get_contents('https://symfony.com/installer'));"

Після того, як установник скочується введіть:

symfony new название_вашего_проекта 2.8

До речі, як встановити Symfony 2, ви завжди можете подивитися на офіційному сайті фреймворку.

У нашому ж випадку ми будемо використовувати PHPStorm c плагіном для Symfony для установки фреймворку, так як це більш простий варіант. Для цього Відкрийте PHPStorm натисніть на Create new Project і створіть новий проект.



Далі виберіть Symfony Installer вкажіть шлях до папки, в яку буде встановлений проект, версію фреймворку (в нашому випадку 2.8.1 lts), а так само шлях до php.exe натисніть Create.



Коли Symfony2 встановиться, нам знадобиться запустити сервер в консолі з папки проекту, робиться це командою:

php app/console server:run



Щоб постійно не прописувати команду для запуску сервера, ми можемо попросити PHPStorm робити це за нас
  • Для цього натисніть на кнопку в панелі:


    1. Виберіть Edit Configurations
    2. Натисніть на зелений плюс і додайте PHP script

    3. Виберіть ім'я

    4. Шлях до файлу console.php у вашому проекті
    5. В аргументах пропишіть server:run і натисніть Ok

  • На панелі з'явиться значок Play для запуску скрипта з аргументом, після чого нам достатньо буде натиснути на значок для запуску сервера.



Сервер запустився, і наш сайт став доступним за адресою http://127.0.0.1:8000/ і http://localhost:8000/. У вас повинна з'явитися ось така сторінка:



Ви побачите панель інструментів у нижній частині екрана привітання. Це панель інструментів розробника дає вам цінну інформацію про стан програми. Інформацію, включаючи час виконання скрипта, використання пам'яті, запитів до бази даних, стану аутентифікації і багато іншого. За замовчуванням панель інструментів відображається тільки при роботі в оточенні Dev, так як відображення панелі інструментів в оточенні Prod викличе великий ризик для безпеки, оскільки дозволяє побачити багато «нутрощів» вашої програми.

Налаштування Symfony

Відкрийте файл app/config/parameters.yml і введіть дані вашої бази даних: логін, пароль і т. д. В моєму випадку це значення за замовчуванням.



Бандли: Symfony2

Бандл є основним будівельним блоком програми Symfony2, насправді Symfony2 сам по собі є Бандлом. Бандли дозволяють відокремлювати функціональні можливості один від одного. Ми створимо Бандл для нашого сайту в просторі імен Blogger. Якщо ви не знайомі з просторами імен в PHP ви повинні витратити деякий час на їх вивчення, так як вони широко використовуються в Symfony2.

Підказка

Гарне розуміння просторів імен може допомогти вирішити проблеми, з якими ви можете зіткнутися, коли структури папок неправильно відображаються в структурі просторів імен.

Створення Пакету

Підказка

Не забудьте видалити пакет, який встановлюється за замовчуванням (він нам не знадобиться) для цього:

  • Видалити папку AppBundle з каталогу src
  • Видаліть рядок new AppBundle\AppBundle() із зареєстрованих Бандлів, у файлі
    app/AppKernel.php
  • видалити папку default за адресою
    app/Resources/views 
  • видалити ці рядки:

    app:
    resource: "@AppBundle/Controller/"
    type: annotation
    

    з файлу
    app/config/routing.yml
Для інкапсуляції функціональності блогу, ми створимо Blog бандл. Це «будинок» всіх необхідних файлів, і він легко може бути використаний в іншому додатку Symfony2. Symfony2 надає ряд команд, щоб допомогти нам при виконанні типових операцій. Однією з таких команд є команда генерації бандлів.

Щоб згенерувати бандл, виконайте наступну команду в консолі з папки проекту:

php app/console generate:bundle 

Підказка

Ви так само можете написати:

php app/console gen:bun 

Symfony зрозуміє таку команду.
Вам буде представлений ряд підказок, які дозволяють налаштувати бандл.

  1. Нас запитають, чи ми будемо використовувати цей пакет в інших додатках
    відповідаємо yes :
    Are you on planning sharing this bundle across multiple applications? [no]: yes
  2. Вказуємо простір імен у нас воно буде Blogger/BlogBundle:
    Bundle namespace:Blogger/BlogBundle
  3. Далі шлях установки Пакету:
    Target Directory [src/]:
    Залишаємо за замовчуванням, натискаємо Enter
  4. Так само потрібно вказати формат файлу конфігурації ми виберемо yml:
    Configuration format (annotation, yml, xml, php) [xml]: yml
Ми створили бандл, при цьому на задньому плані автоматично створити маршрут, і бандл зареєстрований у файлі
app/AppKernel.php
.

Підказка

Ви не зобов'язані використовувати генератор, який надає Symfony2, він створений тільки для того, щоб допомогти вам. Ви могли б вручну створити структуру папок і файлів Пакету. У той час як використання генератора не є обов'язковим, він дає деякі переваги, для отримання працюючого пакета. Одним з таких прикладів є автоматична реєстрація Пакету.

Реєстрація Пакету

Наш новий пакет BloggerBlogBundle був зареєстрований в ядрі і знаходиться в app/AppKernel.php. Symfony2 вимагає реєстрації всіх бандлів, що додаток повинен використовувати. Ви також помітите, що деякі бандли зареєстровані тільки в Dev або Test середовищах. Завантаження цих бандлів у Prod середовищі викличе додаткове навантаження. Нижче показано, як BloggerBlogBundle був зареєстрований.

// app/AppKernel.php
class AppKernel extends Kernel
{
public function registerBundles()
{
$bundles = array(
// ..
new Blogger\BlogBundle\BloggerBlogBundle(),
);
// ..

return $bundles;
}

// ..
}

Маршрутизація

Маршрут Бандла був імпортований в основний файл маршрутизації програми, розташованого в
app/config/routing.yml
.

# app/config/routing.yml

blogger_blog:
resource: "@BloggerBlogBundle/Resources/config/routing.yml"
prefix: /


Префікс дозволяє зробити так щоб весь BloggerBlogBundle був доступний за адресою з префіксом. У нашому випадку ми вирішили встановити значення за замовчуванням —
/
.

Тобто зараз наш сайт доступний за адресою http://localhost:8000 якщо ви хочете, щоб ваш сайт був доступний за адресою http://localhost:8000/blogger змінити
prefix: /blogger
.

Структура за замовчуванням

В теку
src
був створений бандл. Він починається на верхньому рівні з папки Blogger, який безпосередньо вказує на простір імен Blogger. Далі йде папка BlogBundle, яка містить наш Бандл. Вміст цієї папки буде розглянуто, в процесі проходження даного керівництва. Якщо ви знайомі з MVC фреймворками, деякі з папок будуть вам знайомі.

Маршрутизація бандла

Файл маршрутів BloggerBlogBundle розташований у
src/Blogger/BlogBundle/Resources/config/routing.yml
містить наступний маршрут:

blogger_blog_homepage:
path: /
defaults: { _controller: BloggerBlogBundle:Default:index }

Маршрутизація складається з шаблону і деяких налаштувань за замовчуванням. Шаблон звіряється з URL, і параметри за замовчуванням вказують контролеру здійснитися, якщо маршрут збігається. Маршрут не визначає HTTP методів.

Якщо маршрут відповідає всім зазначеним критеріям він буде виконаний за допомогою опції
_controller
за замовчуванням. Опція
_controller
визначає логічне ім'я контролера, який дозволяє Symfony2 визначати шлях до конкретного файлу. Наведений вище приклад буде викликати функцію
index action
в контролері за замовчуванням, який знаходиться тут: src/Blogger/BlogBundle/Controller/DefaultController.php.

Контролер

Контролер у цьому прикладі дуже простий. Клас
DefaultController
розширює
Controller
клас, який забезпечує деякі корисні методи, такі як метод представлення (render), використовуваний нижче. Наша функція не робить нічого, вона лише викликає метод представлення (render) із зазначенням
index.html.twig
шаблон у папці BloggerBlogBundle.

Формат імені шаблону: Бандл: Контролер: Шаблон. У нашому прикладі це BloggerBlogBundle:Default:index.html.twig, який відображає
index.html.twig
шаблон у папці view за замовчуванням BloggerBlogBundle або фізично файл
src/Blogger/BlogBundle/Resources/views/Default/index.html.twig
.

Різні варіанти форматів шаблону можуть бути використані для відображення шаблонів з різних місцезнаходжень додатка і його бандлів. Ми побачимо це пізніше в цій частині.

<?php

namespace Blogger\BlogBundle\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\Controller;

class DefaultController extends Controller
{
public function indexAction()
{
return $this- > render('BloggerBlogBundle:Default:index.html.twig');
}
}


Шаблон (View)

Як ви можете бачити шаблон дуже простий. Він виводить лише напис:

{# src/Blogger/BlogBundle/Resources/views/Default/index.html.twig #}

Hello World!

Чистка

Почистимо трохи наш бандл, т. к. деякі файли створені генератором, нам не потрібні. Файл контролера src/Blogger/BlogBundle/Controller/DefaultController.php може бути видалений так само, як і папка Default
src/Blogger/BlogBundle/Resources/views/Default
.

І, нарешті, видаліть маршрут, розташований в
src/Blogger/BlogBundle/Resources/config/routing.yml
.

Шаблони

У нас є 2 варіанти за замовчуванням для використання Symfony2 шаблонів; Twig і PHP. Ви можете, звичайно, не використовувати жоден з них і вибрати іншу бібліотеку. Це можливо завдяки Symfony2 Dependency Injection Container. Ми ж будемо використовувати Twig движок, з цілого ряду причин.

  • Twig швидкий і вимагає невеликих ресурсів.
  • Twig лаконічний — Twig дозволяє нам виконувати функції шаблонів в дуже стислому вигляді. Порівняйте це з PHP, де деякі заяви дуже багатослівні.
  • Twig підтримує спадкування шаблонів. Шаблони мають можливість розширюватися та ігнорувати інші шаблони, дозволяють дочірнім шаблонами змінювати значення за замовчуванням, передбачених батьківськими шаблонами.
  • Twig безпечний – в ньому за замовчуванням включено екранування і надає навіть з коробки середовище для імпортування шаблонів.
  • Twig є розширюваним — Twig надає багато загальної функціональності ядра, чого ви і чекаєте від движка шаблонів, але для тих випадків, коли вам потрібна додаткова функціональність, Twig може бути легко розширений.
Такими є лише деякі з переваг Twig. Інші причини, чому вам рекомендується звернути свою увагу на Twig ви можете побачити наофіційному сайті Twig.

Структура макету

Так як Twig підтримує спадкування шаблонів, ми будемо використовувати трирівневий підхід наслідування шаблонів. Такий підхід дозволяє нам змінювати вид на 3-х різних рівнях програми, даючи нам великі можливості і гнучкість. Почитати про шаблони можна тут.

Головний шаблон — Рівень 1

Почнемо зі створення базового шаблону для symblog. Нам знадобляться 2 файлу, шаблон і CSS. Так як Symfony2 підтримує HTML5, ми буде використовувати і його. Скопіюйте цей код у базовий шаблон:

<!-- app/Resources/views/base.html.twig -->
<!DOCTYPE html>
<html>
<head>
< meta http-equiv="Content-Type" content="text/html"; charset=utf-8" />
<title>{% block title %}Symblog{% endblock %} - Symblog</title>
<!--[if lt IE 9]>
<script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
{% block stylesheets %}
<link href='http://fonts.googleapis.com/css?family=Irish+Grover' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=La+Belle+Aurore' rel='stylesheet' type='text/css'>
<link href="{{ asset('css/screen.css') }}" type="text/css" rel="stylesheet" />
{% endblock %}
<link rel="shortcut icon" href="{{ asset('favicon.ico') }}" />
</head>
<body>

<section id="wrapper">
<header id="header">
<div class="top">
{% block navigation %}
<nav>
<ul class="navigation">
<li><a href="#">Home</a></li>
<li><a href="#">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
{% endblock %}
</div>

<hgroup>
<h2>{% block blog_title %}<a href="#">Symblog</a>{% endblock %}</h2>
<h3>{% block blog_tagline %}<a href="#">creating a blog in Symfony2</a>{% endblock %}</h3>
</hgroup>
</header>

<section class="main-col">
{% block body %}{% endblock %}
</section>
<aside class="sidebar">
{% block sidebar %}{% endblock %}
</aside>

<div id="footer">
{% block footer %}
Symfony2 blog tutorial - created by <a href="https://github.com/dsyph3r">dsyph3r</a>
{% endblock %}
</div>
</section>

{% block javascripts %}{% endblock %}
</body>
</html>

Примітка

Є 3 зовнішніх файлу, використаних в шаблоні, 1 JavaScript і 2 CSS. Файл JavaScript фиксит відсутність підтримки HTML5 в браузерах IE до версії 9. 2 CSS файли імпортують шрифти з веб-шрифтів Google.
Цей шаблон розмічає основну структуру нашого блогу. Велика частина шаблону складається з HTML, з тегами Twig. Теги Twig, ми розглянемо далі.

Звернемо увагу на заголовок. Давайте подивимося на назва:

<title>{% block title %}Symblog{% endblock %} - Symblog</title>

Перше, що ви помітите, невідомий {% тег. Це не HTML, і безумовно не PHP. Це один з 3 Twig тегів. Цей тег є тегом Twig який здійснює якусь дію. Він використовується для виконання операторів, таких як оголошення і визначення блочних елементів. Повний список можна знайти в документації Twig. Twig блок який ми визначили в назві робить 2 речі; Він встановлює ідентифікатор блоку до заголовка, і забезпечує відображення за замовчуванням між block endblock тегами. Визначаючи блок, ми можемо в майбутньому їм скористатися. Наприклад, на сторінці для відображення постів блогу ми хотіли б, щоб у заголовку сторінки виводилося назва блогу. Ми можемо добитися цього шляхом розширення шаблону і перевизначення заголовка блоку.

{% extends '::base.html.twig' %}

{% block title %}The blog title goes here{% endblock %}

У наведеному вище прикладі ми розширили шаблон успадкувавши базовий шаблон. Ви помітите, що у форматі шаблону частини Бандл і Контролер, пам'ятайте, формат Бандл: Контролер: Шаблон??? Виключивши Бандл і Контролер ми вказали що буде використовуватись шаблон на рівні додатки певного
app/Resources/views
.

Далі, ми визначили ще один блок і наповнимо змістом, в нашому випадку це Заголовок блогу. Так як батьківський шаблон вже містить Блок Заголовка, він змінюється нашим. Зараз виводиться "
The blog title goes here – symblog
". Ця функціональність забезпечується Twig і буде широко використовуватися при створенні шаблонів.

У блоці Стилів ми знайомимося які наслідують Twig тегом {{ або
визнач щось
" тег.

<link href="{{ asset('css/screen.css') }}" type="text/css" rel="stylesheet" />

Цей тег використовується для виведення значення змінної або виразу. У наведеному вище прикладі виводить значення, що повертається функцією asset, яка забезпечує нас портативним способом, отримання посилань на assets додатків, таких як CSS, JavaScript і зображення.

Тег {{ також може бути об'єднаний з фільтрами для маніпулювання виведення перед відображенням.

{{ blog.created|date("d-m-Y") }}
 


Для одержання повного списку фільтрів подивіться документацію Twig.

Останній Twig тег, який ми не бачили в шаблонах тег коментаря — {#. Його використання виглядає так:

{# The quick brown fox jumps over the lazy dog #}
 

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

Давайте додамо кілька стилів. Створіть файл таблиці стилів,
web/css/screen.css
і додайте наступний зміст. Це дозволить додати стилі для головного шаблону.

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{border:0;font-size:100%;font:inherit;vertical-align:baseline;margin:0;padding:0}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}table{border-collapse:collapse;border-spacing:0}

body { line-height: 1;font-family: Arial, Helvetica, sans-serif;font-size: 12px; width: 100%; height: 100%; color: #000; font-size: 14px; }
.clear { clear: both; }

#wrapper { margin: 10px auto; width: 1000px; }
#wrapper a { text-decoration: none; color: #F48A00; }
#wrapper span.highlight { color: #F48A00; }

#header { border-bottom: 1px solid #ccc; margin-bottom: 20px; }
#header .top { border-bottom: 1px solid #ccc; margin-bottom: 10px; }
#header ul.navigation { list-style: none; text-align: right; }
#header .navigation li { display: inline }
#header .navigation li a { display: inline-block; padding: 10px 15px; border-left: 1px solid #ccc; }
#header h2 { font-family: 'Irish Grover', cursive; font-size: 92px; text-align: center; line-height: 110px; }
#header h2 a { color: #000; }
#header h3 { text-align: center; font-family: 'La Belle Aurore', cursive; font-size: 24px; margin-bottom: 20px; font-weight: normal; }

.main-col { width: 700px; display: inline-block; float: left; border-right: 1px solid #ccc; padding: 20px; margin-bottom: 20px; }
.sidebar { width: 239px; padding: 10px; display: inline-block; }

.main-col a { color: #F48A00; }
.main-col h1,
.main-col h2
{ line-height: 1.2 em; font-size: 32px; margin-bottom: 10px; font-weight: normal; color: #F48A00; }
.main-col p { line-height: 1.5 em; margin-bottom: 20px; }

#footer { border-top: 1px solid #ccc; clear: both; text-align: center; padding: 10px; color: #aaa; }


Шаблон Бандла – Рівень 2

Тепер ми перейдемо до створення макета для BlogBundle. Створіть файл, розташований в
src/Blogger/BlogBundle/Resources/views/layout.html.twig
і додайте наступний зміст.

{# src/Blogger/BlogBundle/Resources/views/layout.html.twig #}
{% extends '::base.html.twig' %}

{% block sidebar %}
Sidebar content
{% endblock %}


На перший погляд цей шаблон може здатися трохи простим, але його простота і є ключем. По-перше, розширює базовий шаблон, який ми створили раніше. По-друге, перевизначає батьківський sidebar. Так як sidebar буде присутній на всіх сторінках нашого блогу має сенс виконати настройку на цьому рівні. Ви можете запитати, чому б нам просто не поставити налаштування шаблону програми, так як він буде присутній на всіх сторінках. Це просто, додаток нічого не знає про Бандл і не має. Бандл повинен самостійно утримувати всю свою функціональність і висновок sidebar'а є частиною цієї функціональності. Отже, чому б нам просто не поставити sidebar в кожному з шаблонів сторінок? Знову ж таки, це просто, ми б дублювали sidebar кожен раз, коли додавали б сторінку. Цей шаблон другого рівня дасть нам гнучкість у майбутньому додати інші налаштування. Наприклад, ми хочемо змінити копію підвалу на всіх сторінках, це було би чудове місце, щоб зробити це.

Шаблон сторінки — Рівень 3

Нарешті, ми готові для макета контролера. Ці макети будуть широко пов'язані з дією контролера, тобто
blog show action
мати
blog show
шаблон.

Почнемо з створення контролера для домашньої сторінки та її шаблону. Так як це перша сторінка, яку ми створюємо, ми повинні створити контролер. Створіть контролер

src/Blogger/BlogBundle/Controller/PageController.php
і додайте наступне:

<?php
// src/Blogger/BlogBundle/Controller/PageController.php

namespace Blogger\BlogBundle\Controller;

use Symfony\Bundle\FrameworkBundle\Controller\Controller;

class PageController extends Controller
{
public function indexAction()
{
return $this- > render('BloggerBlogBundle:Page:index.html.twig');
}
}


Тепер створіть шаблон для цієї функції. Як ви можете бачити у функції контролера ми будемо відображати шаблон індексного сторінки. Створіть шаблон:

src/Blogger/BlogBundle/Resources/views/Page/index.html.twig
 


{# src/Blogger/BlogBundle/Resources/views/Page/index.html.twig #}
{% extends 'BloggerBlogBundle::layout.html.twig' %}

{% block body %}
Blog homepage
{% endblock %}


У цьому прикладі BloggerBlogBundle::layout.html.twig пропущено ім'я контролера. Виключивши ім'я контролера, ми вказали використання шаблону рівня Bundle
src/Blogger/BlogBundle/Resources/views/layout.html.twig
.
Тепер давайте додамо маршрут для нашого сайту. Оновіть файл конфігурації
src/Blogger/BlogBundle/Resources/config/routing.yml
:

# src/Blogger/BlogBundle/Resources/config/routing.yml
BloggerBlogBundle_homepage:
path: /
defaults: { _controller: BloggerBlogBundle:Page:index }
вимога:
_method: GET

Тепер ми готові, щоб подивитися на наш шаблон Blogger. Перейдіть у браузері за адресою http://localhost:8000.

Ви повинні побачити основний макет блогу, з основним змістом і sidebar'ом.



Сторінка «About»

Останнє завдання в цій частині уроку буде створення статичної сторінки «About». Це продемонструє, як зв'язати сторінки разом, і далі застосовувати підхід трирівневого наслідування шаблонів прийнятого нами.

Маршрут

При створенні нової сторінки, одна з перших завдань полягає у створенні маршруту для неї. Відкрийте файл маршрутизації BloggerBlogBundle розташований у
src/Blogger/BlogBundle/Resources/config/routing.yml
і додайте наступне правило маршрутизації.

# src/Blogger/BlogBundle/Resources/config/routing.yml
BloggerBlogBundle_about:
path: /about
defaults: { _controller: BloggerBlogBundle:Page:about }
вимога:
methods: GET


Контролер



Потім відкрийте Page Controller, розташований в

src/Blogger/BlogBundle/Controller/PageController.php


і додайте дію для обробки сторінки «About»:

// src/Blogger/BlogBundle/Controller/PageController.php

class PageController extends Controller
{
//...

public function aboutAction()
{
return $this- > render('BloggerBlogBundle:Page:about.html.twig');
}

}

Показати

Для відображення шаблону створіть новий файл
src/Blogger/BlogBundle/Resources/views/Page/about.html.twig
та скопіюйте туди:

{# src/Blogger/BlogBundle/Resources/views/Page/about.html.twig #}
{% extends 'BloggerBlogBundle::layout.html.twig' %}

{% block title %}About{% endblock%}

{% block body %}
<header>
<h1>About symblog</h1>
</header>
<article>
<p>Donec imperdiet ante sed diam consequat et dictum erat faucibus. Aliquam sit
amet vehicula leo. Morbi urna dui, tempor ac posuere et, rutrum at dui.
Curabitur neque quam, ultricies ut imperdiet id, ornare varius arcu. Ut congue
urna sit amet tellus malesuada nec elementum risus molestie. Donec gravida
tellus sed tortor adipiscing fringilla. Donec nulla mauris, mollis egestas
condimentum laoreet, lacinia vel lorem. Morbi vitae justo sit amet felis
vehicula commodo a placerat lacus. Mauris at est elit, nec vehicula urna. Duis a
lacus nisl. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices
posuere cubilia Curae.</p>
</article>
{% endblock %}


На сторінці «About» немає нічого особливого. Це всього лише функція, яка виводить шаблон з деяким контентом Вона тим не менш приведе нас до наступної задачі.

Посилання на сторінки

Тепер ми маємо сторінку «About». Перейдіть за адресою http://localhost:8000/about, щоб у цьому переконатися. Однак у користувача немає ніякого іншого способу потрапити на цю сторінку окрім як написати в адресний рядок повний її адресу, що ми і зробили вище. Запам'ятайте ви завжди повинні використовувати функції маршрутизації, надаються Symfony2, ніколи не використовуєте наступне:

<a href="/contact">Contact</a>

<?php $this->redirect("/contact"); ?>

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

1. Цей підхід використовує жорстку посилання, і повністю ігнорує систему маршрутизації Symfony2. Наприклад, якщо ви захочете змінити в будь-який момент розташування сторінки контактів вам доведеться знайти всі посилання на жорсткій зв'язку і змінити їх.
2. Він буде ігнорувати середу контролерів. Середовища є тим, що ми насправді не пояснили, але ви їх вже використовували.
App_dev.php
— фронт-контролер забезпечує нам доступ до нашого додатка в середовищі Dev. Якщо ви заміните
app_dev.php
на
app.php
, ви будете запускати додаток в середовищі Prod. Значимість цих умов буде пояснено далі в уроці, але зараз важливо відзначити, що жорстка посилання не підтримує поточну середу де ми знаходимося.

Правильний спосіб зв'язати сторінки
path
та
url
— методи, передбачені Twig. Вони обидва дуже схожі, метод URL буде надавати нам абсолютний URL. Давайте поновимо шаблон програми
app/Resources/views/base.html.twig
і зв'яжемо Домашню сторінку зі сторінкою «About» разом.

<!-- app/Resources/views/base.html.twig -->
{% block navigation %}
<nav>
<ul class="navigation">
<li><a href="{{ path('BloggerBlogBundle_homepage') }}">Home</a></li>
<li><a href="{{ path('BloggerBlogBundle_about') }}">About</a></li>
<li><a href="#">Contact</a></li>
</ul>
</nav>
{% endblock %}


Тепер поновіть сторінку, ви побачите, що посилання на сторінки працюють.

Нарешті відновимо посилання логотипу, які перенаправляють вас на головну сторінку. Оновіть шаблон, розташований
app/Resources/views/base.html.twig
.

<!-- app/Resources/views/base.html.twig -->
<hgroup>
<h2>{% block blog_title %}<a href="{{ path('BloggerBlogBundle_homepage') }}">symblog</a>{% endblock %}</h2>
<h3>{% block blog_tagline %}<a href="{{ path('BloggerBlogBundle_homepage') }}">creating a blog in Symfony2</a>{% endblock %}</h3>
</hgroup>

Висновок

Ми почали досліджувати фундаментальні концепції, що лежать в додатку Symfony2, в тому числі маршрутизацію і движок шаблонів Twig.

У наступній частині ми створимо сторінку контактів. Ця сторінка трохи складніше, ніж сторінка «About», і дозволяє користувачам взаємодіяти з веб-формою, щоб відправляти нам запити. У наступній частині ми запровадимо нові поняття і дізнаємося, що таке Валідатор форм в Symfony2.

Джерела і допоміжні матеріали:

https://symfony.com/
http://tutorial.symblog.co.uk/
http://twig.sensiolabs.org/
http://www.doctrine-project.org/

Post Scriptum
Всім дякую за увагу, якщо у вас виникли труднощі чи питання, отписывайтесь в коментарі або особисті повідомлення, додавайтеся в друзі.


Джерело: Хабрахабр

0 коментарів

Тільки зареєстровані та авторизовані користувачі можуть залишати коментарі.