Host app with AWS Elastic Beanstalk and Namecheap

TD
TD’s note
Published in
5 min readJun 15, 2020

上週嘗試把 Node.js app 部署到 AWS Elastic Beanstalk 上,同時也在 Namecheap 上買了人生第一個 domain name: td.coffee。當中還有許多自己不了解的細節,不過這裡就先紀錄一下過程。

AWS Elastic Beanstalk

Elastic Beanstalk 是 AWS 提供的一項服務,能讓開發團隊快速部署及管理應用程式。Elastic Beanstalk 是在 EC2 (Elastic Compute Cloud) 之上所建立的一層 layer,因此透過 Elastic Beanstalk 部署,不僅僅只是幫我們開啟 server,過程中更可以透過設定,開啟 S3, Simple Notification Service, CloudWatch, auto-scaling, load balancing 等服務,可以說是個方便的一站式服務。

部署完成之後,Elastic Beanstalk 會自動產生連結,我們就可以透過這個連結,連線到我們的 application。不過這個連結非常的長,大概長這樣 http://myapplication-env.xxx-xxxxxxxx.ap-southeast-1.elasticbeanstalk.com/,如果想要使用一個名字好記、能夠代表自己的連結,就需要自己購買新的網域。

Namecheap

Namecheap 是一家域名註冊與 hosting 的服務商。其實購買網域相當方便,就像是逛線上商店一樣,選好自己要的網域名,然後再次確認自己可以付得起,就可以結帳囉!

接下來,就需要建立連線,讓點擊我們新網域的訪客,能夠直接連線到我們的 application。

以下就是相關的設定步驟。

到 Namecheap 的 dashboard,在 domain list 當中找到剛剛註冊的網域,點擊 MANAGE 按鈕,就會來到下面這個頁面

在中間的 NAMESERVERS 選擇 Namecheap Basic DNS,下面的 REDIRECT DOMAIN 記得把 td.coffee 也導向 www.td.coffee。

完成之後,點擊右上方的大大的 Advanced DNS,就會來到下面這個畫面

這裡,我們要在 HOST RECORDS 的區塊,建立 CNAME (Canonical Name) record,把來到 td.coffee 的 traffic 都能夠找到我在 Elastic Beanstalk 上面的 application。

但很妙的是,這裡不能直接放 Elastic Beanstalk 給我們的 URL,反而是要放 EC2 的 URL。

因此,我們需要進入 EC2 的 dashboard,在左邊欄位點擊 instances,這時候就會找到我們在透過 Elastic Beanstalk 部署的同時所開啟的 EC2 instance。

點擊該 instance ,即可在下方看到 Public DNS (IPv4) 的 URL。把這個 URL 複製貼回剛剛 Namecheap 當中設定 CNAME 的地方,即完成設定。

About me

Self-taught and trained in software development knowledge and skills, I am passionate about creating changes through technology.

Find more at Github, LinkedIn, Teaching at ALPHA Camp

--

--