iT邦幫忙

鐵人檔案

2026 iThome 鐵人賽
回列表
Modern Web

前端來點 AWS 技能樹! 系列

身為前端工程師,除了前端技術之外,也常常需要把技能樹點到其他領域,而"網站部署"就是其中很常遇到的一環。

現在像 Vercel、Zeabur、GitHub Pages 這類部署平台都非常方便。不過隨著專案需求變得更複雜,這些平台在架構彈性、資源配置或使用方式上,多少還是會遇到一些限制。

剛好最近我把自己的 Side Project 從 Zeabur 搬到了 AWS,也趁著這次搬遷的機會,開始接觸過去比較少碰到的雲端服務、網路設定與部署流程。

而這個系列文則是分享自己這段一路上學到的觀念與心得,如果你也和我一樣想往雲部署的方向多點些技能,那就一起看下去吧!ദ്ദി (⩌ᴗ⩌

參賽天數 26 天 | 共 26 篇文章 | 0 人訂閱 訂閱系列文 RSS系列文
DAY 11

Day11 - 開一台 EC2

昨天把專案上 AWS 的幾條路攤開來看,也決定這個系列要自己管理一台 EC2。今天就來把那台機器開起來ㄅ!d(d'∀') 建 EC2 首先登入 IAM 的帳號,...

2026-09-25 ‧ 由 Jimmy Ho 分享
DAY 12

Day12 - 用 Session Manager 連進 EC2,裝好 Docker

昨天開好了第一台 EC2,今天就來連進主機,把 Docker 裝起來ㄅ! 這次使用 Session Manager,它是 AWS 提供的遠端連線工具,讓我們直接...

2026-09-26 ‧ 由 Jimmy Ho 分享
DAY 13

Day13 - 把 Image 推上 ECR,讓 Next.js 在 AWS 上跑起來

昨天透過 Session Manager 連進 EC2,也成功跑出了 Hello from Docker!。今天就來把前幾天做的 Next.js Image...

2026-09-27 ‧ 由 Jimmy Ho 分享
DAY 14

Day14 - 搞懂 IP、子網路與路由:80 和 3000 port 差在哪?

昨天終於把專案放到 EC2 上並看到頁面了!不過回頭看,從開機器到跑容器,一路出現了公網 IP、Subnet、Security Group,還有 -p 80:3...

2026-09-28 ‧ 由 Jimmy Ho 分享
DAY 15

Day15 - 搞懂 Port:80 和 3000 是怎麼接起來的?

昨天講了如何分清楚 IP 位址,也知道上次部署完開網站時,用的是 EC2 的公網 IP。不過,前面在本機開 Next.js,網址明明是 http://local...

2026-09-29 ‧ 由 Jimmy Ho 分享
DAY 16

Day16 - VPC 與 Subnet:EC2 到底放在哪個網路裡?

終於過半了!◝( ゚∀ ゚ )◟ 還有一半繼續加油ㄅ!昨天搞懂了 -p 80:3000,知道瀏覽器連到 EC2 的 80 port,再由 Docker 轉送到...

2026-09-30 ‧ 由 Jimmy Ho 分享
DAY 17

Day17 - 路由表與 Internet Gateway:EC2 怎麼連上網際網路?

昨天我們認識了 VPC、Subnet 和 CIDR,也知道 EC2 的 Private IP 是從所在的 Subnet 中取得的。不過,知道主機放在哪個網路裡之...

2026-10-01 ‧ 由 Jimmy Ho 分享
DAY 18

Day18 - Elastic IP:替 EC2 保留固定的公網 IP

昨天看完了路由表與 Internet Gateway,知道 EC2 的流量怎麼走到網際網路。今天回到一開始貼進瀏覽器的那個 Public IP:如果我們試著在練...

2026-10-02 ‧ 由 Jimmy Ho 分享
DAY 19

Day19 - 網域與 DNS:讓網站有個好記的名字

昨天認識了 Elastic IP,可以替 EC2 保留固定的 Public IP,讓它停止再啟動後,位址仍然維持不變。不過,我們平常分享網站,很少會直接傳一串...

2026-10-03 ‧ 由 Jimmy Ho 分享
DAY 20

Day20 - 網域與 DNS 設定:把名字接上 EC2

昨天知道瀏覽器怎麼透過 DNS 找到 IP 位址,也查過 www.google.com 的位址記錄(Address Record,A 記錄)。不過,那是別人的...

2026-10-04 ‧ 由 Jimmy Ho 分享