Should I use docker (nginx) for serving a SPA? - amazon-web-services

I only have 1 javascript file(bundle.js packed by webpack) and 1 html. It's kinda like SPA.
I'm thinking how I host this SPA? I already have one clean VM on Amazon EC2.
I was planning setup a docker (Nginx) on this EC2. However, as I said, this VM is clean. Only this SPA will use this EC2 VM.
So I'm confused by this situation. Should I use docker(nginx) or just install a Nginx on this EC2 for serving this SPA?

AWS S3 service is capable of service static files, You just need to upload your files to a bucket, then make them public and note the public URL.
As a side note, Containerizing apps and using microservices architecture, will give you advantages, Some of them are:
Ease of Upgrade
Fault Containment
Ease of technology change
Increased Security
Efficient Resource Utilization

S3 is cheap enough for static files, almost free compared to EC2 unless you have backend in place. You can use Cyberduck for S3 and if you want to go FTP one day, same app would give you a common UX for uploading your files.
Though Docker setup would be over engineering for static serving in IaaS, you would need to build an image that contains nginx and your files as in KyleAMathews/docker-nginx project.

Related

How to deploy nuxt frontend with express backend on AWS?

I have a Nuxt v2 SSR application as the frontend running on port 3000
I have an express API as the backend running on port 8000
I have a python script that loads data from external APIs and needs to run continuously
Currently all of them are separate projects with their own package.json and what not
How do I deploy this to AWS?
The only thing I have figured out so far is that I may have to deploy express API as an Elastic Beanstalk application.
Should I have a separate docker-compose file for each because they are separate projects currently or should I merge them into one project with a single docker-compose file
I saw similar questions asked about React, could really appreciate some direction here in Nuxt
None of these similar questions are based on Nuxt
How to deploy separated frontend and backend?
How to deploy a React + NodeJS Express application to AWS?
How to deploy backend and frontend projects if they are separate?
There are a couple of approaches depending on your workload and budget. Let's cover what the options are and which ones apply to the work at hand.
Serverless Approach with Server-side rendering (SSR)
Tutorial
By creating an API Gateway route that invokes NuxtRenderer in a Lambda. The resulting generated HTML/JS/CSS would be pushed to S3 bucket. The S3 bucket acts as a Cloudfront origin. Use the CDN to cache the least updated items and use the API call to update the cache when needed. This is the cheapest way to deploy, but if you don't have traffic some customers may experience brief lag when cache updates hit. Calculator
Serverless Approach via static generation
This is the easiest way to get going. All the routes that do not have dynamic template generation can simply live in an S3 bucket. The simplest approach is to run nuxt generate and then upload the resulting contents of dist to the bucket. No node backend here, which is not the requirement in the question but its worth mentioning.
Well documented on NuxtJS.org and free tier.
Serverless w/ Elastic Beanstalk
IMO this approach is unnecessary and slightly dated for the offering AWS provides in 2022. It still works of course, but the cost to benefits aren't attractive.
To do this you need to use the eb command line tool and set NPM_CONFIG_UNSAFE_PERM=true. AFAIK there is nothing else special that needs to happen for eb to know what to do from there. Calculator
Server-ish Approach(es)
Another alternative is to use Lightsail and NodeJS server. Lightsail offers low (but not lower than serverless) cost to a full time NodeJS server. In this case you would want to clone your project to the server then setup systemd script to keep nodejs running.
Yet another way to do this and have some scalability is to use ECS and Docker. In this case you would create a Dockerfile that builds the containers, executes npm start, and exposes the port Nuxt runs on to the host. This example shows how to run it using Fargate, which is essentially a serverless version of EC2 machine. Calculator
There are some ways for you to deploy your stack in AWS. I can give you some options, but you're best shot if you want to save some costs is by using Lambda Functions as your backend, S3 for your front-end and a batch Lambda job for your python script.
For your backend - https://github.com/vendia/serverless-express
For your nuxt frontend - https://nuxtjs.org/deployments/amazon-web-services
For your python job - https://docs.aws.amazon.com/AmazonCloudWatch/latest/events/RunLambdaSchedule.html
It's not way too simple to execute all of those, but with the following links you'll probably have an idea of how you may implement your solution.

AWS 3-tier architecture issues

Guys I am trying to implement a 3-tier architecture to host a web app on aws.
The requirements given to me are as follows.
The app will leverage a 3-tier architecture:
A Web Server that will be running on S3
An application tier running on ECS Cluster on Fargate or a fleet of EC2s with ASG (your choice)
A data tier running on RDS Aurora PostgreSQL latest supported version
I understand perfectly what to do on the 2nd and 3rd instructions for the App and Database tier.
What I don't get is the “web server running on s3” . Is it possible to have a web server on S3?
What I know is, I can have a web server running on EC2.
Please, I need some explanation here.
Yes and no, S3 is a static file host, which means you have these HTML, CSS, and JS files where all you want to do is to send these files to the browser, then absolutely, yes. S3 can be used as a file serving service, https://docs.aws.amazon.com/AmazonS3/latest/userguide/WebsiteHosting.html
However, when you have the case where your website is doing some real-time HTML generation, something like SSR (Server Side Rendering), S3 won't cut it. S3 does not process the code in any way and only directly sends the files as-is to the frontend. In which case, you need a more traditional server on EC2/ECS/EKS.

Deploying SPA(angular2) on S3 vs EC2

I have angular application with nodejs backend(REST API). I am confused with S3 and EC2. which one is better and what are the pros and cons deploying to each.Considering average load. Help will be highly appreciate.
I figured it out by myself.
S3 is used to store static assets like videos, photos, text file and
any other format file. It is highly scalable, reliable, fast, inexpensive
data storage infrastructure.
EC2 is a like your own server. And it is on Cloud so computing
capacity can be decreased or increased instantly as per server need.
So here my confusion is clear as ...
When we build Angular2 Application it generates .js files which called
bundle in term of angular2. Now, these files can be hosted on S3 Bucket. And can be accessed through CloudFront in front of it. Which is very fast cache enabled. And pricing model is pay per request.
But EC2 is like running own server. And we have to configure server it
self so for angular application it is not good. It is good for node
Applicationas it can do computation.
You can setup a popular ubuntu server in EC2 with
Nginx to serve your angular frontend and proxy request for your
NodeJs Api
S3 is a file storage mainly for serving static content and media files (jpg, fonts, mp4 etc)
Theoretically you can host everything in your EC2 instance, but with S3 it is easier to scale, backup, migrate your static asset.
You can probably start with one simple EC2 instance to run everything, when everything's working fine you can try move the static asset to S3

Where to store public data and how to deploy it from GitHub

I'm working on my project which is placed on AWS EC2 instance. I used CodeDeploy to deploy app from GitHub to EC2. But I want to store public data as stylesheets, JS, images etc on S3. It's even possible to deploy app on EC2 and S3 in one step? Or should I place all files to EC2 instance only?
I've been learning AWS documentation about Elastic Beanstal, CodeDeploy, CodePipeline, Ops Works and others for two days, but I confused.
It sounds like you want to have two steps in your deployment. One where you update your static assets in S3 and another where you update your servers and dynamic content on EC2 instances.
Here are some options:
Since they are static, just have every EC2 host upload the S3 assets to your bucket as a BeforeInstall script. You would need to include the static content as part of your bundle you use with CodeDeploy.
Use a leader election algorithm to do (1) from a single host. You could deploy something like Zookeeper as part of your CodeDeploy deployment.
Upload your static assets as a separately from your CodeDeploy deployment. You might want to look ad CodePipeline as a solution for a more complex multistage deployment (which can use CodeDeploy for your server deployment).
In either case, you will want to make sure that you aren't just overwriting your static assets or you'll end up in the situation where you old server code is trying to use new static assets. You should always be careful that you can run both versions of your code side by side during a deployment.
I won't complicate it. I'll put all files to EC2 include CSS and JS by CodeDeploy from GitHub, because there is no simple and ideal solution for this.

Easier way to update files on Amazon EC2 instance?

Major newbie when it comes to Amazon EC2 servers, and web development in general.
At the moment I have a web app that is hosted on parse. Everything is done on the client side in the browser, and I want to change it to a client server model by writing a server in node.js.
I've looked into Amazon EC2, I've set up and instance and it looks good. My question is however:
Is there an easier way to update files on the instance? At the moment I'm pushing all the files from my computer to a github repo, then pulling them on to the instance- this seems very long winded. When using parse, all I needed to type was 'parse deploy' into the command line to update and deploy my application, is there something like this for Amazon EC2?
Thank you
I typically install or enable FTP on my ec2 instances and then just use the ftp client of my choice to update files.