Docker — обзор
Docker — это открытая платформа для разработки, доставки и запуска приложений. Docker обеспечивает быструю доставку вашего программного обеспечения, обеспечивая изоляцию между вашим приложением и инфраструктурой. Docker упаковывает и запускает все внутри слабо изолированной среды, называемой контейнером.
Ключевые термины
Образ — полный пакет, содержащий все (код приложения, необходимые библиотеки, программные зависимости, конфигурации и т. д.), необходимый для запуска вашего приложения (точно так же, как класс в ООП).
Контейнер — экземпляр изображения, как объект в ООП.
Объем — изображения доступны только для чтения, для сохранения данных необходимо использовать тома. Проще говоря, вы делитесь папкой (в хост-ОС) с вашим образом докера, чтобы читать/записывать данные из/в него.
Dockerfile — чертежи образа. Здесь вы определяете, что будет внутри изображения, которое вы пытаетесь создать. Например, ОС (например, Ubuntu 16), программное обеспечение (например, Node) и т. д.
Тег — пока просто рассмотрите его в буквальном смысле.
Я предполагаю, что у вас есть готовое приложение React, которое вы хотите контейнеризовать с помощью докера, если вы этого не сделаете, вы можете клонировать этот образец приложения React и следовать дальше.
Шаг 1: Установите Докер
Шаг 2: Подготовьте файлы конфигурации
Вам необходимо создать два файла конфигурации для:
- Nginx (веб-сервер)
- Docker (для создания образа Docker)
Nginx Файлы сборки React — это просто статические (HTML, CSS, JS и т. д.) файлы, и вам нужен веб-сервер для обслуживания ваших статических файлов, таких как Nginx, Apache, OpenLiteSpeed и т. д. Внутри вашего приложения React , создайте другой каталог и назовите его nginx
. Внутри каталога nginx (вы только что создали) создайте новый файл и назовите его nginx.conf
. Вы также можете использовать следующие команды (одну за другой, чтобы достичь этого).
cd my-app
mkdir nginx
cd nginx
touch nginx.conf
Отредактируйте файл «nginx.conf» и добавьте в него следующий код.
server {
listen 80;
location / {
root /usr/share/nginx/html;
index index.html index.htm;
# to redirect all the requests to index.html,
# useful when you are using react-router
try_files $uri /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
Суть этого блока кода заключается в том, что вы говорите Nginx прослушивать порт 80, перенаправлять каждый запрос на «index.html», а корнем является «/usr/share/nginx/html» (каталог, откуда обслуживаться) .
Dockerfile В каталоге вашего приложения создайте новый файл, назовите его Dockerfile.prod
и добавьте в него следующий код:
# stage1 - build react app first
FROM node:12.16.1-alpine3.9 as build
WORKDIR /app
ENV PATH /app/node_modules/.bin:$PATH
COPY ./package.json /app/
COPY ./yarn.lock /app/
RUN yarn
COPY . /app
RUN yarn build
# stage 2 - build the final image and copy the react build files
FROM nginx:1.17.8-alpine
COPY --from=build /app/build /usr/share/nginx/html
RUN rm /etc/nginx/conf.d/default.conf
COPY nginx/nginx.conf /etc/nginx/conf.d
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
Создайте новый файл и назовите его .dockerignore
и добавьте в него node_modules
. Это просто говорит Docker игнорировать каталог node_modules
.
Итак, ваша структура каталогов должна быть такой
my-app
│ Dockerfile.prod
│ .dockerignore
│
└───nginx
nginx.conf
Пояснение
Этап 1
- Используйте многоэтапную сборку Docker (поддерживается в Docker v17+).
FROM
указывает, какой базовый образ использовать (обязательно), вы можете посмотреть базовые образы в Docker Hub.WORKDIR
используется для указания рабочего каталога (внутри образа, а не вашей операционной системы)ENV PATH
добавляет node_modules в PATHCOPY
используется для копированияpackage.json
из текущего каталога (на хосте) в рабочий каталог (в образе).RUN
используется для запуска команды, здесь мы хотим запуститьYarn
для установки зависимостей, упомянутых в package.jsonCOPY
запускается снова, чтобы скопировать весь код из хост-ОС в рабочий каталог в образе.- Запустите
yarn build
, чтобы собрать наше приложение.
Сначала вы копируете package.json и устанавливаете зависимости, а не копируете node_modules
в образ. Это позволяет использовать превосходную систему кэширования Docker и сократить время сборки.
Этап 2
На первом этапе вы скопировали package.json в рабочий каталог, установили зависимости, скопировали свой код и собрали окончательные статические файлы. На этапе 2:
- Используйте
Nginx
в качестве базового изображения. (nginx
— это изображение, а1.17.8-alpine
— это тег. Это похоже на то, как вы говорите, какую конкретную версию/выпуск базового образа Nginx вы хотели бы использовать). - Скопируйте файлы сборки из этапа 1 в
/usr/share/nginx/html
(каталог по умолчанию, из которого обслуживается Nginx) - Удалите файл конфигурации Nginx по умолчанию, присутствующий в
/etc/nginx/conf.d/default.conf
. - Скопируйте файл конфигурации, который вы создали ранее, в образ докера.
- Используйте
EXPOSE
, чтобы открыть порт контейнера. Одна ошибка здесь заключается в том, что он на самом деле не раскрывает порт, а просто ради документации. - Запустите
Nginx
на переднем плане, а не как демон (т.е. в фоновом режиме).
И CMD
, и RUN
используются для запуска команд. Разница в том, что RUN
— это шаг сборки образа, тогда как CMD
— это команда, которую контейнер выполняет по умолчанию при запуске.
Шаг 3. Создайте изображение и пометьте тегом
В корневом каталоге вашего приложения выполните следующую команду, чтобы создать и пометить образ докера:
docker build -f Dockerfile.prod -t my-first-image:latest .
-f
используется для указания имени файла. Если вы не укажете его, вы должны переименовать свой файл вDockerfile
- это то, что команда сборки ищет в текущем каталоге по умолчанию.-t
используется для маркировки изображения. Вы можете пометить свое изображение так, как хотите (например, v1.0.0, v2.0.0, производство, последняя версия и т. д.)..
в конце важно, и его следует добавить, чтобы указать докеру использовать текущий каталог.
**Шаг 4. Запуск контейнера Последний шаг — запуск созданного образа (как контейнера) docker run -it -p 80:80 --rm my-first-image:latest
-it
для интерактивного режима-p
для открытия и привязки портов. Здесь мы открываем порт 80 контейнера и связываем его с портом 80 хост-компьютера. Первый относится к вашей машине (хост-ОС), а второй — к контейнеру образа докера. Например, если вы используете-p 1234:80
, вам нужно будет перейти наhttp://localhost:1234
в браузере.--rm
для удаления контейнера после его остановкиmy-first-image:latest
имя:тег изображения, контейнер которого мы хотим запустить
Теперь откройте браузер и перейдите к http://localhost
, и вы увидите, что ваше приложение обслуживается из докера. Если вы внесете какие-либо изменения в код приложения React, вам потребуется пересобрать образ (шаг 3) и запустить его снова (шаг 4).
Дополнительно
- Запустите
docker image ls
, чтобы увидеть список всех образов на вашем компьютере. - Запустите
docker container ls
, чтобы увидеть все запущенные контейнеры. - Запустите
docker system prune
, чтобы обрезать контейнеры (будьте осторожны при использовании этой команды, прочитайте документы для параметров перед их использованием) - Прочтите Руководство по началу работы с Docker
Первоначально опубликовано на dev.to
Подключаем:
Linkedin: https://www.linkedin.com/in/mubbashir10/
Твиттер: https://twitter.com/mubbashir100