Переход на бессерверные решения с помощью React и AWS Amplify: настройка среды разработки

Согласно с википедия, бессерверные вычисления — это модель выполнения облачных вычислений, в которой облачный провайдер выступает в роли сервера, динамически управляя распределением машинных ресурсов. Обычно это означает, что вы можете в одиночку создавать готовые к работе приложения, сосредоточившись на кодировании бизнес-логики и возложив задачу подготовки серверов, масштабирования или обновления серверов и других функций на облачных провайдеров или сторонних поставщиков услуг. Вы можете использовать это для создания практически любого типа приложения или серверной службы, и все, что необходимо для запуска и масштабирования вашего приложения с высокой доступностью, обрабатывается за вас.

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

Что я узнаю, читая это?

Этот пост и другие, которые появятся в ближайшем будущем, предназначены для того, чтобы научить вас создавать приложения React, используя бессерверную архитектуру и различные АМС Сервисы. Мы рассмотрим такие области, как аутентификация, создание и использование REST API, аналитика и хостинг. И все это при использовании услуг одного облачного провайдера. Мы будем работать с АМС Усилениекоторый предоставляет инструменты CLI и компонент пользовательского интерфейса, упрощающие создание бессерверных приложений на AWS.

В этом посте я покажу вам, как настроить среду разработки для работы с AWS. Это будет основой для будущих постов в этой серии.

АМС Усиление — это библиотека, которая предоставляет вам инструменты для создания бессерверных приложений. С его помощью интеграцию различных сервисов AWS с вашим приложением можно выполнить всего за несколько строк кода. Вы также получаете компоненты пользовательского интерфейса для ускорения разработки. Чтобы использовать любые сервисы AWS или библиотеку Amplify, вам потребуется учетная запись AWS. Если у вас его нет, вы можете зарегистрироваться в настоящее время. Регистрация дает вам немедленный доступ к уровню бесплатного пользования AWS без предварительной оплаты.

Установите и настройте Amplify CLI

Amplify CLI — это инструмент, который позволяет создавать и настраивать сервисы AWS для вашего приложения. Его цель — упростить для вас разработку мобильных и веб-приложений. CLI использует AWS CloudFormation и вложенные стеки, которые позволяют добавлять или изменять конфигурации локально, прежде чем отправлять их для выполнения в облаке.

Для использования интерфейса командной строки вам необходимо установить Node.js (версия 8.11 или выше) и npm (версия 5 или выше). Если они у вас не установлены, посетите Страница загрузки Node.js. Установка узла также даст вам npm, но если у вас установлен только узел, вы также можете скачать нпм отдельно.

Установите CLI, запустив npm install -g @aws-amplify/cli в командной строке. Не используйте пряжу для установки интерфейса командной строки, так как у него есть известные проблемы. После установки Amplify CLI вам нужно будет настроить его, указав необходимые учетные данные AWS и регион. Следуйте приведенным ниже инструкциям, чтобы настроить интерфейс командной строки.

  1. Откройте командную строку и выполните команду amplify configure. В вашем браузере откроется консоль AWS, и если вы еще не вошли в систему, вам потребуется войти в свою учетную запись.
  2. После входа вернитесь в командную строку и нажмите Enter.
  3. Вам будет предложено выбрать регион AWS. Выберите один и нажмите Enter.
  4. Затем вы получаете возможность указать имя пользователя нового пользователя AWS IAM (управление идентификацией и доступом) для использования с интерфейсом командной строки. Введите имя пользователя и нажмите Enter. Когда вы нажимаете ввод, открывается ваш браузер и вы переходите на панель инструментов IAM в консоли AWS.
  5. На панели инструментов IAM вас попросят создать нового пользователя. Поле имени пользователя предварительно заполнено именем пользователя, которое вы ввели в консоли, а Programmatic Access выбран тип доступа. Нажмите Next: Permissions кнопку для перехода на следующую страницу.
  6. Оставьте выбранным по умолчанию Administrator Access политика и нажмите Next: Review кнопка.
  7. Нажмите Create User кнопка для создания пользователя. Когда пользователь будет создан, вам будет предоставлен Идентификатор ключа доступа и Секретный ключ доступа. Сохраните эту информацию, потому что она понадобится вам для настройки CLI.
  8. Вернитесь в командную строку и нажмите Enter.
  9. Это подскажет вам Идентификатор ключа доступа. Скопируйте и вставьте значение, затем нажмите Enter.
  10. Другая подсказка показывает запрос на Секретный ключ доступа. Скопируйте и вставьте значение, затем нажмите Enter.
  11. Теперь вас спросят, хотите ли вы создать или обновить профиль AWS на локальном компьютере. Мы будем использовать значение по умолчанию для этого профиля. Нажмите Enter, чтобы выбрать значение по умолчанию и создать свой профиль AWS.

усилить-configure.gif

Создайте приложение React

Теперь, когда Amplify CLI настроен, мы можем приступить к созданию приложения React. Мы загрузим приложение React с помощью Создать React-приложение. Это позволяет нам сосредоточиться на написании кода и не беспокоиться о настройке Babel и Webpack, поскольку они предварительно настроены для нас. Чтобы создать проект React, выполните следующую команду:

$ npx create-react-app serverless-react

Это создает папку serverless-react с необходимыми файлами для реагирующего приложения. Следующее, что нужно сделать, это инициализировать проект Amplify. Для этого следуйте инструкциям ниже

  1. Переключите каталог на проект, запустив cd serverless-react в командной строке.
  2. Запустите команду amplify init. Это побудит вас ответить на некоторые вопросы.
  3. Выберите редактор кода и нажмите Enter.
  4. Следующий набор подсказок представляет вам вопросы, чтобы определить тип приложения, которое вы создаете. Выберите JavaScript, затем React, а затем нажмите Enter, чтобы остальные подсказки использовали значения по умолчанию.

усилить-init.gif

amplify init Команда настраивает ресурсы развертывания в облаке с помощью стеков CloudFormation и подготавливает проект для Amplify. Он извлекает сведения о конфигурации ресурсов в каталог проекта. Эта информация о конфигурации будет использоваться для добавления сервисов AWS в проект и обновления конфигурации сервиса. В корне каталога проекта вы найдете .amplifyrc файл и усиливать папка. Они содержат информацию о конфигурации CloudFormation для ресурсов, которые мы будем использовать.

Последнее, что нам нужно для настройки проекта, — это добавить в наш проект библиотеку Amplify. Библиотека предоставляет нам модули и компонент пользовательского интерфейса, которые упрощают интеграцию сервисов AWS в несколько строк кода. Выполните следующую команду, чтобы установить его из npm.

$ npm install -S aws-amplify && npm install -S aws-amplify-react

Бессерверные вычисления дают нам такие преимущества, как снижение эксплуатационных расходов и времени разработки. Это позволяет нам сосредоточиться на нашем коде, чтобы обеспечить бизнес-ценность для пользователей, не беспокоясь о создании и обслуживании серверов. AWS — один из многих поставщиков услуг бессерверных вычислений. Для настройки и интеграции этих сервисов требуется несколько шагов, и AWS Amplify был создан, чтобы упростить создание бессерверных приложений на AWS. Он предоставляет инструменты для создания и настройки сервисов с помощью нескольких команд, а также библиотечные компоненты для простого взаимодействия с этими сервисами из нашего кода. Это первая публикация из серии, посвященной созданию бессерверных приложений с помощью AWS Amplify. Мы настроили Amplify CLI и создали проект Amplify.

Первоначально опубликовано на моем блог.

Похожие записи

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *