一秒鐘把Github項(xiàng)目變成前端網(wǎng)站

[[271764]]

GitHub Pages大家可能都知道，常用的做法，是建立一個(gè)gh-pages的分支，通過setting里的設(shè)置的GitHub Pages模塊可以自動(dòng)創(chuàng)建該項(xiàng)目的網(wǎng)站。

這里經(jīng)常遇到的痛點(diǎn)是，master遇到變更，經(jīng)常需要去sync到gh-pages，特別是純web前端項(xiàng)目，這樣的痛點(diǎn)是非常地痛。

Github官方可能嗅覺到了該痛點(diǎn)，出了個(gè)master當(dāng)作網(wǎng)站是選項(xiàng)，太有用了。

選擇完master branch之后，master自動(dòng)變成了網(wǎng)站。master所有的提交會(huì)自動(dòng)更新到網(wǎng)站。

精準(zhǔn)分享關(guān)鍵代碼

比如你有一個(gè)文件里的某一行代碼寫得非?？犰呕蛘哧P(guān)鍵，想分享一下。

可以在url后面加上#L行號(hào)

比如，點(diǎn)擊下面這個(gè)url：

https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L240

你便會(huì)跳到alloy_touch.js的第240行。

那么問題來了?如果我是一段代碼，即多行代碼想分享呢?也很簡單：url后面加上#L開始行號(hào)-L結(jié)束行號(hào)。

比如，AlloyTouch的運(yùn)動(dòng)緩動(dòng)和逆向緩動(dòng)函數(shù)如下面代碼段所示：

https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L39-L45 

其實(shí)也不用記憶你直接在網(wǎng)址后面操作，github自動(dòng)會(huì)幫你生成url。比如你點(diǎn)擊39行，url變成了：

https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L39 

再按住shift點(diǎn)擊45行，url變成了：

https://github.com/AlloyTeam/AlloyTouch/blob/master/alloy_touch.js#L39-L45 

然后你這個(gè)url就可以復(fù)制分享出去了，點(diǎn)擊這個(gè)url的人自動(dòng)會(huì)跳到39行，并且39-45行高亮。

通過提交的msg自動(dòng)關(guān)閉issues。

比如有人提交了個(gè)issues:

https://github.com/AlloyTeam/AlloyTouch/issues/6

然后你去主干上改代碼，改完之后提交填msg的時(shí)候，填入：

fix https://github.com/AlloyTeam/AlloyTouch/issues/6 

這個(gè)issues會(huì)自動(dòng)被關(guān)閉。當(dāng)然不僅僅是fix這個(gè)關(guān)鍵字。下面這些關(guān)鍵字也可以：

• close
• closes
• closed
• fixes
• fixed
• resolve
• resolves
• resolved

通過HTML方式嵌入Github

如下面所示，user和repo改成你想要展示的便可以

https://github.com/AlloyTeam/AlloyTouch/issues/6

插入之后你便可以看到這樣的展示：

gitattributes設(shè)置項(xiàng)目語言：

如上圖所示，github會(huì)根據(jù)相關(guān)文件代碼的數(shù)量來自動(dòng)識(shí)別你這個(gè)項(xiàng)目是HTML項(xiàng)目還是Javascript項(xiàng)目。

這就帶來了一個(gè)問題，比如AlloyTouch最開始被識(shí)別成HTML項(xiàng)目。

因?yàn)镠TML例子比JS文件多。怎么辦呢?gitattributes來幫助你搞定。在項(xiàng)目的根目錄下添加如下.gitattributes文件便可

https://github.com/AlloyTeam/AlloyTouch/blob/master/.gitattributes

里面的：

*.html linguist-language=JavaScript 

主要意思是把所有html文件后綴的代碼識(shí)別成js文件。

查看自己項(xiàng)目的訪問數(shù)據(jù)

在自己的項(xiàng)目下，點(diǎn)擊Graphs，然后再點(diǎn)擊Traffic如下所示：

里面有Referring sites和Popular content的詳細(xì)數(shù)據(jù)和排名。如：Referring sites。

其中Referring sites代表大家都是從什么網(wǎng)站來到你的項(xiàng)目的，Popular content代表大家經(jīng)?？茨沩?xiàng)目的哪些文件。

trending排行榜

上面教大家設(shè)置語言了，下面可以看看怎么查看某類型語言的每日排行榜。比如js每日排行榜：

https://github.com/trending/javascript?since=daily

https://github.com/trending/html?since=daily

https://github.com/trending/css?since=daily

Github推薦：https://github.com/explore

其他

issue中輸入冒號(hào) : 添加表情

任意界面，shift + ?顯示快捷鍵

issue中選中文字，R鍵快速引用

文章作者：當(dāng)耐特

原文鏈接：http://1t.click/mfz