Уроки Yii2. Как создать страницу и что такое View и Controller

2 months ago | 4.4K

 

Всех приветствую, с вами Сергей Никонов. В моем новом уроке Yii2 я расскажу как создать страницу, а также вы узнаете что такое паттерн MVC, что такое контроллер (controller), что такое вид (view), что такое layouts в фреймворке Yii2 и многое другое. Эти уроки входят в курс Yii2

Смотрите видео как создать страницу используя Yii2 фреймворк

Часть 1

 

Часть 2

 

Что такое MVC

Для того, чтобы вы смогли создать вашу первую страницу в фреймворке Yii2, вам необходимо понимать что такое MVC.

MVC расшифровывается как Model (модель) - View (вид) - Controller (контроллер). Model отвечает за связь и работой с данными, например модель User может извлекать информацию из базы данных, обновлять информацию в базе данных и так далее.

В этом уроке мы не будем работать с Model, а рассмотрим Controller и View. Controller является связующим звеном между Model и View и обрабатывает эти взаимодействия, а также входные данные. View, если говорить простыми словами, это визуальная часть вашего веб-приложения, которую видит пользователь сайта, иными словами - это файлы с html-версткой, которые подключаются в методы контроллеров.  

 

Что такое Controller (контроллер)

Контроллеры можно представить как интерфейсы между Models и Views. Для того, чтобы понять что такое контроллер, достаточно взглянуть на URL вашего локального сайта Yii2:

http://frontend.test/index.php?r=site%2Fabout

site - это название контроллера, а about - это метод в контроллере, который в Yii2 называется как Action.

Пример action страницы Yii2 about в контроллере SiteController:

 public function actionAbout()
 {
    return $this->render('about');
 }

Если вы удалите строчку return $this->render('about'); и напишите вместо нее:

echo 'Hello!';

перейдя на страницу About, вы увидите надпись hello. Вы даже можете вывести через echo html тэги, которые будут отображаться на странице about:

echo '<h1>Hello!</h1>';

 

Yii2 фреймворк. Как создать свою страницу.

Но так делать не нужно, так как это нарушает принцип MVC. Верстку необходимо выносить в отдельный файл.

 

Что такое View

Файлы с версткой, которые подключается в actions контроллеров называется Views (Виды). Все что видят пользователи вашего сайта - блоки, html-формы, кнопки, иными словами дизайн страницы описанный html и css является Views. Вы не должны помещать верстку ваших страниц напрямую в экшены контроллеров, а делать это нужно через специальные файлы view, затем эти файлы с версткой должны встраиваться в контроллеры:

 public function actionAbout()
 {
    return $this->render('about');
 }

Строчкой $this->render('about') в методе actionAbout контроллера SiteController рендерится (отрисовывается) View страницы About.

 

Как создать страницу в Yii2 фреймворке

Создать страницу используя фреймворк очень просто.

1. Перейдите в контроллер SiteController. Он находится в каталоге frontend - controllers и откройте файл SiteController.php.

2. Найдите и скопируйте action (метод) под названием actionAbout() и вставьте скопированный код ниже.

 public function actionAbout()
 {
    return $this->render('about');
 }

 public function actionAbout()
 {
    return $this->render('about');
 }

3. Переименуйте скопированный метод actionAbout() в actionHello() и в строчке $this->render('about') замените 'about' на 'hello'

 public function actionAbout()
 {
    return $this->render('about');
 }

 public function actionHello()
 {
    return $this->render('hello');
 }

4. Создайте файл hello.php в каталоге frontend - views и поместите в него следующий код:

<h1>Hello!</h1>
<button class="btn btn-danger">Action 1</button>
<button class="btn btn-success">Action 2</button>

5. Если вы настраивали локальные домены по урокам из курса Yii2 Фреймворк на сайте FructCode.com, перейдите по адресу:

http://frontend.test/index.php?r=site%2Fhello

 

и если вы все сделали верно, вы должны увидеть такую страницу:

Уроки Yii2. Как создать страницу.

 

Обратите внимание на кнопки, которые мы создали и их дизайн. CSS-классы, которые мы использовали, принадлежат Bootstrap 3. Но откуда Yii2 знает про Bootstrap 3? Дело в том, что в фреймворк Yii2 по умолчанию встроен Bootstrap 3 и вы можете сразу использовать все возможности верстки сетки и компоненты Bootstrap 3 в вашем проекте Yii2. А если вы незнакомы с Bootstrap 3, но хотите научиться им пользоваться, обязательно пройдите мой интерактивный курс Bootstrap 3 на сайте FructCode

 

Как вы видите создать страницу с помощью Yii2 фреймворка очень просто. Фреймворк Yii2 очень функциональный, но для того, чтобы знать как им пользоваться, вам необходимо знать что такое объектно-ориентированном программирование (ООП) и уметь программировать применяя парадигму ООП. Объектно-ориентированное программирование на первый взгляд кажется очень сложным и я постарался простым языком на примерах рассказать основы объектно-ориентированного программирования в моем интерактивном курсе PHP и MySQL

 

Кроме ООП вам необходимо изучить структуру фреймворка Yii2 Advanced, а также ключевые концепции Yii2, такие как:

- Components

- Properties

- Events

- Dependency Injection Container

- Behaviors

- Service Locator

 

И другие. Также вам необходимо уметь взаимодействовать с базой данный с помощью фреймворка Yii2 и знать следующее:

- Query Builder

- Migrations

- Active Record

- Database Access Objects

- Data caching

 

Уметь работать с Assets, Widgets и создавать собственные виджеты Yii2 и многое другое. Всю эту информацию вы можете найти в официальной документации фреймворка Yii2 и я очень рекомендую всегда обращаться к первостепенному источнику при изучении и работе с любыми технологиями и фремворками, тем не менее, если вы хотите быстро изучить ключевые моменты использования фреймворка Yii2, я рекомендую пройти мой курс Yii2 Фреймворк на сайте FructCode.com в котором я на простых примерах показываю как создать веб-сайт с помощью фреймворка Yii2. 

 

С уважением, Сергей Никонов

P.S. Актуальные версии моих курсов, а также новые курсы находятся только на моем сайте FructCode.com. 



Поделитесь в социальных сетях





Читайте также

Что такое NodeJS и npm?

На современном Javascript можно разрабатывать не только Frontend часть сайта, но и Backend и в этой...
11.5K

Большое обновление FructCode

Обучайтесь эффективнее на онлайн платформе FructCode с новыми интерактивными заданиями и новыми возм...
11.0K

Что такое Modern Javascript?

Языки программирования развиваются и Javascript не стал исключением. В этой статье вы узнаете о том,...
17.4K

Классы в JAVASCRIPT

У языка Javascript достаточно непривычный для программистов синтаксис, особенно, если раньше они пис...
8.0K

Что такое веб-хостинг

Хостинг - это специализированный компьютер (сервер), который предоставляет пользователям возможности...
8.1K

Как убрать index.php из URL

Для продвижения сайта в интернет, через поисковые системы, необходимы производить оптимизации. При с...
9.9K

Что такое файл index.php?

В этой статье вы узнаете, что такое файл index.php, чем его можно открыть. Мы рассмотрим самый прост...
32.6K























Курс Bootstrap 4. Обучение программирования, уроки программирования
Курс Bootstrap 4. Обучение программирования, уроки программирования
new
пока нет оценок
Сергей Никонов
  • Ориентировочная дата выхода нового урока - 22.08.2019

Курс VueJS Фреймворк. Обучение программирования, уроки программирования
Курс VueJS Фреймворк. Обучение программирования, уроки программирования
new
пока нет оценок
Сергей Никонов
  • Ориентировочная дата выхода нового урока - 25.08.2019

Курс Yii2 Фреймворк. Обучение программирования, уроки программирования
Курс Yii2 Фреймворк. Обучение программирования, уроки программирования
new
пока нет оценок
Сергей Никонов
  • Ориентировочная дата выхода нового урока - 28.08.2019

Курс Modern Javascript. Обучение программирования, уроки программирования
Курс Modern Javascript. Обучение программирования, уроки программирования
new
4.8 / 164
Сергей Никонов
  • Новинка!
  • 30 заданий
  • 16 видео
  • 2 часа

Курс Javascript/jQuery. Обучение программирования, уроки программирования
Курс Javascript/jQuery. Обучение программирования, уроки программирования
4.8 / 842
Сергей Никонов
  • 21 заданий
  • 10 видео
  • 1 час

Курс CodeIgniter. Обучение программирования, уроки программирования
Курс CodeIgniter. Обучение программирования, уроки программирования
4.9 / 533
Сергей Никонов
  • 28 заданий
  • 26 видео
  • 6 часов

Курс Linux/GIT/Хостинг. Обучение программирования, уроки программирования
Курс Linux/GIT/Хостинг. Обучение программирования, уроки программирования
4.9 / 665
Сергей Никонов
  • 29 заданий
  • 22 видео
  • 2 часа

Курс PHP/MySQL. Обучение программирования, уроки программирования
Курс PHP/MySQL. Обучение программирования, уроки программирования
4.8 / 785
Сергей Никонов
  • 69 заданий
  • 37 видео
  • 6 часов

Курс Bootstrap 3. Обучение программирования, уроки программирования
Курс Bootstrap 3. Обучение программирования, уроки программирования
4.9 / 1160
Сергей Никонов
  • 50 заданий
  • 25 видео
  • 4 часа

Курс HTML/CSS. Обучение программирования, уроки программирования
Курс HTML/CSS. Обучение программирования, уроки программирования
4.9 / 2069
Сергей Никонов
  • 66 заданий
  • 32 видео
  • 5 часов