Некоторое время назад (уже довольно давно, на самом деле) довелось мне оценить прелесть генераторов статических сайтов. Я перевел этот блог на Jekyll, в паре собственных проектов использовал Middleman, но заморачиваться с деплоем толком не приходилось: блог хостится на гитхабе и деплоится через git push, а проекты на Мидлмене я после билда просто забрасываю на хостинг по FTP. Но вот пришла в голову мысль, что деплой статических сайтов не может быть сложнее, чем деплой рельс, и я решил собрать инструкцию по тому, как деплоить статические сайты на Jekyll и Middleman. Это первая статья из трех, тут мы поставим и настроим nginx.
Статьи серии:
- Часть первая - настройка сервера (эта статья)
- Часть вторая - деплой Jekyll
- Часть третья - деплой Middleman
Во-первых, нам понадобится сервер. Я уже некоторое время для экспериментов использую Vscale, wannabe-digitalocean от известного хостера Selectel. Вот реферальная ссылка, по которой можно получить бонус в 400р на счет - самое оно поиграться, учитывая, что минимальный VPS (20gb памяти и 512mb оперативной) стоит всего 200р. Если потратите еще 400 сверху - я получу бонус 400р уже на свой счет и скажу вам спасибо.
Шаг первый: создаем необходимые директории
Так вот, сервер. Создаем сервер, где вам удобно, логинимся в него под своим пользователем и ставим nginx:
sudo apt-get update
sudo apt-get install nginx
Я предлагаю хранить проекты по стандартному пути - в директории /var/www. В ней мы создадим пару дочерних директорий для наших проектов. Я говорю “проектов”, поскольку предлагаю рассмотреть деплой хотя бы двух статических сайтов и соответствующую настройку nginx для этих целей. Такую схему можно повторять сколько угодно раз, пока у вас не закончится место на сервере, а поскольку статические сайты не требуют веб-сервера для своей работы, то и нагрузку оказывать будут минимальную даже при приличной посещаемости.
Итак, создаем директории под наши проекты:
sudo mkdir -p /var/www/first.com/html
sudo mkdir -p /var/www/second.com/html
Опция -p, переданная команде mkdir, создает все необходимые директории, даже если каких-то из них не существует.
Теперь установим прака на доступ к этим директориям для нашего пользователя. Используем переменную $USER, чтобы подставить текущего пользователя:
sudo chown -R $USER:$USER /var/www/first.com/html
sudo chown -R $USER:$USER /var/www/second.com/html
Для надежности выполним еще одну команду - чтобы быть уверенными, что наша корневая папка с проектами будет нам доступна:
sudo chmod -R 755 /var/www
Шаг второй: создаем файлы-заглушки
Замечательно, теперь сделаем две простенькие страницы-заглушки для наших проектов - просто чтобы видеть, что все работает как нужно.
Создайте файл для первого проекта:
vi /var/www/first.com/html/index.html
и напишите туда, скажем, это:
this is our first project
Закройте файл (напоминаю, :wq в vim) и создайте файл для второго проекта:
vi /var/www/second.com/html/index.html
В нем будет такой текст:
this is our second project
Закроем файл.
Шаг третий: настраиваем хосты в nginx
Теперь пора настроить nginx таким образом, чтобы он мог обслуживать несколько разных доменов и корректно отображать соответствующие проекты, когда их запрашивают. Скопируем стандартный конфиг для нашего первого файла:
sudo cp /etc/nginx/sites-available/default /etc/nginx/sites-available/first.com
Откройте созданный файл командой vi /etc/nginx/sites-available/first.com и загляните внутрь. Внутри, если игнорировать комментарии, вы увидите вот такой конфиг:
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /usr/share/nginx/html;
index index.html index.htm;
server_name localhost;
location / {
try_files $uri $uri/ =404;
}
}
Нам нужно изменить в нем пару строк таким образом, чтобы в тот момент, когда пользователь вводит в адресную строку браузера first.com и нажимает Enter, наш сервер отображал проект, расположенный в директории /var/www/first.com/html. Во-первых, отредактируем третью строку нашего конфига так, чтобы она содержала путь к проекту:
root /var/www/first.com/html
Так же отредактируем пятую строку, начинающуся с server_name:
server_name first.com www.first.com;
Теперь конфиг для нашего первого проекта должен выглядеть примерно так:
server {
listen 80 default_server;
listen [::]:80 default_server ipv6only=on;
root /var/www/first.com/html;
index index.html index.htm;
server_name first.com www.first.com;
location / {
try_files $uri $uri/ =404;
}
}
Здесь мы на секунду остановимся. Важно знать, что мы можем иметь опцию default_server только для одного из наших проектов. Настройки всех последующих проектов не должны её содержать, ниже я покажу, как они будут выглядеть.
Чтобы не заморачиваться второй раз со стандартным конфигом, скопируем наш первый:
sudo cp /etc/nginx/sites-available/first.com /etc/nginx/sites-available/second.com
Откроем его: vi /etc/nginx/sites-available/second.com
И отредактируем, чтобы он выглядел примерно вот так:
server {
listen 80;
listen [::]:80;
root /var/www/second.com/html;
index index.html index.htm;
server_name second.com www.second.com;
location / {
try_files $uri $uri/ =404;
}
}
Обратите внимание на первые строки конфига: мы убрали из них default_server. Если вы решите добавить на ваш сервер еще несколько проектов, берите за основу второй конфиг и вносите в него необходимые правки.
Ну вот, с настройкой конфигураций для наших проектов мы закончили.
Шаг четвертый: включаем виртуальные хосты
Осталось совсем немного. Чтобы nginx смог обслуживать наши проекты, нам нужно скопировать созданные конфиги в директорию /etc/nginx/sites-enabled. Однако, мы поступим умнее и просто создадим символические ссылки на наши файлы, чтобы нам не пришлось хранить два набора конфигов:
sudo ln -s /etc/nginx/sites-available/first.com /etc/nginx/sites-enabled/
sudo ln -s /etc/nginx/sites-available/second.com /etc/nginx/sites-enabled/
Чудесно, теперь nginx при запуске сможет прочитать конфиги, как если бы они лежали в /etc/nginx/sites-enabled. Поскольку стандартный конфиг нам больше не понадобится, мы можем его удалить:
sudo rm /etc/nginx/sites-enabled/default
Осталось внести маленькую правку в конфиг nginx. Откройте его командой
vi /etc/nginx/nginx.conf
Найдите строку # server_names_hash_bucket_size 64; и удалить перед ней решетку комментария. Это необходимо для того, чтобы nginx мог корректно работать с длинными доменными именами. Сохраните файл и перезапустите nginx:
sudo service nginx restart
Шаг пятый, необязательный: редактируем локальный список хостов
Если вы на Linux или OS X, то нужный вам файл располагается здесь: /etc/hosts, если же вы все еще на Windows, то откройте файл C:\Windows\System32\drivers\etc\hosts. Добавьте в его конец две строки:
111.111.111.111 example.com
111.111.111.111 test.com
Не забудьте заменить 111.111.111.111 на ip-адрес вашего сервера. Сохраните файл (это потребует прав администратора) и откройте в браузере http://first.com. Вы должны увидеть следующий текст:
this is our first project
Если вы увидели созданную вами в самом начале страницу, то поздравляю, у вас все получилось! Если нет, вернитесь назад и поищите, где же вы были невнимательным (со мной это постоянно случается). Таким же образом проверьте второй хост, перейдя в браузере по адресу http://second.com. Здесь вы должны увидеть текст:
this is our second project
Еще раз: если у вас что-то пошло не так, то вернитесь и проверьте, все ли вы действия выполнили и выполнили ли вы их правильно.
Мы отредактировали локальный файл hosts, чтобы увидеть, правильно ли работает написанный нами конфиг. Не забудьте вернуть его к первозданному виду, когда закончите эксперименты. Чтобы иметь нормальный доступ к проектам и позволить посещать их другим пользователям, приобретите и настройте домен. Я давно покупаю домены на NameCheap, даже в долларах они стоят зачастую дешевле, чем у российских регистраторов. А прямо сейчас у них акция на домены в зоне .club - первый год за 88 центов. Позднее я, возможно, расскажу о том, как управляю своими доменами.
На этом первая серия завершена, в следующей я расскажу, как при помощи git задеплоить проект на Jekyll.