iT邦幫忙

2021 iThome 鐵人賽

DAY 3
9
Software Development

奇怪的知識增加了!原來程式還可以這樣用?!系列 第 3

[Day3] 完全免費! 一分鐘在GitHub建立個人網站!

繼昨天的刮刮樂履歷教學,今天來教大家如何把本機履歷的html檔,
用最快、最無腦的方式變成網頁連結!

這篇文章不會像前兩天的那麼好笑,但還是希望大家賞個臉進來看一下><
畢竟沒有在天天過年的啦XD

使用環境

執行步驟

  1. 創一個GitHub帳號,點擊右上角大頭貼,選擇Your repositories
    https://ithelp.ithome.com.tw/upload/images/20210902/20133286bfDg8eanxw.png

  2. 點選New,新增新的儲存庫
    https://ithelp.ithome.com.tw/upload/images/20210902/20133286eUL84PDaHJ.png

  3. 填入你想要的名稱.github.io,選Public
    https://ithelp.ithome.com.tw/upload/images/20210902/20133286Yu0DWre810.png

  4. 建立好之後會跳到這個畫面,打開剛剛下載的GitHub Desktop.exe,桌面上就會出現你上面指定名稱的空資料夾
    https://ithelp.ithome.com.tw/upload/images/20210902/20133286ijixgN4abk.png

  5. 如果不是第一次使用,就要特別注意框起來部分的儲存庫名稱,不要選錯了喔!
    https://ithelp.ithome.com.tw/upload/images/20210902/201332868wnYitMYsP.png

  6. 將你的網頁和其他資料夾(如圖片)放到桌面上的同名稱資料夾內(第4步說的那個空資料夾),資料夾裡面有個.git隱藏檔案會偵測你對資料夾文件內容所有的變更。之後打上留言按Commit to main。
    https://ithelp.ithome.com.tw/upload/images/20210902/20133286ph60D2nlZR.png

  7. 按下Push origin
    https://ithelp.ithome.com.tw/upload/images/20210902/20133286P22mF1Ngxc.png

  8. 最後,回到剛剛建的儲存庫,按 Setting -> Pages -> 指定Source -> Save,點綠色框框出現的連結就可以連到你的網頁了! (點進去的頁面會是檔案名稱叫index的那一頁喔)
    https://ithelp.ithome.com.tw/upload/images/20210902/201332860gEBn82SrQ.png

要注意GitHub網站只支援HTML、CSS、JavaScript的靜態網站,放PHP他是不會理你的喔~
雖然感覺好像步驟很多,但是整個過程其實不到一分鐘喔!
如果超過一分鐘一定是手速太慢的問題,多按幾次就會成功了!


上一篇
[Day2] 人資秒跪! 全台唯一線上刮刮樂履歷上線囉!
下一篇
[Day4] 過年沒錢發紅包? 那就做一個手機版刮刮樂吧!
系列文
奇怪的知識增加了!原來程式還可以這樣用?!30
1
hankuo
iT邦新手 5 級 ‧ 2021-09-03 13:32:39

每日報到!推系列文不單單有趣而且這篇還很實用~

2
wilsonsujames
iT邦新手 4 級 ‧ 2021-09-03 13:59:48

https://ithelp.ithome.com.tw/upload/images/20210903/201226785RE63bSph9.png

用這個可以更快

lulu_meat iT邦新手 3 級 ‧ 2021-09-03 14:11:01 檢舉

原來超過一分鐘是我的問題!!
謝謝您的分享~

1
gior__ann
iT邦新手 4 級 ‧ 2021-09-03 14:31:50

請問 可以建立 A名稱.github.io 跟 B名稱.github.io ...
這樣嗎?

然後只要去 page setting 那邊設定 就可以有兩個不同的網頁的概念嗎?

lulu_meat iT邦新手 3 級 ‧ 2021-09-03 14:44:11 檢舉

是的!沒有錯~
印象中好像只要選公開,GitHub都不會管你要建幾個repositories~

gior__ann iT邦新手 4 級 ‧ 2021-09-03 14:47:22 檢舉

了解 ~謝謝 一直以為只能有一個頁面/images/emoticon/emoticon20.gif

解開困擾很久的疑惑 XD

1
dscwferp
iT邦高手 1 級 ‧ 2021-09-03 17:17:06

非常實用!

0
D路里
iT邦新手 5 級 ‧ 2021-09-30 12:31:30

推個 差不多三分鐘弄好
沒看這篇之前
我之前也以為一個帳號只能有一個 page

我要留言

立即登入留言