2d • 【社群教學區】
🌸 【專屬資源】免寫程式！一鍵套用 AI 賞櫻地圖模板與提示詞
嗨大家！最近正是賞櫻季，我用 AI 工具快速做了一個「賞櫻地圖」的網頁 App。
🔗 先來玩玩看成品：https://sakura-map-pi.vercel.app/
歡迎來到實戰單元！看到上面那個超酷的櫻花地圖了嗎？ 現在，我們要把它變成「你自己的」網頁，而且完全不用寫任何一行程式碼。
只要跟著以下 3 個步驟「點擊、上傳」，5 分鐘後你就會擁有一個專屬的網頁連結，可以傳給 Line 的親朋好友炫耀囉！😎
📍 第一步：下載地圖模板（取得武器）
- 請點擊這篇貼文下方的附件。
- 下載我幫你準備好的 index.html 檔案，把它存在你的電腦桌面。（⚠️ 注意：請確保檔名就是 index.html，不要改名喔！）
📍 第二步：註冊 GitHub 並上傳檔案（建立雲端基地）
GitHub 就像是工程師的 Google Drive，我們要把檔案存上去。
- 前往 GitHub 官網，點擊右上角的 Sign up，用 Email 註冊一個免費帳號。
- 登入後，點擊左上角綠色的 「New」 按鈕來建立一個新專案（Repository）。
- Repository name（專案名稱）：隨便取一個英文名字，例如 my-map。
- 往下捲動，點擊綠色的 「Create repository」。
- 在下一個畫面，找到並點擊 「uploading an existing file」（上傳現有檔案）這行藍色小字。
- 把你剛剛下載在桌面的 index.html 拖曳進去，最後點擊下方的綠色按鈕 「Commit changes」，檔案就上傳成功啦！🎉
📍 第三步：註冊 Vercel 並發布上線（一鍵變網頁！）
Vercel 是一個超強的免費平台，能把你在 GitHub 的檔案直接變成一個網址。
- 前往 Vercel 官網，點擊 Sign up。
- 註冊時，請直接選擇 「Continue with GitHub」（用剛剛註冊的 GitHub 帳號連動登入）。
- 登入後，點擊右上角黑色的 「Add New...」 ➔ 選擇 「Project」。
- 這時你會看到你剛剛在 GitHub 建立的 my-map 專案出現在畫面上，請點擊旁邊的 「Import」。
- 什麼都不用改，直接勇敢地按下 「Deploy」（部署）！
- 等待大約 30 秒，畫面會撒花慶祝 🎊，這時候點擊畫面上的網址，你的專屬地圖就正式誕生在網路上了！
🎯 課後小任務： 鼓勵大家套用這個模板，改成你自己的版本（例如：台北拉麵地圖、全台秘境咖啡廳地圖），做好之後把連結貼在下方留言區跟大家分享吧！👇
2
0 comments
🌸 【專屬資源】免寫程式！一鍵套用 AI 賞櫻地圖模板與提示詞
powered by
skool.com/wilson-9076
哈囉，我是 Wilson，歡迎來到威爾森實驗室
我喜歡到處旅行、學語言，也愛研究各種能提升效率的數位工具。對我來說，科技和語言不是冷冰冰的學問，而是用來放大生活體驗的放大鏡。
歡迎大家一起用科技與語言，把世界變小，把生活變大！
Suggested communities
Powered by