День второй. 4-ое сентября.

junsenioradmin

Сегодня первая большая статья - учебный материал, который открывает цикл изучения php-фрэймворка Symfony.

Стоит сказать, что в данном уроке я подразумеваю, что ты знаешь основные языковые конструкции и примерно представляешь, что такое ООП. Моя цель показать тебе, как используя эти знания научиться писать backend.

Что ты сегодня узнаешь

1) Поймёшь, что такое backend и зачем он нужен, а так же разберёшься, почему именно Symfony.

2) Найдём дешёвый хостинг (если ты не знаешь, что это такое, то прочти это), затем его настроим под дальнейшую работу.

3) Затем я покажу, какую выбрать IDE (если ты не знаешь, что такое IDE - вот, смотри) и как её подключить к удалённому хостингу, чтобы при стандартном нажатии клавиш Ctrl+S (сохранение) все наши изменения отправлялись на хостинг. Затем мы настроим IDE так, чтобы разработка была максимально удобной.

4) После чего уже из IDE мы настроим наш сервер, затем установим на него Symfony.

Я ещё раз напомню всем тем, у кого много опыта и кто уровнем выше, чем я: если я что-то неверно делаю, использую устаревшую функцию или же вообще нарушаю заповеди - сообщите об этом, пожалуйста, через аккаунт обратной связи, который указан в описании канала. Заранее спасибо. Если же я вас откровенно раздражаю, проявляю дилетантские качества и вам кажется, что хуже меня человека не найти - опять же, любую адекватную критику я прочту и приму к сведению. Неадекватную - не приму.

Если же ты только начинаешь свой путь или твой уровень минимален, то знай, что я буду описывать всё так, чтобы ты понял. А это значит своим языком и исходя из своего опыта. Тут не будет красивых понятий, как в умной книжке. Тут будет реальный опыт и простые примеры.

Что же такое backend и зачем нам по нему чёрный пояс?

Чтобы понять что это такое, я пойду от обратного и коротко расскажу о том, кто такой frontend-разработчик и что такое frontend.

Вот заходишь ты на сайт wikipedia с целью найти какой-либо материал. Пусть это будет река “Уй”, потому что я случайно нажал на реку “Уй” в указателе по алфавиту. Всё, что ты видишь (именно видишь) в окне своего браузера называется frontend (лицевая сторона сайта, “морда”), и сделал её frontend-разработчик. А видишь ты примерно следующее:

Frontend-разработчик - тот человек, который умеет верстать, знает js-фрэймворки и посредством этих инструментов может сделать из .psd-файла (это формат файла, который изрыгает photoshop), который отдал ему дизайнер, полноценную морду сайта. Именно морду - ту часть, которую ты видишь в окне своего браузера. Что делает фронтендер и кто это такой - понятно? Теперь давай посмотрим на поиск, который находится в верхнем правом углу того скриншота, который я прикрепил выше. Если ты забьёшь туда какое-то слово и нажмёшь на кнопочку с лупой (я забил слово Linux),

то информация, которую ты забил в это поле, “улетит” на сервер (эта информация называется запрос). Сервер получает запрос, находит нужную информацию в базе данных по этому запросу (в данном случае он попробует найти в базе данных страницу по запросу “Linux”) и отправит её в качестве ответа на запрос, в том случае, если нашёл. Морда же, если получает ответ, то отрисовывает его в качестве страницы и вместо реки Уй ты увидишь

Если ты совсем не понимаешь в программировании, то перечитай несколько раз эти предложения и попробуй понять, что пользователь со своим браузером является клиентом и для них работает frontend-программист (чувак, который разрабатывает клиентскую часть), а сервер является пристанищем backend-программиста (серверная часть). Вкупе эти две стихии образуют web-сайт. Я надеюсь, что с этим более-менее понятно.

Backend можно писать на различных языках. Но написание сайта на чистом языке (это значит, что ты используешь только синтаксис языка, не прибегая к каким-либо инструментам) - дело сильно устаревшее. Чтобы упростить жизнь разработчику были придуманы framework'и (что это) - инструменты, заточенные под определённый язык и, в общем случае, образующие некоторый каркас проекта. Они предоставляют решения для основных рутинных действий backend-разработки (мы познакомимся с этими действиями в скором времени).

Я предлагаю тебе прикоснуться к такому фрэймворку, как Symfony. Почему именно Symfony? Потому что:

1) Разработка внутри этого фрэймворка ведётся на языке программирования php, который весьма прост в освоении, где-то интуитивно понятен и в целом хорош собой. Да, есть большая такая движуха людей, которые ненавидят его за его простоту. Почему? Не знаю.

2) В языке присутствуют все основные базовые конструкции (циклы, массивы, etc). Помимо этого в php присутствует поддержка ООП (Объектно-Ориентированное Программирование) и Symfony активно ООП использует, что лично для меня огромный плюс, так как ООП изначально создавалось с целью упрощения процесса разработки, и при грамотном использовании этого принципа разработка действительно упрощается.

3) Symfony содержит огромное количество инструментов, которые упрощают разработчику жизнь. Я об этом уже упоминал чуть выше, и вот вам один из примеров. Например, чтобы отправить письмо на email из скрипта, который ты написал, тебе достаточно подключить уже готовый компонент и в несколько строк кода, указав email и тему письма, отправить его. И так почти со всеми рутинными задачам - кто-то уже решил это, и тебе не нужно создавать велосипеды, ты просто используешь готовое и отлаженное решение, которое предоставляет framework. Если сейчас ты не понимаешь, о каких компонентах идёт речь - не бойся, мы с ними поработаем и я всё расскажу. На этом пока закончим перечислять плюшки и перейдём ко второй части - подберём и настроим хостинг.

Подбираем и арендуем хостинг

Теперь о том, где мы будем учиться. Есть два варианта, как накатить на грудь Symfony: на локальную машину (твой домашний компьютер или ноутбук) при помощи web-сервера от Symfony (он идёт в комплекте и позволяет локально разрабатывать web-приложения), или же на удалённом сервере. Когда я только начинал познавать азы Symfony, я залез в документацию, увидел, что из коробки можно одной командой запустить локальный сервер. Так и сделал. А затем, в ночь перед релизом, очень много матерился, пил кофе и пытался понять, как же всё таки развернуть Symfony-проект на удалённом сервере. Из мануалов был только один (ссылка на него будет чуть ниже), но он был (и есть) весьма устаревшим, из-за чего была масса ошибок. Поэтому, чтобы тебе в будущем не наступать на грабли, где ещё виднеется моя кровь, мы будем разрабатывать сразу на удалённом сервере.

Сервер мы будем снимать у хостера (компания, которая предоставляет место на сервере, которое ты можешь использовать под свои нужны). Место на сервере нам нужно с предустановленной операционной системой. Такое место называется VPS или VDS (виртуальный приватный сервер или виртуальный выделенный сервер). К нему мы будем подключаться через консоль и сможем этой операционной системой полноценно управлять! Т.е. устанавливать туда программы, которые нам нужны, настраивать её и вообще, делать всё почти всё, что душе угодно. В нашем случае нам нужен VDS, так как у VDS есть возможность подключения к серверу (в дальнейшем буду называть это просто сервер) через SSH-клиент (если не знаешь, что такое SSH - почитай).

Я скажу из своего опыта, что обычно снимаю VDS на timeweb. Дальше я расскажу, как купить дешёвый VDS именно у этого хостера. Если тебя не устроят цены, или ты знаешь какой-то VDS, который дешевле и лучше - используй его.

Теперь инструкция о том, как арендовать VDS. Заходим на https://timeweb.com/ru/services/vds/ и видим тарифную сетку:

Я для обычных, не высоко-нагруженных проектов, покупаю чаще всего “Master”. Ты можешь купить “Junior”, но при установке различных библиотек в дальнейшем ему может не хватать мощностей (скорее всего оперативной памяти). По крайней мере у меня не хватало, поэтому мой выбор - “Master”.

Нажимаешь на “Заказать” и дальше заполняешь свои данные, соглашаешься с условиями оферты и нажимаешь ещё раз “Заказать”. Затем, когда ты попадёшь в личный кабинет, мотай страницу в самый низ и нажимай “Завершить”. Далее нажимай “Перейти к оплате”, после чего идёт стандартная форма оплаты.

Всё, оплатил? Теперь нужно немного подождать - идёт установка операционной системы. По-умолчанию ставится последняя серверная Ubuntu 16.04. Нам нужна 18.04. Для этого иди во вкладку "Система", там нажимай на "Переустановить", и там в выпадашке, где написано "Ubuntu 16.04" выбирай "Ubuntu 18.04". Далее нажимай на "Продолжить", внизу страницы, и жди. После установки ОС на сервер на почту, которую ты указал при регистрации, придёт письмо с доступами к SSH. Жди завершения установки.

Установка завершилась? Если да, то в меню “Список VDS” ты увидишь примерно следующее:

Ребзя, на скрине - убунту 16.04. Так быть не должно! Переустановите на 18.04.

При этом на почте должны быть следующие письма:

В самом нижнем - логин и пароль для доступа к личному кабинету. В самом верхнем - данные для подключения к серверу через SSH-клиент. Переходим к установке и настройке IDE, из которого мы подключимся к серверу и настроим его.

Установка и настройка IDE. Подключение к серверу и его настройка

В качестве IDE для работы с php нет конкурентов у PhpStorm от JetBrains, имхо. Если не веришь - попробуй поработать в других и поймёшь, что самая удобная среда, всё таки, PhpStorm. Порт есть и на linux-дистрибутивы, и на Windows, и на мак-ось. Качай IDE отсюда - https://www.jetbrains.com/phpstorm/download/. Если ты linux-пользователь, то я уверен, что с установкой разберёшься, ибо ты уже многое прознал, пока сидел на linux-дистрибутиве. Если, всё-таки, возникли какие-то сложности, то вот тебе хороший и подробный (а главное на русском) ман, как поставить PhpStorm для Ubuntu - https://losst.ru/ustanovka-phpstorm-ubuntu-16-04. Если ты пользователь системы от мелко-мягких, то установка проста до безобразия - жмакай “Далее”, и всё. Когда IDE будет установлена и ты её запустишь, в появившемся окне у тебя будет выбор - либо купить себе доступ на сайте jetbrains (кстати, у меня на полном серьёзе есть лицензия для PhpStorm, ибо стоит она не дорого и я уважаю чужой труд), либо взять trial на 30 дней, либо где-то надыбать лицензионный сервер и указать его, чтобы он тебе всё активировал. Где - ищи в гугле и знай, что это будет на твоей совести. Если лень что-то делать, то просто выбери триал.

После успешного запуска среды сначала сделаем так, чтобы ты видел все файлы, которые лежат на удалённом сервере. Далее по шагам:

В поле Project name вводим любое имя для проекта, которое душе угодно.

Обязательно устанавливаем поля в то состояние, в котором они у меня на сриншоте выше. Первая выпадашка говорит о том, что мы будем отсылать изменения на сервер по нажатию Ctrl+S. Вторая выпадашка говорит о том, что при сохранении на сервер файл (который сохраняем) будет сравнивать с тем (который перезаписываем, если он уже существует) по времени последнего сохранения и по размеру. Если они отличаются, то будет выброшено соответствующее окно, где можно будет посмотреть, в чём отличия и изменить файл так, как нужно тебе (вдруг другой программист уже внёс какие-то изменения в файл, ты же не хочешь его перезаписать?).

Третья галочка говорит о том, что мы согласны получать уведомления об изменениях на сервере.

“Type” - SFTP.

“SFTP host” - вводим IP сервера, который у тебя на почте, в последнем письме.

“User name” - тоже пришёл на почту, но скорее всего root.

“Password” - в том же письме.

Поставь галочку “Save password”, чтобы каждый раз не вводить пароль при подключении к SSH.

Поставь галочку “Don't check HTTP connection to server”, чтобы PhpStorm не выбросил ошибку о том, что не может подключиться по HTTP-протоколу к серверу.

Нажимай “Next”. Появится окошко с подтверждением, там нажимай “Yes”.

А далее появится вот такое окно, где ты можешь лицезреть файлы своего сервере. Аве, мы их увидели. Жмакаем на корень (то, что у меня выделено синим и где я стёр свой IP), затем жмакаем на “Project Root”, затем на “Excluded from Download”. Всё, теперь “Next”, потом ещё раз “Next” и теперь ты можешь с гордостью сказать, что умеешь подключаться к удалённым серверам.

Теперь, когда PhpStrom всё прогрузил, в правом верхнем углу жмакай сюда:

Сначала на 3 точки (1), затем на вкладку “Excluded Paths” (2), затем на первую строку, чтобы она была выделена (3), затем на кнопку “Remove path” (4). Жмакай на “Ok”. На этом настройка завершена и теперь можно скачивать (на удалённом файле правой кнопкой мыши и “Download”) и сохранять (с помощью “Ctrl+S”) файлы.

Настройка удалённого сервера и установка на него Symfony

Переходим к самому сладкому. Вишенка на этом электронном тортике. Чтобы подключиться через ssh к серверу - достаточно 2 раза в PhpStorm нажать Ctrl+Shift+A, затем в окне поиска ввести “Start SSH session”:

Затем нажать Enter и в открывшемся окошке, с помощью стрелки вниз выбрать то подключение, которое мы делали чуть выше. В моём случае “test_vds_ssh”. Нажимаем Enter и открывается консоль. Если открылась вкладка Local, то нажмите Ctrl+Shift+W, чтобы её закрыть и остаться на вкладке с сервером:

То, что мы видим - это полноценная консоль Ubuntu, которая крутится на удалённом сервере. Круто, да?

Теперь нам нужно настроить Ubuntu так, чтобы без проблем в последующем развернуть на ней Symfony.

Сначала нужно установит на сервер LAMP (Linux, Apache, Mysql, PHP). Linux у нас уже есть, спасибо кэп. Apache - это web-сервер, его мы поставим. MySQL - это СУБД, которая управляет базами данных. PHP - это язык, на котором мы будем разрабатывать.

Да, я придерживаюсь именно такого стека, потому что он лёгок в настройке и удобен для небольших проектов. Если ты хочешь какую-либо другую БД - без проблем, но я буду говорить и работать в дальнейшем именно с MySQL. Если тебе не нравится web-сервер Apache и ты хочешь Nginx - то опять же, можешь настроить его.

Дабы не копировать то, что уже есть в сети я приведу мануал по настройке LAMP, которым пользуюсь сам, если что-то забываю: https://www.digitalocean.com/community/tutorials/linux-apache-mysql-php-lamp-ubuntu-18-04-ru. Делай всё по инструкции. Главное - запиши куда-нибудь root пароль от MySQL, он тебе ещё пригодится.

После настройки LAMP настало время установить Symfony. Есть мануал, как это сделать, но он весьма устаревший. Поэтому что-то тебе надо будет выполнять оттуда, а что-то буду говорить я. Вот сам ман - https://www.digitalocean.com/community/tutorials/how-to-deploy-a-symfony-application-to-production-on-ubuntu-14-04#step-2-%E2%80%94-configuring-mysql, открывай его в новом окне и поехали. Как видишь, слева в графе “Contents” указаны 7 шагов к успеху.

Первый шаг

Он немного устарел, поэтому его пропускай и делай вот что:

1) Обновляем индексы пакетов и сами пакеты на сервере командой

apt-get update && apt-get upgrade

2) Устанавливаем следующие зависимости, которые будет требовать symfony или библиотеки, которые мы будем юзать:

apt-get install git php-cli php-curl acl curl php-xml php-zip

3) Ставим composer (грубо говоря - это менеджер пакетов. Хочешь подробней - читай):

curl -sS https://getcomposer.org/installer | sudo php -- --install-dir=/usr/local/bin --filename=composer

Второй шаг

Тут всё делай так же, как указано в мане.

Третий шаг

Тут мы сделаем всё иначе, так как нам нужно не клонировать готовый репозиторий, а поставить на сервер чистую симфони. Итак:

1) Переходим в директорию, куда будем ставить Symfony:

cd /var/www/

2) Далее нам нужен официальный ман по установке Symfony: https://symfony.com/doc/current/setup.html, но так как он на английском и там слишком много ветвей, в которых можно запутаться, я укажу основные команды:

composer create-project symfony/website-skeleton testproject

Вместо testproject можно указать любое имя, которое будет корнем твоего Symfony-приложения. Ждём некоторое время, пока Symfony подтягивает различные пакеты.

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

 cd testproject/ && composer require sensiolabs/security-checker --dev

Пока не вникай, что тут происходит. Касательно композера и того, как он работает - я что-то расскажу в следующей статье, а на что-то дам ссылки, где это можно прочесть.

На этом я могу тебя поздравить - ты только что установил Symfony. Ура, мэн!

Четвертый шаг

Переходим к шагу 5.

Пятый шаг

Ставим prod-окружение:

export SYMFONY_ENV=prod

Подробней об этом я расскажу в следующей статье.

Теперь на удалённом сервере открой /var/www/testproject/ и скачай файл .env, который лежит в корне проекта. Вот его:

Теперь открывай его локально, для этого уже в левой колонке “Project” открывай всю иерархию папок, аналогично той, что ты только что открывал на удалённой машине, а затем открывай файл. Если появится окно, где PhpStorm изволит спросить, как трактовать данный формат файла, то просто оставь “Text” и нажимай “Ок”.

Открыл? Теперь ищи строку:

DATABASE_URL=mysql://db_user:db_password@127.0.0.1:3306/db_name

И заменяй в ней параметры на те, которые ты создал на шаге 2. Т.е. для примера:

DATABASE_URL=mysql://todo-user:todo-password@127.0.0.1:3306/todo

У тебя они должны быть свои, если ты их, конечно, менял.

Шестой шаг

Настало время настроить Apache, выполнить пару команд и зафиналить эту статью.

Сначала настроим временную зону, поставив, например, время Москвы:

nano /etc/php/7.2/apache2/php.ini

Далее нажимаем Ctrl+W, вводим date.timezone и нас выбросит примерно к этому блоку:

[Date]
; Defines the default timezone used by the date functions
; http://php.net/date.timezone
;date.timezone =

Перед “date.timezone” знак “;” нужно удалить, а после равно дописать “Europe/Moscow”:

[Date]
; Defines the default timezone used by the date functions
; http://php.net/date.timezone
date.timezone = Europe/Moscow

Нажимаем Ctrl+O, Enter, Ctrl+X.

Теперь изменим конфиг апача указав ему, какой сайт мы будем открывать на главной странице сервиса. Подробнее об этом расскажу в пятницу.

Что делаем:

nano /etc/apache2/sites-available/000-default.conf

И содержимое заменяем на:

<VirtualHost *:80>

    DocumentRoot /var/www/testproject/public
    <Directory /var/www/testproject/public>
        AllowOverride None
        Order Allow,Deny
        Allow from All

        <IfModule mod_rewrite.c>
            Options -MultiViews
            RewriteEngine On
            RewriteCond %{REQUEST_FILENAME} !-f
            RewriteRule ^(.*)$ index.php [QSA,L]
        </IfModule>
    </Directory>

    ErrorLog /var/log/apache2/symfony_error.log
    CustomLog /var/log/apache2/symfony_access.log combined
</VirtualHost>

Далее нажимаем опять Ctrl+O, Enter, Ctrl+X.

Затем нужно обновить конфигурацию для Apache, что делается командой:

a2enmod rewrite

И, после чего, перезагружаем web-сервер:

service apache2 restart

Теперь заходи в браузер, вбивай IP своего сервера и наслаждайся :)

Уфф, ман вышел длинный и очень информативный. Я рад, что мы успешно открыли серию больших и полезных уроков, которые будут прокладывать нам путь к вершинам backend-мастерства.

Увидимся завтра, друг.