Поток выполнения приложения React + Node.js, развернутого в AWS Cloudfront?
Я разрабатываю веб-приложение в React с серверной частью Node.js. Я хотел бы разместить изображения и статические файлы, созданные для приложения React, в Cloudfront. Однако приложение React полагается на сервер Node.js для получения некоторых изменяющихся данных для заполнения представлений.
Мне нужно иметь полное представление о потоке приложения, чтобы придумать разумный дизайн. Вот что я думаю происходит:
- Пользователь вводит URL в браузере
- Клиент направляется к ближайшему пограничному местоположению Cloudfront.
- Cloudfront передает HTML и изображения в браузер
- Приложение React загружается в браузере
- Выполняется вызов API на сервер Node.js, который возвращает необходимые данные
- Браузер отображает приложение React.
Я правильно это понимаю? Есть ли лучший способ спроектировать мое веб-приложение?
Я не могу найти нужную мне информацию в Интернете и буду признателен за любую помощь!
Ответы 1
Ваша архитектура правильная. Чтобы было ясно, CloudFront не размещает ваши файлы. CloudFront — это кеш, который извлекает ваши файлы из Origin, обычно из корзины Amazon S3.
Используя React && AWS Amplify, вы можете создать бессерверную архитектуру для этого типа настройки с минимальными усилиями. Вы можете начать, следуя инструкциям на странице https://aws-amplify.github.io/docs/.
В двух словах:
Установить с помощью:
npm install -g @aws-amplify/cli
$ amplify configure
Затем в вашем проекте:
amplify init
amplify add api #this will create your API as AWS Lambda functions exposed through Amazon API Gateway)
amplify add hosting #this will create the Amazon S3 bucket for hosting and the cloudfront distribution)
amplify push #to create all this on your AWS account for you
Если вы введете запрос «aws amplify react», вы легко найдете дюжину сообщений в блогах, в которых показано, как начать работу. Их так много, что я не могу рекомендовать что-то конкретное.