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
Related
I am looking to host several sites for people on a single S3 bucket. I understand that one could use Cloudfront and HAProxy to direct people to a specific location on an S3 bucket. My question is, what is the best means to build a react app on the fly, then send the 'build' folder to S3?
Is this even possible? I guess it's more of what's an efficient way to do this given the resources. Would I need to setup my own server or is there some serverless means using Lambda etc.
#bearsworth It is easy to host React applications on S3 with a tool called AWS Amplify. One thing that would require some clarification is why you would like to host several sites from the same bucket?
With amplify you can start with:
npx create-react-app myappname
then install amplify and its react tools with:
npm i -s aws-amplify aws-amplify-react
next run(follow prompts):
amplify configure
followed by:
amplify init
Afterward go to the AWS Console and search for Amplify. You will see a screen like this one Where is says get the most out of the Amplify console complete the second step to link your domain name. Click the Add a custom domain with a free SSL certificate link. It should look like this You can also connect a branch to your favorite code repository and your off to the races!!!
The downside to your request is each site would be in a separate S3 bucket. Amplify is a serverless platform so zero EC2 instances are needed. Going this route has saved me hundreds of dollars per month in infrastructure costs. The Amplify platform takes the stress out of provisioning instances, Kubernetes clusters, DNS configuration, API development, Authentication flows, and storage retrieval. For the full-stack React developer I feel it is a great resource.
Some features to try are:
Amplify add storage
Amplify add API
Amplify add hosting
Amplify add Auth
happy coding
I tried to deploy my single page application with spring boot and react.js. but I don't know where to start. I did my research and EC2 and S3 would be the right setup for deploying spa but I'm not quite sure. is there any resource I could have?
There are so many way to do this.
But I would use AWS CloudFront, and have the EC2 as a source (could also have the EC2 behind application load balancer) and the react.js in an S3 as a source. This way you also get them under a common domain name, and you can easily enforce HTTPS.
I've an existing web application developed in angularjs 1.5. And now, I'm planning to deploy it in a serverless architecture on AWS.
I've been googling around to get leads on how to achieve this. But, most of the links/tutorials that come up in Google search, suggest using ng-toolkit. However, when I start following those links/tutorials, I realize that those tutorials use angular2.0. These links/tutorials are not helpful, as my angular version is 1.5 and I know, angular2.0 is way different from it's predecessor.
So, my question is -
Is it possible to have my existing angularjs 1.5 application, to be deployed in a serverless architecture on AWS? If yes, can you share some links, that will help me set this?
We have successfully deployed our Angular 1.x web applications to an AWS S3 bucket, and then configure the bucket to support static website hosting.
You will want to give your bucket the same name as the URL of your desired website. Your bucket contents will need to be public, so be careful with what you push to this bucket. Should only be your Angular website bits.
You can then go to Route53 and create an alias A record to point to your S3 bucket. But note that is will only give you http:// support. To support https://, you will need to create a certificate in AWS CertificateManager and a corresponding AWS CloudFront distribution. You can source your CloudFront distribution to pull from your S3 bucket, and use the new certificate to support https://. You will then need to go into Route53 and point your A record to the CloudFront URL.
Deploying an angular 1.x application on a serverless architecture is like deploying any static website. You create an AWS S3 bucket, configure it for static website hosting, then set up CloudFront with https (use the CertificateManager to get a free certificate) to point to the public url of the bucket as origin.
Then you can set up Route53 to point your domain to the CloudFront URL. Here is a YouTube-Tutorial describing the whole process: https://www.youtube.com/watch?v=uwgB_sIhIko
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.
I have an AngularJS app which we need to deploy on production. It also has REST API calls.
As of now for development, we deployed it on AWS EC2 Ubuntu Instance and using grunt serve to run it.
I know grunt should be used only for development, so what are the other ways to deploy Angular App on AWS? I see many answers for deploying it on S3/Cloudfront. Can't we use EC2 instance with Nginx/Tomcat for this purpose on production?
Thanks!
You can setup CloudFront infront of EC2 instance to cache static contents in Angular App, which will improve the application performance better at scale.
If you can clearly seperate the Angular App including the index.html, it is an option to host it in AWS S3 also using CloudFront as a cache and a proxy to your EC2 instance which will reduce the overhead completely on delivering static content from the EC2 instance, further improving the performance. Also you can use S3 to store file uploads.