← 上一章:【狀況題】聽說 git push -f 這個指令很可怕,什麼情況可以用它呢? 下一章:【冷知識】一定要有 GitHub 才能得到別人更新的檔案嗎? →
使用 GitHub 免費製作個人網站
GitHub 除了提供免費的 Git Server 外,如果推上去的分支的名字剛好叫做 gh-pages
,你可以用 GitHub 當做靜態檔案的伺服器,它比一般外面虛擬主機要便宜得多,也安全得多。不過也有一些限制:
- 僅呈現靜態頁面內容,如果是什麼 PHP 或是 ASP 的它不會理你。
- 不支援
.htaccess
之類的設定檔,所以無法設定使用者密碼。 - 僅能使用 Git 上傳,沒有什麼 FTP 之類的東西。
- 不像 Repository 有 Private 的設定,所有的 GitHub Pages 都是公開的,甚至放在 Private 專案裡,頁面也是公開的。
整體上來說,GitHub Pages 的優點還是多於缺點,至少它穩定、安全又沒收你錢。接著就試試看如何把頁面放上去吧。
新增專案
首先在 GitHub 上開一個全新的專案:
在專案名稱的地方,填寫「username
.github.io」,這個 username
指的是自己的 GitHub 帳號,所以我這邊是填 eddiekao.github.io
。
接下來,我先找一個空的目錄,建立 index.html
,內容如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>你好,GitHub</title>
</head>
<body>
<h1>覺得厲害</h1>
</body>
</html>
完成之後,就是 git add
跟 git commit
的基礎指令了(可參考「把檔案交給 Git 控管」章節):
$ git add index.html
$ git commit -m "add index"
[master (root-commit) 80450b2] add index
1 file changed, 10 insertions(+)
create mode 100644 index.html
接下來就是一般的 Push 了,如果忘記怎麼操作可參閱「Push 上傳到 GitHub 」章節。
$ git remote add origin https://github.com/eddiekao/eddiekao.github.io.git
$ git push -u origin master
Counting objects: 3, done.
Delta compression using up to 4 threads.
Compressing objects: 100% (2/2), done.
Writing objects: 100% (3/3), 327 bytes | 327.00 KiB/s, done.
Total 3 (delta 0), reused 0 (delta 0)
To https://github.com/eddiekao/eddiekao.github.io.git
* [new branch] master -> master
Branch master set up to track remote branch master from origin.
順利推上去之後,回到專案的頁面看看應該可以看到東西已經推上去了:
這時候,輸入網址 https://eddiekao.github.io/ 便可連上頁面:
另外,坊間有其它像是 Jekyll 或是 Octopress 之類的好用套件,可以使用 Markdown 語法編寫,並幫你轉成 HTML 格式或是產生整個 Blog,甚至有方便的指令可一行指令自動上傳到 GitHub Pages 上。
本書所有內容(https://gitbook.tw/)以及我個人的 Blog(https://kaochenlong.com/)就是透過這些套件完成的,同時也是放在 GitHub Pages 上,又安全又穩定。詳情請見這些套件的官方網站介紹。
- Jekyll: https://jekyllrb.com/
- Octopress: http://octopress.org/
客制化網址
覺得原來的網址不好記嗎?沒關係,GitHub Pages 有支援客制化網址,只要簡單兩個步驟就可完成:
- 在該專案的根目錄放一個檔名為
CNAME
的檔案,內容只要放你想要客制化的那個網址。 - 請幫你管理網域的人,幫你設定一組 CNAME 指到
eddiekao.github.io.
即可。(你的網域管理人應該知道什麼是 CNAME)
參考網址:https://pages.github.com/
← 上一章:【狀況題】聽說 git push -f 這個指令很可怕,什麼情況可以用它呢? 下一章:【冷知識】一定要有 GitHub 才能得到別人更新的檔案嗎? →
Comments