WebDesign Master WebDesign Master

Уроки создания сайтов

Rsync - молниеносный деплой средних и крупных проектов (gulp-rsync)
13 06/2017

Инструменты Rsync - молниеносный деплой средних и крупных проектов (gulp-rsync)

Всех приветствую! Сегодня мы рассмотрим настройку Gulp-проекта для быстрого деплоя изменённых файлов на рабочий хостинг или сервер в системе MacOS и Windows на примере реального сайта. Научимся создавать публичные SSH ключи для быстрого доступа к серверу по SSH и настроим подсистему Ubuntu в Windows 10 для работы с rsync.

Поделиться
Твитнуть
Поделиться
Класснуть
Плюсануть
Запинить
Смотреть урок на YouTube
Внимание! Данный материал требует установленных инструментов Node.js и Gulp.
Если у вас возникли вопросы или проблемы, обратитесь к руководству Gulp для самых маленьких, в котором подробно объясняется, что такое Gulp и как с ним работать.

1. Настройка gulp-rsync в MacOS и Linux

1.1 Настройка Gulp таска

Настройка gulp-rsync в системах MacOS и Linux довольно проста и заключается в выполнении нескольких несложных инструкций.

Для начала убедитесь, что у вас установлена последняя стабильная версия Node.js и установлен gulp глобально.

Подключите к вашему Gulp-проекту rsync:

npm i gulp-rsync gulp --save-dev

И создайте новый таск "deploy"

var gulp  = require('gulp'),
		rsync = require('gulp-rsync');

gulp.task('deploy', ['deploy'],function() {
	return gulp.src('yousite/**')
	.pipe(rsync({
		root: 'yousite/',
		hostname: 'sshusername@yousite.com',
		destination: 'yousite/public_html/',
		archive: true,
		silent: false,
		compress: true
	}));
});

1.2 Настройка SSH Аутентификации по открытому ключу

Генерация ключа на локальном компьютере:

Создайте директорию для SSH, в том случае, если она ещё не создана (знак доллара копировать не нужно):

$ mkdir -p ~/.ssh
$ chmod 700 ~/.ssh

Зайдите в созданную папку и сгенерируйте ключ (на все вопросы - жмём Enter):

$ cd ~/.ssh
$ ssh-keygen

Скопируйте получившийся ключ id_rsa.pub на ваш хостинг или сервер:

$ scp -p id_rsa.pub sshusername@yousite.com:~

Подключитесь к удалённому серверу для внесения нового ключа в authorized_keys:

$ ssh sshusername@yousite.com
Password:

Если директория ещё не существует, создайте её и установите соответствующие права:

RemoteServer~$ mkdir -p ~/.ssh
RemoteServer~$ chmod 700 ~/.ssh

Скопируйте сгенерированный ключ в специальный файл доступа 'authorized_keys' и установите на него безопасные права:

RemoteServer~$ cat id_rsa.pub >> ~/.ssh/authorized_keys
RemoteServer~$ chmod 600 ~/.ssh/authorized_keys

Удалите скопированный в корень вашего пользователя ключ, который уже добавили в общий файл и завершите вашу сессию командой logout:

RemoteServer~$ rm -f ~/id_rsa.pub
RemoteServer~$ logout

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

$ ssh-add

Если вы не получили сообщения вида "Identity added: /home/user/.ssh/id_rsa (/home/user/.ssh/id_rsa)", а получили оведомление вроде такого: "Could not open a connection to your authentication agent.", то следует запустить агента командой eval:

$ eval `ssh-agent -s`

И заново запустите ssh-add. Теперь вы можете пользоваться SSH на вашем компьютере, а в том числе и rsync, который использует SSH без авторизации в автоматическом режиме. Попробуйте подключиться снова к вашему серверу по SSH и убедитесь, что от вас не требуется ввести пароль. В противном случае, если пароль всё-таки требуется ввести, повторите процедуру получения SSH ключа заново.

2. Настройка gulp-rsync в Windows

2.1 Установка и настройка подсистемы Linux в Windows

Обратите внимание, что подсистема Linux, необходимая для работы rsync доступна только в Windows 10.

Для установки подсистемы Linux в Windows 10 откройте "Параметры Windows" > "Обновление и безопасность" > "Для разработчиков".

Windows установка Ubuntu - Обновление и безопасность

И выберие опцию "Режим разработчика":

Windows 10 - Режим разработчика

Далее переходим в Панель управления, выбираем пункт "Программы и компоненты", на панели слева выбираем "Включение или отключение компонентов Windows".

В новом окне устанавливаем чекбокс рядом с "Подсистема Windows для Linux":

Linux в Windows

После перезагрузки компьютера откройте окно PowerShell от имени администратора и выполните следующую команду:

$ Enable-WindowsOptionalFeature -Online -FeatureName Microsoft-Windows-Subsystem-Linux

Теперь мы можем работать с файловой системой нашего проекта через bash.

2.2 Установка в подсистеме Linux Node.js последнего стабильного релиза

Далее установим свежий стабильный Node.js и Gulp. Откройте Командную строку или PowerShell, введите команду bash и установите:

$ cd ~
$ curl -sL https://deb.nodesource.com/setup_6.x -o nodesource_setup.sh

Здесь _6.x - первая цифра последнего стабильного релиза. Её можно узнать на сайте Nodejs.

Далее выполним команду:

$ sudo bash nodesource_setup.sh

И установим Node.js:

$ sudo apt-get install nodejs

После этого установите Gulp глобально в вашей Linux подсистеме ($ npm i -g gulp) и установите все пакеты проекта ($ npm i), который мы подготовили ранее.

Внимание! Данная статья является текстово-информационной частью видео "Rsync - молниеносный деплой средних и крупных проектов (gulp-rsync)", полная информация по созданию нового Gulp проекта и все видеоинструкции вы можете найти только в нём.

Премиум уроки от WebDesign Master:

Курс по созданию интернет-магазина на OpenCart

Создание современного интернет-магазина от А до Я

Создание сайта и заработок на нем

Создание контентного сайта на Jekyll от А до Я

Куср по фрилансу

Я - фрилансер! - Руководство успешного фрилансера

  • HTML и CSS
  • WordPress
  • Веб-дизайн
  • Иллюстрации и Инфографика
  • Инструменты
  • Адаптивный веб-дизайн
  • JavaScript
  • jQuery
  • MODx
  • Интерфейсы UI/UX
  • Создание иконок
  • Обработка изображений
  • Прототипирование
  • Оффтоп
Создание сайта на WordPress
2019 © WebDesign Master