整完工具,點解要放上网?
你跟住我哋嘅教學,整咗個 HTML 工具喺自己部電腦 —— 但有一日你會想:
- 📱 喺手機用返同一個工具(唔使傳檔案)
- 👨👩👧 俾屋企人、朋友一齊用(send 條 link 搞掂)
- 💼 擺上履歷/Portfolio 俾人睇你識做嘢
傳統架網站要租伺服器、買域名、識 set server —— 又貴又複雜。但 GitHub Pages 係免費嘅:全世界最大嘅程式碼平台,俾你免費寄存靜態網站,冇流量上限、冇廣告、自動有 HTTPS 加密。我哋呢個網站都係咁做。
第一步:開個 GitHub 帳號(免費)
去 github.com,撳「Sign up」
用電郵註冊,用戶名諗個你鍾意嘅 —— 佢會變成你網址嘅一部分:你嘅用戶名.github.io。
驗證電郵
去信箱撳驗證連結,帳號就開通咗。
第二步:開一個 Repository(倉庫)
撳右上角「+」→「New repository」
Repository 即係一個放檔案嘅文件夾。
填個名,例如 my-tools
呢個名都會出現喺網址入面:你嘅用戶名.github.io/my-tools。揀 Public(免費版 GitHub Pages 一定要公開)。撳「Create repository」。
第三步:上傳你嘅 HTML 檔案
喺 Repository 頁面撳「uploading an existing file」
或者撳「Add file」→「Upload files」。
將你個 HTML 檔案拖入去
重要:將檔名改做 index.html —— 呢個係所有網站嘅「大門」檔名,有咗佢,條 link 先會直接打開你個工具。
撳「Commit changes」
Commit 即係「儲存版本」嘅意思,撳掣就得,唔使寫嘢。
第四步:開啟 GitHub Pages
Repository 頁面頂部撳「Settings」
左邊選單搵到「Pages」。
「Source」揀「Deploy from a branch」
Branch 揀 main,右邊揀 /(root),撳「Save」。
等 1-2 分鐘,refresh 個頁面
頂部會出現一個綠色框,寫住你嘅網址:https://你嘅用戶名.github.io/my-tools —— 撳入去,你個工具已經喺網上!
第五步:分享俾全世界
條 link WhatsApp 俾朋友、放上 IG bio、貼喺履歷 —— 任何人撳入去都用得你個工具。之後想改嘢?返去 Repository 撳個檔案 → 鉛筆 icon 編輯 → Commit,一分鐘後網站自動更新。
常見問題 FAQ
Q:開咗 Pages 但條 link 打開係 404?
A:九成係檔名唔係 index.html(大小階都要啱)。另一個可能係等唔夠 —— 第一次部署有時要 5-10 分鐘。去 Settings → Pages 睇到綠色框先算完成。
Q:localStorage 嘅資料會同步去唔同裝置嗎?
A:唔會。localStorage 係「每部裝置各自儲存」—— 你電話入嘅數,電腦睇唔到。放上网解決嘅係「唔使傳檔案、人人用得」,唔係資料同步。想同步就要資料庫,屬於進階課題。
Q:一個帳號可以放幾多個工具?
A:每開一個新 Repository 就係一個新工具,數量冇限制。想好似我哋咁整成一個有好多頁嘅網站(首頁+教學文),都係同一個 Repository 入面放多幾個 HTML 檔案就得。
Q:github.io 條網址好樣衰,可唔可以用自己個域名?
A:可以,例如我哋呢個站就係用自己域名。流程係:買域名 → 喺 DNS 指去 GitHub → Repository 設定填返個域名。不過建議你先玩熟免費版,有需要先買域名(大概幾十蚊美金一年)。
總結:你而家已經識晒成個循環
諗功能 → 寫 Prompt → AI 生成 → 本地測試 → 放上网分享 —— 呢五步就係「AI 建站」嘅完整流程。由今日起,你腦入面嗰啲「如果有個 App 可以...」嘅諗法,全部都可以自己實現。想搵下一個整咩?去 文章庫 睇吓其他實戰教學啦。