The Ultimate Guide for Quickly Launching Websites Using AWS & Namecheap

Abstract vector created by vectorjuice — www.freepik.com

Static Web Page

Complex Websites

1. Build your application

1.1 Install Requirements

npm i -g create-react-native-app

1.2 Create the Application

create-react-native-app {{project name}}

2. Dockerization (Optional)

2.1 Create Dockerfile

FROM node:12.18

# Install requirements
RUN npm install -g expo-cli

# Install dependencies
ADD package.json .
CMD [“npm”,”install”]

# Copy contents
COPY . /

# Run application
CMD [“sudo”,”expo”,”start”,” — web”]

2.2 Build Docker Image

docker build — network=host -t test:v0 .

2.3 Run Docker Image

docker run -i -t -d -p 3000:3000test:v0

2.4 Test the image

http://localhost:3000

3. Set Up the Server

3.1 Acquire AWS Account

3.2 Create EC2 Instance (CHECK YOUR REGION)

3.3 Access the EC2 Instance

  • Open PuTTYgen (right-click the PuTTY application on the taskbar)
  • Click Load (an existing private key file)
  • Select the .pem private key from AWS
  • Click Save private key and store the .ppk file
  • Get the address of your EC2 instance on the AWS dashboard
ec2–11–222–333–444.ap-east-1.compute.amazonaws.com
  • Open PuTTY
  • Create a new profile on PuTTY and set the following:
Hostname: ubuntu@ec2-11–222–333–444.ap-east-1.compute.amazonaws.com
Port: 22
  • Go to SSH / Auth then in the Private key file for authentication, select the .ppk file you have generated
  • Press Open to connect to the server
  • On your first time connecting, PuTTY will ask you if you want to add the key of the server to your list of trusted public keys. Select Yes.
  • If you did not put ubuntu@ in the hostname, the default username is ubuntu with no password (since you have connected by a private key file).
curl -sL https://deb.nodesource.com/setup_12.x | sudo -E bash -
sudo apt-get install nodejs -y
node -v
npm -v
$ node -v
v12.21.0
$ npm -v
6.14.11
sudo npm i -g serve

3.4 Install your Application in the Server

git clone YourGitRepoUrl
cd YourGitRepoName
npm install
npm run build
serve -s build

3.5 Open the EC2 Instance to Public Access (Port)

Type:       Custom
Protocol: TCP
Port range: 5000
Source: YOUR_IP

3.6 Test Public Access (Port)

4. Get Your Domain Name

4.1 Acquire Domain Name from an ICANN Provider

www.namecheap.com
www.name.com
www.godaddy.com
orAWS Route 53

4.2 Create AWS Elastic IP Address

4.3 Create AWS Hosted Zone in Route 53

Record Name: www.YOUR.DOMAIN
Type: A
Value: EC2_IP_ADDRESS
Record Name: YOUR.DOMAIN
Type: A
Value: www.YOUR.DOMAIN.

4.4 Add Hosted Zone Nameservers to ICANN Provider

NS record example

4.5 Open Port 80 (HTTP) on the EC2 Instance Security Group

Type:       HTTP
Protocol: TCP
Port range: 80
Source: 0.0.0.0/0
Type: HTTP
Protocol: TCP
Port range: 80
Source: ::/0

4.6 Redirect Port 80 (default web port) traffic to Application Port (5000)

sudo iptables -t nat -I PREROUTING -p tcp — dport 80 -j REDIRECT — to-port 5000
sudo iptables -I INPUT -p tcp — dport 5000-j ACCEPT

4.7 Test Public Access (Port 80)

5. Set SSL Certificate (Get HTTPS on your website)

5.1 Acquire AWS ACM SSL Certificate

5.2 Create a Load Balancer with SSL Certificate

  • Name
  • Add HTTPS Listener
  • Availability Zones (you can select all)

5.3 Redirect traffic to Load Balancer on Route 53

Record Name: www.YOUR.DOMAIN
Type: A
Value: EC2_IP_ADDRESS

5.4 Open Port 443 (HTTPS) on the EC2 Instance Security Group

Type:       HTTPS
Protocol: TCP
Port range: 443
Source: 0.0.0.0/0
Type: HTTPS
Protocol: TCP
Port range: 443
Source: ::/0

5.5 Redirect Port 443 traffic to Application Port (5000)

sudo iptables -t nat -I PREROUTING -p tcp — dport 443 -j REDIRECT — to-port 5000
sudo iptables -I INPUT -p tcp — dport 5000 -j ACCEPT

5.6 Test HTTPS Access to Application

6. Transfer Region (Optional)

6.1 AWS EC2 Instance Transfer

6.2 Load Balancer

6.3 Route 53

6.4 Run the Instance

sudo iptables -t nat -I PREROUTING -p tcp — dport 80 -j REDIRECT — to-port 5000
sudo iptables -I INPUT -p tcp — dport 5000 -j ACCEPT
sudo iptables -t nat -I PREROUTING -p tcp — dport 443 -j REDIRECT — to-port 5000
sudo iptables -I INPUT -p tcp — dport 5000 -j ACCEPT

6.5 Cleanup

Award-Winning Software Engineer | Business and Web Consultant

Love podcasts or audiobooks? Learn on the go with our new app.

Recommended from Medium

Connecting to AWS Athena databases using Python

RECURSIVE (memoized) vs RECURSIVE vs ITERATIVE - TIME COMPLEXITY COMPARISON

What’s wrong with software development? Managers, not leaders

Augmented Reality App Development: Best Tools for Building Apps

People focus like start.

Dateparser: A little but powerful date parsing library

Museria - a decentralized music storage.

What Are WebSockets?

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Justin San Juan

Justin San Juan

Award-Winning Software Engineer | Business and Web Consultant

More from Medium

What Exactly Is AWS? How Does It Work?

How can company save AWS cost in 10 minutes, by turning off unused databases during non-office…

AWS Amplify

Getting started with AWS lambda and serverless framework