<aside> ❗ Copyright and Ownership Notice

關於這個 notion page 以及其包含的所有 pages (以下統稱「本 page」),其著作權與所有權是屬於台大電機系黃鐘揚教授以及其所開設的網路服務程式設計課程之所有助教 (以下統稱「作者們」) 所擁有。

基於推廣技術與服務大眾之精神,本 page 採取 MIT 授權,即任何人皆可因任何目的使用、複製、修改、發布、與再散佈本 page,包括商業用途。不需簽署協議,也不需支付授權費,惟任何的使用與散佈必須包含本著作權與所有權聲明。如有違反本著作權與所有權聲明,本 page 之作者們仍保有相關的法律追朔權利。詳細關於 MIT 授權的規範請見 OSI 官網

本 page 之內容以「現狀」提供 (provided "as-is"),不附帶任何保證。對於本 page 之內容如有任何疑問或是建議,請來信 [email protected].

The copyright and ownership of this Notion page and all pages it contains (hereinafter referred to as "this page") belongs to Professor Chung-Yang Huang of Department of Electrical Engineering, National Taiwan University, and all teaching assistants of this Web Programming course that he teaches.

In the spirit of promoting technology and serving the public, this page adopts the MIT License, meaning anyone can use, copy, modify, publish, and redistribute this page for any purpose, including commercial use. No agreement needs to be signed, and no licensing fee needs to be paid, provided that any distribution must include this copyright and ownership notice. In case of violation of this copyright and ownership notice, the authors of this page still retain the relevant legal right to take retroactive action. For detailed regulations regarding the MIT License, please see the OSI official website.

The content of this page is provided "as-is", without any warranty. If you have any questions or suggestions regarding the content of this page, please email [email protected].

</aside>

<aside> 🌐 Web Programming Home

</aside>

關於 HW#5 X-Clone

Preview — 今日的課程重點

Serveless 架構

Vercel — 輕量、優雅、UX/UI 友善之部署平台

<aside> 👉🏿

使用 Serverless 的 Vercel 進行 deployment, 把 realtime-communication, DB management, multi-media storage 的工作交給 3rd party 的雲端服務!

</aside>

Realtime Communication — WebSocket

Pusher — Realtime Communication Service

使用 Next.js + Pusher 打造一個 simple chat app

<aside> 👉🏿

知道如何使用 Next.js + Pusher 打造一個 simple chat app 以後,接下來我們要將這個 app 加入 OAuth 登入以及 MongoDB, 最後將它部署到 Vercel

</aside>

NoSQL — Not Only SQL DB

MongoDB — A Document-Store NoSQL DB

MongoDB Atlas — MongoDB 官方的雲端託管版本

Cloudinary CDN — Image/Video 雲端檔案管理

<aside> 👉🏿

我們接下來使用 Next.js + MongoDB + Pusher + Cloudinary 來打造一個 Messenger-Clone

</aside>

打造 Messenger-Clone

將 Messenger-Clone 部署到 Vercel