В этой статье я объясню вам, как сделать с нуля приложение. Когда вы проверяете эту статью, поэтому я предполагаю, что у вас есть угловое приложение, которое вы хотите рассказать, и у вас могут быть одинаковые знания о Docker или, по крайней мере, слышали об этом.
В любом случае, что такое Docker?
Короче говоря, Docker — это инструмент DevOps с открытым исходным кодом, предназначенный для того, чтобы помочь разработчикам и операциям ребята оптимизировать разработку и развертывание приложений. Благодаря тому, что приложение означает развертывание и запуск приложения с использованием контейнеров. Контейнеры позволяют разработчику упаковать приложение со всеми необходимыми частями, такими как библиотеки и другие зависимости, и развернуть его в качестве одного пакета. Таким образом, приложение может быть развернуто в любой целевой среде/машине независимо от каких -либо индивидуальных настроек, которые может иметь машина, которые могут отличаться от машины, используемой для написания и тестирования кода. Таким образом, удаление вопросов развертывания, возникающих из -за различного несоответствия спецификации окружающей среды. Чтобы узнать больше о Docker Checkout Это Ссылка Анкет
Предпосылка
- Во -первых, нам нужно установить Docker на нашей машине, чтобы мы могли создать изображение Docker и запустить контейнеры Docker. Есть разные установки для Mac и Windows. Для Windows 10 Professional и Enterprise установить Docker для настольного компьютера с этого связь Но если у вас есть Home Edition Windows 10, как и у меня, вам придется установить Docker Toolbox из этого Ссылка Анкет
- Нам также необходимо иметь аккаунт в реестре Docker Hub, чтобы мы могли вытащить и нажать изображения Docker. Это бесплатно Так что, если у вас уже нет ни одного, проверьте это Ссылка создать один для себя.
- Наконец, нам нужно угловое применение, которое мы хотим докеризировать. Так что, если у вас уже есть тот, который великолепен, но если вы этого не сделаете, то вы можете получить код углового приложения, который я использую в этой статье из моего репозитория GitHub из этого связь .
Начать…
Чтобы рассказать наше угловое приложение, нам нужно выполнить следующие шаги.
- Запустите машину Docker.
- Создайте DockerFile в нашей папке Angular App.
- Создайте изображение Docker из Dockerfile.
- И, наконец, запустите угловое приложение в контейнере, используя изображение Docker.
Итак, начнем …
Запустить Docker Machine
Docker Machine-это небольшая виртуальная машина Linux, которая размещает двигатель Docker, который является клиентским приложением, состоит из Docker Daemon и Docker CLI, который взаимодействует с Docker Daemon для создания изображений Docker или запущенных контейнеров и т. Д.
- В случае, если вы установили Docker Desktop для окна или Mac, когда установка заканчивается, Docker Machine запущен автоматически. Изображение кита в области уведомления указывает, что Docker работает и доступен из терминала.
- Если у вас установлен Docker Toolbox, то есть 2 способа создать машину Docker локально.
- Дважды щелкнув значок клеммы быстрого запуска Docker на рабочем столе.
- Использование команды Docker-Machine CLI «Создать» для создания новой машины Docker.
Поскольку у меня установлен Docker Toolbox, я выберу простой путь и нажмите на значок клеммы быстрого запуска, который откроет терминал и запустит машину Docker.
Вы можете запустить следующую команду Docker-Machine CLI, чтобы проверить детали машины Docker и отметить URL-адрес, который мы будем использовать для открытия нашего углового приложения в браузере.
$ Docker-Machine LS
Вы можете сделать гораздо больше с командами CLI Docker-Machine, такими как Create, Kill, Start, Stop Docker Machine и многое другое, но это не в масштабе для этой статьи, как бы вы ни вы можете выпустить Docker.com Для полной документации по CLI Docker-Machine, а также Docker CLI также. Сейчас наша настройка Docker работает сейчас, мы сосредоточимся на создании DockerFile для нашего углового приложения.
Создайте Dockerfile
Теперь в каталоге изменения терминала в папку Angular App и создайте имя файла «DockerFile» без какого -либо расширения файла, используя любой редактор DEV, такой как код VS, или просто используйте блокнот. Напишите следующие инструкции в Dockerfile и сохраните его.
# Stage 1 FROM node:10-alpine as build-step RUN mkdir -p /app WORKDIR /app COPY package.json /app RUN npm install COPY . /app RUN npm run build --prod # Stage 2 FROM nginx:1.17.1-alpine COPY --from=build-step /app/docs /usr/share/nginx/html
Объяснение
- На этапе 1 мы копируем код нашего приложения в папке «Приложение» и установку зависимости приложений из файла package.json и создавать производственную сборку с использованием изображения узла.
- На этапе 2 мы используем изображение Nginx Server для создания сервера Nginx и развернуть на нем наше приложение, копируя элементы сборки из /app/docs на сервер Nginx AT /usr/share/nginx/html место нахождения. Примечание — если вы используете свое угловое приложение, замените Документы с dist/ В DockerFile, потому что по умолчанию элементы сборки создаются в этом месте. В моем случае я изменил это на Документы Папка в настройке outputpath файла angular.json в моем приложении.
Создать .dockerignore file
Хотя нет необходимости иметь этот файл, но это хорошая практика, поскольку он может ускорить процесс сборки изображения, а также сохранить изображение наклоняться, исключая ненужный код из контекста сборки Docker, чтобы оно не попадало в изображение Анкет Так что именно так, как мы создали DockerFile в том же месте, которое мы создаем.
.git .firebase .editorconfig /node_modules /e2e /docs .gitignore *.zip *.md
Создайте изображение Docker
Теперь запустите команду Docker Build, чтобы создать изображение Docker нашего приложения, используя DockerFile, которую мы только что создали. Обратите внимание, что я дал Sanjaysaini2000/Angular-App в качестве имени на моем изображении Docker, но вы должны заменить его на имя, которое вы хотите дать на изображение Docker вашего приложения. Также обратите внимание, что имя изображения должно сопровождаться точкой, что означает, что путь контекста построения докера и Dockerfile является текущей папкой.
$ Docker Build -t Sanjaysaini2000/Angular -App.
Этот процесс займет 1-2 минуты, и в конце вы получите успешное сообщение с именем тега изображения.
Вы можете запустить следующую команду Docker, чтобы перечислить изображения, созданные вместе с вашим угловым изображением приложения. Вы также найдете изображения Node и Nginx, которые мы использовали для создания изображения приложения и промежуточного изображения
$ Docker Images
Запустите контейнер Docker
Наконец -то запустите следующую команду в терминале, чтобы запустить ваше угловое приложение в контейнере Docker, и обязательно замените Sanjaysaini2000/Angular-App с именем изображения в этой команде.
$ docker run -d -p 80: 80/tcp -ingular -app sanjaysaini2000/angular -app: самый последний
По сути, мы хотим создать и запустить интерактивный контейнер в фоновом режиме, поэтому мы использовали параметры –d и –it с командой Docker Run. Поскольку приложение в контейнере доступно в порту 80 Таким образом, мы использовали опцию –p и отобразите порт контейнера на внешний хост-порт, используя 80: 80/TCP и назовите наш контейнер, используя опцию-name на Angular-App, за которым следует имя изображения.
Теперь откройте браузер и тип URL http://
Вы успешно проделали и размещали Angular App в контейнере Docker.
Это изображение Docker также доступно в моем реестре Docker Hub. Вы можете получить это от моего Angular-App Репозиторий, если вы не хотите проходить процесс выше, и заинтересованы только в запуске этого углового приложения в контейнере Docker.
Надеюсь, вам понравилась эта статья … ура !!!
Пост Как сделать приложение для рассмотрения? появился первым на Технологический мир Санджая Сайни Анкет
Оригинал: «https://dev.to/sanjaysaini2000/how-to-dockerize-angular-app-3780»