天天看點

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

----------------------------------第一部分--------------------------------

一、準備工作

1 安裝git

2 注冊github

二、開始搭建一個GitHub Pages

1 登入到github

右上角頭像旁邊:'+'号->New repository建立一個代碼托管倉庫

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

2  建立一個新的倉庫,建立完之後會自動跳轉到這個剛建立的倉庫的頁面

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

3 點選settings,往下翻頁,翻到GitHub Pages,然後選擇Source,預設是None,選擇為master分支,選完之後會自動重新整理settings,這個時候再翻到GitHub Pages,發現多一句Your site is ready to be published at https://githubcail.github.io/test/.,如圖2;

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

                                                                                                         圖1

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

                                                                                                         圖2

點選這個位址,就會打開一個頁面,也就是你建立的這個倉庫,到這裡一個github pages就已經建立好了,但是怎麼能把自己寫的代碼放到這個github pages呢?繼續往下看吧~~~~~~~~~~~~~~~~

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

-----------------------------------第二部分--------------------------------

1 将test倉庫拷貝到本地

選擇一個目錄,右鍵"git bash here",執行"git clone 你的GitHub Pages test倉庫位址"

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

上面那個目錄可以在新建立的test倉庫找到

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

2 拷貝成功之後,打開本地目錄,發現多了一個test檔案夾(檔案夾名字與倉庫名相同);test檔案夾中有一個README.md檔案,這個檔案就是開始初始化倉庫時生成的,生成在master分支,是以clone的時候就把這個檔案下到本地了。

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------
github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

3 将自己寫的網頁代碼拷貝到test檔案夾中

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

4 在test檔案夾下(進入後會顯示一個master,表示這個目錄是git管理下的master分支)執行git status檢視檔案狀态(所有還沒有被git管理的檔案和被git管理且被修改但還未送出(git commit)的檔案,顯示紅為色)

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

5 提示使用"git add ."指令将columntype.html狀态改變,有個"."表示送出新檔案(new)和被修改(modified)檔案,不包括被删除(deleted)檔案;

add完之後重新檢視一下狀态,發現檔案以及變成綠色了,表示已經準備好了被commit

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

6 送出代碼  git commit -m "備注資訊:代碼送出"

如果第一次commit,需要全局設定一下郵箱和使用者名(就是注冊時候的);

再送出就OK了(這裡如果開始先添加了SSH Key應該就不用設定,因為在添加SSH Key時會設定這2項)

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

7 把本地commit的代碼推送到git伺服器

可能會跳出提示讓你登入github,輸入賬号密碼登入一下就好了

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

通路你的github pages:在基礎位址上加上/hmtl檔案名

github Pages上搭建自己寫的頁面----------------------------------第一部分-------------------------------------------------------------------第二部分--------------------------------

OK ,到這裡就已經成功了~~