I have a website using express/ react which consist of two separate parts.
1- API app (express server)
2- Website (react app)
I was fiddling around with AWS to deploy my app and figured out few options. So far the best option for the API is to use Elastic Beanstalk. It works well and I had no issues with it.
The confusing part is the react app. I have deployed it once as Elastic Beanstalk and once as S3 bucket. Both worked with some challenges ( easier was the S3)
I want to ask if anyone has been in the same scenario and have any recommendations?
In my experience it is better (for the sake of better scalability) to split the API server and CDN for bundled React App. You can use the CloudFront as CDN for the App and EC2 as API.
Related
I’m trying to find a way to deploy my app that uses Django on the backend and React front end, and also uses the Spotify API.
The project is based on this tutorial by Tech With Tim
I’ve seen some tutorials that suggest splitting it up and deploying them as two apps, where the backend proxies API requests to the backend as necessary, however since my React app is served with Django, I don’t think this method is conducive to how my app is set up. I've tried to deploy with Heroku but I haven't been successful. I'm not sure if its relevant, but I used webpack.
Here's my folder structure:
Any help? I’d be much obliged.
I have done one of the tutorial for aws amplify (the todo app). When it was done I had no more need for it so I deleted the application from the cloud.
Then one though hit me. If I have the source code locally (or hypothetically in git) for my amplify application, can't I somehow recreate the app in the cloud again from the source? if I understood it completely it is supposed to be infrastructure-as-code.
Currently, Amplify CLI doesn't support this.
Amplify is not an Infrastructure as Code.
From the AWS Documentation:
AWS Amplify is a set of tools and services that can be used together or on their own, to help front-end web and mobile developers build scalable full stack applications, powered by AWS. With Amplify, you can configure app backends and connect your app in minutes, deploy static web apps in a few clicks, and easily manage app content outside the AWS console.
Even if it's not supported, apparently there is some way to add services to the newly created Amplify from the existing Amplify backend.
https://github.com/aws-amplify/amplify-cli/issues/3505#issuecomment-597897873
I finished my Udacity Cloud Developer nanodegree and I want to make a custom domain to showcase on my portfolio.
The stack I use includes: Api Gateway, Lambda, DynamoDB, Nodejs, S3 and Serverless framework. Frontend is : React.
However, Im stuck on comprehending how to deploy the full app, with React frontend?
Something like: anc.com would navigate to my app. I found many solutions mentioning about using serverless-domain-manager.
But what about my React front end? I read some solutions saying to deploy static web using S3.
But my app currently has S3 to store the uploaded images.
If I deploy my frontend with S3, do I have to make 2 S3 buckets?
Currently, I have to use 2 terminals, SLS deploy for backend, and npm run start to run the front end at localhost.
My github code:
https://github.com/ploratran/DogLookBook
The team at Serverless has also released a tool called components, one of which looks like its perfect for what you want to do; it automatically handles everything on the cloud to get your React files hosted and a domain assigned too: https://github.com/serverless-components/website
I am looking for some advices, I am using Next.js to serve static pages that can be updated frequently, my app uses all kind of rendering : SSG, SSR and iSSG (new Incremental Static Site Generation feature).
Exemple of AWS architecture I thought:
EC2 to deploy a node.js server running next.js app
(if it is possible) Store/update static pages generated by Next.js
SSR/iSSG in a S3 bucket
Cloudfront to cache pages (using either EC2 or S3 bucket if it is
possible)
Do you know what is the best AWS architecture I could use according to my needs?
Edit: Maybe AWS Elastic Beanstalk is the solution, I am taking a look.
Next.js 11 + SST + Lambda#Edge
Serverless deployment was introduced in Next.js 8. This makes it easier for you to deploy your Next.js app to AWS Lambda functions, and take advantage of the serverless architecture. It's often much cheaper to host this way, and faster because you are serving the pages behind a CloudFront CDN network.
The SST framework makes it easy to help build and deploy your Next.js app to your AWS account using a combination of S3, Lambda#Edge and CloudFront. It also helps you configure a custom domain for the endpoint.
Here's an example walking through the setup - https://serverless-stack.com/examples/how-to-create-a-nextjs-app-with-serverless.html
I am very new to deploy Django and AWS. So now I would like to deploy my separate project (drf + react) to AWS.
So How can I deploy the separate project to AWS?
EC2 vs Elastic BeanStalk which one is better for that kind of environment?
I already search for one day but I found nothing useful information and found the similar thing but I don't understand like that=>
Deploying Separate React Frontend and Django DRF API
You asked a difficult question. I think I can make it bit easy for you.
First let's look at the differences in the options.
Serving the front end app
Option1: Django to serve react app
In this option, the Django app will serve your app in a route for e.g /app/. Basically the route /app will load react app's index.html. it's that simple.
In order for this to work, you need to build your react app using npm run build and copy the files to Django's static folder. good so far?
One of the benefits option 1 gives, option 2 doesn't is, you can use the same domain for backend and frontend for e.g www.example.com.
Option 2: deploy front end in S3
You still need to build the react app using npm run build, but you will not copy that to Django, in other words, you don't want to Django to serve your front end app, you want s3 to serve the static website. this method requires a separate subdomain or domain to host the react app.
Thats is the only difference between the options. Your frontend app will make api calls to the Django api, thats same for both options.My preferred option is option 2 to reduce complexity.
Deployment
I would pick elasticbeanstalk because it's easy to start with. You can do everything in the elasticbeanstalk console from load balancer to SSL, Healthcheck, Changing EC2 Keypair for EC2 Instance etc. Deployment is very easy. It supports multiple environments, You can use one AWS account for your test and production environments.