Руководство для начинающих по развертыванию приложения Angular 2 на Amazon S3.

Шаг №1 - Создайте новое приложение Angular с помощью angular-cli

Прежде всего, вам понадобится приложение Angular (если у вас его нет).
Установите angular-cli с помощью npm:

npm install -g @angular/cli

После успешной установки создайте новый проект:

ng new cloud_project

Это установит все зависимости и все, что вам нужно (это займет некоторое время).

Ok! У нас есть проект. Создана новая папка проекта, содержащая все необходимые нам файлы. Теперь мы можем запустить наше новое приложение с помощью:

cd cloud_project
ng serve

Посетите свой localhost: 4200 в браузере. Работает. Прохладный.

Шаг № 2 - Создайте свое приложение

Angular CLI поставляется с конструктором модулей Webpack. К счастью, нам это и нужно. :) Чтобы собрать приложение, запустите это:

ng build --prod --aot

После этого создается новая папка dist, в которой находятся связанные файлы.

Шаг № 3 - Зарегистрируйтесь в Amazon AWS

Вам необходимо зарегистрировать новую учетную запись AWS, если у вас ее еще нет.
https://aws.amazon.com/

Если вы новый пользователь, первый год будет совершенно бесплатно. Через год это будет просто дешево.

Шаг # 4 - Настройте ведро

Войдите в Консоль AWS!

Создайте новое ведро! (Хорошее облако с соглашением об именах может выглядеть так: cloud.szilagyiabo.com) Мы загрузим нашу папку dist сюда.

Вам необходимо немного настроить сегмент.
Первым делом: Включите статический хостинг веб-сайтов
Индексирующий документ: index.html
Ошибка документ: error.html

Вам также понадобятся ключ доступа и электронный ключ. Для его создания перейдите по этой ссылке. Их спросят позже.

Шаг № 5 - Управление вашим доменом

Вам необходимо добавить новое CName на своем сайте управления доменом (я использую GoDaddy).
Имя хоста: cloud.szilagyiabo.com
Указывает на: cloud.szilagyiabo.com.s3-website.eu-central- 1.amazonaws.com
Время жизни: 1/2 часа

Шаг № 6 - Загрузите файлы в корзину

Если вы хотите автоматизировать процесс развертывания, настоятельно рекомендуется написать небольшой скрипт, который сделает всю тяжелую работу.

Во-первых, нам понадобится инструмент под названием AWS CLI. Давайте установим его через pip:

pip install awscli

Далее нам нужно настроить его:

aws configure

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

После этого мы можем написать наш сценарий развертывания и запустить его. Скрипт deploy.sh будет выглядеть так:

#/bin/bash
#upload files
aws s3 cp ./dist s3://BUCKETNAME --recursive --acl public-read

Очевидно, вам нужно изменить имя корзины. :)

И все.

Результат: http://cloud.szilagyiabo.com/

Если у вас есть вопросы, оставьте комментарий или найдите меня в социальных сетях!

Ознакомьтесь с моей следующей статьей об Автоматическом развертывании в облаке AWS.

Если вы хотите узнать о нас больше, посетите наш сайт или подпишитесь на нас в Instagram.

Соавтор статьи: @ tbela9111

@szilagyiabo