Всем привет!
На прошлой неделе наш новый преподаватель курса «Backend разработчик на PHP» провёл первый открытый урок на тему «Создание Web сайта на фреймворке Yii2». Предлагаем вашему вниманию запись и транскрипцию, собственно, вебинара.
Объектно-ориентированный компонентный фреймворк Yii2 — очень популярный и полезный инструмент, который пригодится вам при создании веб-сайтов. Именно этой теме и был посвящен открытый урок Евгения Волосатова, прошедший 2 июля 2018 года. В рамках интерактивного мастер-класса преподаватель не только подобно рассказал об особенностях фреймворка, но и показал его применение на практике.
Работа на открытом уроке проходила по принципу: «Лучше один раз сделать, чем сто раз увидеть». Все шаги выполнялись последовательно и по предварительно подготовленному плану. Для лучшего понимания работы фреймворка готовые шаблоны не загружались. Все изменения пошагово коммитились. Поддерживалась обратная связь со слушателями, поэтому преподаватель сразу отвечал на возникающие вопросы и помогал справляться со сложностями и ошибками.
На онлайн-занятии использовались следующие инструменты:
- Open Server;
- среда разработки PhpStorm;
- программное обеспечение Git;
- акетный менеджер уровня приложений Composer.
Весь необходимый софт был установлен на ПК еще до начала работы.
В процессе проведения мастер-класса слушателям было предложено выполнить совместно с преподавателем ряд практических задач:
- Подготовка рабочего места. Первый этап — запуск OS-панели из папки Open Server и ее настройка (выбор специальной версии Apache-PHP-7 во вкладке «Модули», создание локального домена otus.localhost во вкладке «Домены»). Далее по адресу OpenServer/Domains была создана папка otus, а в ней — папка web. Именно этот адрес и стал корневой директорией будущего сайта, при этом путь до нее (otusweb) прописывался вручную во вкладке «Домены». После выполнения настроек сервера сайт успешно запустился и стал доступен в браузере по адресу otus.localhost.
- Создание первого файла проекта. Эта процедура, так же как и многие последующие, выполнялась через консоль Open Server. В ней прописывались команды входа в папку otus (> cd otus), папку domains (> cd domains) и папку web. В web вручную был создан первый файл index.php и отправлена строка с простым содержанием — Welcome.
- Установка ядра Yii2. Процедура началась с обновления версии пакетного менеджера Composer через команду > composer self-update и подготовки его к работе путем загрузки библиотек и модулей. Также произошла инициализация Git (> git init) и подключение к нему созданного файла (> git add webindex php). Далее — установка ядра Yii2 через команду > composer require “yiisoft/yii2:*” В результате в папке web появились файлы composer.json и composer.log, плюс папка vendor (была добавлена в исключения Git). После этого необходимо было загрузить PhpStorm и прописать в index.php определенные конфигурационные настройки и команды. Также в папке otus была создана отдельная папка для настроек config, а в ней — файл web.php с соответствующим содержанием.
- Создание точки входа разработчика для управления программой. Была создана папка Controllers с файлом SiteController.php, прописаны необходимые функции и класс с наследованием web-контроллера.
- Создание представлений (Views). На данном этапе потребовалась директория с одноименным названием, плюс дополнительно для каждого контроллера была создана отдельная папка, а в ней — файл index.php для каждого отдельного метода. HTML-структура прописывалась в файле main.php, который поместили в предварительно созданную папку layouts (это помогло избежать возникающей ошибки).
- Подключение и настройка модуля оформления Bootstrap. Сложный и важный этап, успешное выполнение которого открыло возможности для разработки красивых сайтов без участия дизайнера. Для установки модуля в командную строку панели была внесена команда подключения компонентов, после чего они были загружены. Также в файле main.php нужно было создать php-скрипт и подключить его к Bootstrap. Далее был вызван компонент NavBar, необходимый для работы навигации. Возникли ошибки и чтобы их избежать, была произведена перенастройка конфига Composer в файле composer.json с указанием корректного пути инсталляции. После этого стало возможным удаление папки bower-asset в папке vendor. Также были выполнены работы по настройке модуля оформления (в файл main.php добавлены триггеры, div-контейнер и пр.).
- Создание строки меню и пунктов навигации Join и Login. Задачи реализовывались путем вставки нужного кода в main.php. Для работы навигации по страницам в папке site были созданы новые php-файлы с названиями, соответствующими пунктам навигации (join.php, login.php). Кроме того, были внесены изменения в контроллер. Для «наведения порядка» в адресной строке пришлось подключить компонент urlManager и прописать правила переадресации запросов браузера в созданном для этого файле .htaccess (папка web).
- Подключение системы отладки проекта Debug Extension for Yii2. Для работы системы был загружен и установлен специальный софт (при его подключении выполнялись шаги, прописанные в инструкции на сайте производителя). В результате успешного прохождения этого этапа пользователь получил возможность видеть логи, запросы, конфигурацию и прочие параметры работы сайта через специальную интерфейсную панель внизу страницы.
Как всегда ждём вопросы, предложения, комментарии тут или заглядывайте на второй открытый урок.
Автор: MaxRokatansky