Статьи

Использование Raspberry Pi в качестве сервера разработки

Июнь 11, 2017

В этом уроке я покажу вам, как настроить Raspberry Pi 4 в качестве сервера разработки (или тестирования). Вы можете использовать это как место, чтобы протолкнуть ваш код и проверить его в веб-браузере. Для демонстрации я буду использовать приложение React, но с помощью нескольких модификаций вы сможете с его помощью собрать практически все.

Для этого проекта я использую Canakit Raspberry Pi 4 Complete Kit . Это дает вам все необходимое для работы, включая чехол, блок питания и SD-карту.

Зачем беспокоиться?

Надежная среда разработки важна. Вам нужно место, где вы можете посмотреть на свое приложение, чтобы убедиться, что оно работает нормально. Много раз люди делают это на своей локальной машине. Лучше тестировать на отдельной машине, чем вы работаете. Таким образом, вы можете поймать такие вещи, как зависимости и изменения конфигурации.

Этот сервер разработки / тестирования имеет следующие преимущества:

  • Конфигурация и среда, которая соответствует производственной (если у вас есть хост Linux)
  • Создайте код на любом компьютере и отправьте его в централизованное место
  • Непрерывная интеграция — нажмите и обновите в своем браузере

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

  1. Разработайте свой код локально и передайте его.
  2. Нажимайте на разработку и тестируйте ее
  3. Утвердить изменения, запустить

Это обеспечивает отличный рабочий процесс, в котором вы можете вносить изменения и редактировать, фиксировать, затем нажимать их и обновлять свой браузер. Затем вы можете разработать свой код с любой машины в сети, в которой есть git. Как только вы будете удовлетворены изменениями, вы можете скопировать артефакты в производство. Фактически, вы можете интегрировать производственные процессы в этот рабочий процесс, чтобы сделать все это автоматически.

Настройка Pi в качестве сервера

Для этого проекта я использую полный набор Canakit Raspberry Pi . Он поставляется со всем, что вам нужно. Я не буду настраивать это в этой статье, но должен отметить, что я использую образ сервера Ubuntu для этого проекта и рекомендую вам сделать то же самое.

Я использовал свой Pinebook Pro для записи изображения на карту, но вы можете сделать это в Windows или на Mac, если вам нужно.

Вот хорошее руководство по настройке одного из этих наборов.

Мы настроим это как сервер разработки / тестирования и будем использовать GIT для связи с ним. Итак, вот что мы будем делать:

  • Настройте Git для публикации
  • Установить Nginx
  • Установить NPM
  • Создайте развертывание из репозитория на своем компьютере на веб-сервере Raspberry Pi за один шаг.

Когда мы закончим, мы можем изменить наше приложение React и отправить изменения в Pi, чтобы просмотреть их как веб-страницу.

1. Настройте Git для публикации

Для начала нам нужно установить Git.

 sudo apt install git 

Теперь нам нужно добавить git shell в / etc / shells

 which git-shell 

и мы добавим этот вывод в / etc / shells

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

 sudo adduser --disabled-password git 

Переключиться на пользователя git

 sudo su git 

перейти на дом пользователей git

 cd ~ 

создайте каталог для файлов ssh:

mkdir ~/.ssh && chmod 700 ~/.ssh  

Затем мы создадим наш файл author_keys

 touch ~/.ssh/authorized_keys && chmod 600 ~/.ssh/authorized_keys

Теперь вы можете добавить открытые ключи любой машины, к которой вы хотите получить доступ к серверу, добавив их в:

 /home/git/.ssh/authorized_keys  

Тогда мы установим оболочку пользователей git на git-shell 

 sudo chsh git -s $(which git-shell)

Создайте папку для наших файлов www, которые мы будем обслуживать позже: 

 mkdir ~/www  

2. Создайте нашу папку проекта

Это удаленный репозиторий, настроенный таким образом, что мы можем работать над проектом на любой другой машине, а затем отправить его на Raspberry Pi.

cd ~  
mkdir /home/git/react-hello-world.git

Теперь давайте начнем: 

 cd react-hello-world.git && git init --bare 

Давайте вернемся к нашей машине и протестируем ее.

На компьютере разработчика введите:

git clone git@[your IP address]:react-hello-world .

Вы должны быть в состоянии клонировать его на свой локальный компьютер.

Если это сработает, мы вернемся к Raspberry Pi.

3. Установите Nginx

Расположение: на Raspberry Pi

Далее мы установим Nginx на наш Raspberry pi и используем его для обслуживания веб-страниц.

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

 sudo apt install nginx

Это установит Nginx.

Вам может понадобиться добавить исключение брандмауэра в UFW. Вы можете получить список доступных профилей, набрав:

 sudo ufw app list

Вы можете добавить исключение с помощью:

 sudo ufw allow 'Nginx HTTP'

 Теперь, когда вы откроете IP-адрес в веб-браузере, вы увидите страницу приветствия Nginx.

Теперь у вас есть сервер Nginx, запущенный и работающий.

4. Настройте Nginx

Расположение: на Raspberry Pi

Далее мы изменим конфиг Nginx.

Сделайте копию конфигурации по умолчанию в вашей домашней папке в качестве резервной копии:

sudo cp /etc/Nginx/sites-available/default ~

Отредактируйте файл conf и добавьте в папку www, которую мы создали ранее. 

sudo vim /etc/Nginx/sites-available/default 

Найдите «root» и измените значение по умолчанию на нашу папку www:

Затем сохраните файл и перезагрузите Nginx.

sudo systemctl reload Nginx

Теперь вы обслуживаете файлы из папки www вместо git. Здесь мы публикуем файлы после фиксации.

Давайте вернемся к нашей машине разработчика.

5. Настройте наш реактивный проект

Расположение: на вашем компьютере разработчика

Мы создадим проект React и развернем его на нашем Pi. Итак, давайте настроим это.

Сначала мы удалим репо, который мы клонировали ранее.

rm -rf react-hello-world/

И мы будем использовать React CLI для создания приложения с таким же именем. 

npx create-react-app react-hello-world

Теперь мы создали базовый проект React. Затем инициализируйте его как репозиторий git.

git init

Мы добавим наши существующие файлы и зафиксируем их. 

git add .

git commit -m "Our first commit"

Мы установим пульт на наш Raspberry Pi. Мы установили это, поэтому, когда мы передадим его на удаленный компьютер, файлы перейдут на наш Raspberry Pi. 

git remote add origin git@[Your IP Address]:

react-hello-world.git

И мы подтолкнем его к Raspberry Pi:

git push --set-upstream origin master

Если вы зайдете в Pi, вы увидите репозиторий в вашей папке activ-hello-world.git:

Теперь, когда у нас есть эта настройка, мы должны настроить Pi для создания вашего приложения React.

6. Настройте сервер для сборки

Расположение: на Raspberry Pi

У нас настроен удаленный репозиторий git и установлен Nginx, но нам нужно связать все это вместе. Нам нужно построить наше приложение.

Теперь нам нужно установить Node и NPM на Raspberry Pi, чтобы начать.

curl -sL https://deb.nodesource.com/setup_10.x | sudo -E bash -

sudo apt install nodejs

Вы можете проверить, что они установлены, введя: 

node --version

npm --version 

Теперь у нас есть узел и работает.

7. Настройка Реакция на сборку

Расположение: на Raspberry Pi

Давайте создадим наше приложение React на Raspberry Pi, просто чтобы протестировать его.

Проверьте репо на месте:

cd ~ && git clone react-hello-world.git/ test

Затем мы установим активные и реактивные скрипты (-g делает их глобальными) 

npm install react -g

npm install react-scripts -g

Если мы бежим:

npm run-scripts build

Мы можем видеть это построено правильно.

Как только мы узнаем, что можем создать приложение React вручную, мы можем его автоматизировать.

8. Связывая все вместе

Расположение: на Raspberry Pi

Теперь нам нужно скопировать эти файлы в нашу папку www. Мы хотим делать это автоматически каждый раз, когда отправляемся в git-репо.

Убедитесь, что вы находитесь в своей удаленной папке git на Raspberry Pi (для меня это /home/git/react-hello-world.git/)

И создайте новый файл:

vim hooks/post-receive 

Добавьте это в файл:


Простой текст