前言
近來(lái)睬辐，前端大佬要求個(gè)人要針對(duì)公司的業(yè)務(wù)去想一個(gè)項(xiàng)目去提升下自己的技能摩瞎，自己糾結(jié)了段時(shí)間篮绿，最后決定使用github的api并結(jié)合d3js來(lái)學(xué)習(xí)學(xué)習(xí)（畢竟前端還是偏向數(shù)據(jù)可視化的，后期項(xiàng)目中應(yīng)該可以使用到运挫，強(qiáng)行貼邊針對(duì)公司的業(yè)務(wù)）状共，別問(wèn)我為什么不選擇echart...
搭建項(xiàng)目過(guò)程
一、使用element-ui結(jié)合vuejs進(jìn)行項(xiàng)目的搭建
- 使用vue-cli進(jìn)行搭建（當(dāng)然你也可以一步一步搭建谁帕，我這里是省時(shí)間）
- 引入element-ui 執(zhí)行命令
npm install --save element-ui峡继，更加詳細(xì)的內(nèi)容參考官網(wǎng)
二、圖標(biāo)我選擇awesome-font
- 這里的安裝我直接是使用cdn在index.html文件中進(jìn)行引用
【備注】1.通過(guò)npm安裝的awesome-font打包后失效 2.element-ui提供的icon有限
三匈挖、使用axios
使用axios進(jìn)行http的處理碾牌，為神馬不選擇vue-resource呢颠猴？看者到npm上面搜下就知道了...
四、使用less與處理器
你可以根據(jù)個(gè)人的使用愛(ài)好使用與處理器加速開(kāi)發(fā)效率小染，個(gè)人習(xí)慣使用less
五、使用d3
我這里放棄了echart而選擇d3贮折，原因有二：
- d3的定制性更高
- 為了逼自己學(xué)英文裤翩，看d3官網(wǎng)
【備注】d3的引入方式有點(diǎn)特別import * as d3 from 'd3'
六、其他
我還使用了其他的一些包调榄，比如：
- 處理時(shí)間的moment
- javascript的使用函數(shù)庫(kù)lodash
- etc
目前效果
目前已經(jīng)搭建好項(xiàng)目踊赠，并且完成了簡(jiǎn)單的登錄，退出和調(diào)用github的api完善個(gè)人主頁(yè)每庆，附上gif圖：
鏈接
代碼倉(cāng)庫(kù)https://github.com/reng99/github-admin 求star咯
線上演示地址http://reng99.cc/github-admin/ 我這里默認(rèn)使用自己的github名(reng99)登錄筐带，看者可以換成自己的github倉(cāng)庫(kù)名登錄（密碼不用改）
結(jié)尾
歡迎指正
