DEV Community

Cover image for Deploying Fast and Secure Web App on AWS — Part 2a
Ewere Diagboya
Ewere Diagboya

Posted on

Deploying Fast and Secure Web App on AWS — Part 2a

We have spent the last two part of this series Part 1a and Part 1b talking about how applications are websites have been hosted in last fifteen to twenty years of website application development. We have looked at the ways they were scaled and what it costs to host, deploy and manage them. We also spent a deal of time on the second part where we explained what can be done better in terms of cost of hosting, management, scaling and availability of our websites and web applications. From this point on, we are going to set a new tone of how those things mentioned in the second part can be applied. We are taking it from the ground up to lay a foundational architecture and take you through the journey of setting up a fast and secure web application on the cloud using specific AWS cloud computing services. While we do that, we will be focusing no three things as we set the stage:

  • Initial Setup and Deployment
  • Configuring Security and Speed
  • A/B Testing and Availability

This piece will be focused on the first item mentioned in the list. Which is the Initial Setup and Deployment. In this part we will be looking at understanding how we are going to achieve the goal of deploying a fast and secure web app on AWS.

What is a Website ?
For the purpose of this series, a website is basically an application built using HTML, CSS and Javascript. The applications we will be focusing on here are apps that do not require a compiler or run-time environment to run. Applications built with Angular and React and VueJS fall under this. It could also that you used VanillaJS and pure HTML and CSS to build the website or application.

The Architecture
Alt Text
Before we go further to start setting up anything, it is good to have a holistic idea what is being built. Hence we will need a an architecture that clearly shows the services that are going to be used and how request will flow in from when a user sends a HTTP request; say www.xyz.com. The architecture above shows all the components of our website, with each AWS service serving a unique purpose. We will be explaining the whole process from this point and start setting up each item in other parts of the series. The flow goes thus;
The user sends a HTTP request to the DNS service (Amazon Route53); with the URL of the website www.xyz.com. Route53 already has the configuration to point the domain request to Cloudfront (This will be done later in the series).
The address profiled in the DNS is that of Cloudfront Distribution, which is a caching service that makes it possible to; distribute the website or web application closer to users. It can also be used to configure custom Header Requests and Responses and Viewer Request and Responses this feature is called Cloudfront Edge.
The last item that looks like a bucket is actually a bucket that hosts the website, it is called Amazon S3. This is where the HTML, CSS and Javascript of the website will be uploaded to. This is where the web application files are stored and downloaded via the Cloudfront Distribution which serves as a caching layer.

Now that we understand where we are going to, the next part will involve setting up, and for this we will be starting from the last item which is the S3 bucket. AWS services can be setup using the GUI console or using Infrastructure as code.

Infrastructure as Code
Infrastructure as Code is a declarative scripting method of defining setup and infrastructure configurations across different environments. It saves the time involved in clicking through things and ensuring that there is a consistent configuration when ever any infrastructure setup needs to be done. It also makes passing on of setups and runbook operations much easier as they are codified and not documentations that might be misleading. All that is required is to run the script for it create that setup. The language used for Infrastructure as Code could be JSON or YAML. AWS Cloudformation is an Infrastructure as a Code service that can be written in either JSON or YAML. For this setup, Terraform will be used as the Infrastructure as code tool for all the configurations in this course.

Conclusion
Now, the target is set, we have spent some time explaining the new website setup and architecture that will cover the rest of the series, using S3 to host the website files, attaching Cloudfront to ensure the website is globally distributed to reduce latency for users all over the world, and requests from the user will be served using the highly available redundant DNS service called Route53. The next stage is to start setting things up and getting our tools ready to build this end to end. Watch out for Part 2b

Top comments (0)