前言
作為一個(gè)技術(shù)人,如果想長期來技術(shù)方向發(fā)展瑟俭,有一個(gè)技術(shù)博客是很有必要的违寞,它可以給我們帶來很多收益贞瞒,比如:
- 知識(shí)總結(jié)與沉淀,提升文字表達(dá)能力
- 教是最好的學(xué)
- 志同道合的朋友趁曼,自身影響力建設(shè)
舉例
業(yè)界很多前輩也都有自己的技術(shù)博客军浆,無論是前端還是移動(dòng)端,都在通過技術(shù)博客來輸出自己對(duì)于技術(shù)的思考挡闰。
阮一峰 http://www.ruanyifeng.com/blog/
王纹谷凇:https://onevcat.com/
jake wharton:https://jakewharton.com/blog/
如何
我們?nèi)绾慰焖贀碛幸粋€(gè)技術(shù)博客呢?總的來說有以下三種方式:
第三方博客平臺(tái)
- 掘金
- 簡書
- 微信公眾號(hào)
- CSDN
- segmentfault
優(yōu)點(diǎn):流量大摄悯,無需任何開發(fā)赞季,注冊(cè)賬號(hào)即可使用
缺點(diǎn):可定制性差
自建
優(yōu)點(diǎn):可定制性極強(qiáng)
缺點(diǎn):開發(fā)量較大
博客框架
- Hugo
- Hexo
- VuePress
優(yōu)點(diǎn):可定制性較強(qiáng)申钩,主題較為豐富
缺點(diǎn):如需定制主題,有一定開發(fā)量
接下來我們主要介紹第三種方式瘪阁。
Hugo
The world’s fastest framework for building websites
官網(wǎng):https://gohugo.io/
github:https://github.com/gohugoio/hugo
安裝 Hugo
brew install hugo
查看版本
hugo version
創(chuàng)建網(wǎng)站
hugo new site quickstart
添加主題
cd quickstart
git init
git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke
配置主題
echo theme = \"ananke\" >> config.toml
寫文章
hugo new posts/my-first-post.md
本地預(yù)覽
hugo server -D
Build
hugo -D
Hexo
A fast, simple & powerful blog framework
官網(wǎng):https://hexo.io/
github:https://github.com/hexojs/hexo
安裝 Hexo
npm install -g hexo-cli
創(chuàng)建博客
hexo init blog
安裝依賴
cd blog && npm install
本地運(yùn)行
hexo server
VuePress
Vue-powered Static Site Generator
官網(wǎng):https://vuepress.vuejs.org/
github:https://github.com/vuejs/vuepress
前提
VuePress 需要 Node.js >= 8.6
創(chuàng)建并進(jìn)入一個(gè)新目錄
mkdir vuepress-starter && cd vuepress-starter
初始化
yarn init # npm init
安裝依賴
yarn add -D vuepress # npm install -D vuepress
創(chuàng)建文章
mkdir docs && echo '# Hello VuePress' > docs/README.md
添加配置
"scripts": {
"docs:dev": "vuepress dev docs",
"docs:build": "vuepress build docs"
}
本地啟動(dòng)
yarn docs:dev # npm run docs:dev
示例
https://example.vuepress-theme-blog.billyyyyy3320.com/
部署到github(Hugo為例)
- 本機(jī) git 版本 >= 2.8
- 一個(gè) github 賬號(hào)
- build 好的 website
創(chuàng)建一個(gè)新的 Github 項(xiàng)目典蜕,項(xiàng)目名稱為 <username.github.io>
修改config.toml文件
baseURL = 'https://snowspace.github.io/'
languageCode = 'en-us'
title = 'My New Hugo Site'
theme = "ananke"
生成靜態(tài)頁面
在項(xiàng)目根目錄下執(zhí)行 hugo
Push 項(xiàng)目
cd public
git init
git add *
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/snowspace/snowspace.github.io.git
git push -u origin main
remote: Support for password authentication was removed on August 13, 2021. Please use a personal access token instead.
如遇到此錯(cuò)誤需使用 token 方式 push 代碼
git push https://token@github.com/snowspace/snowspace.github.io.git
自定義域名
獲取IP断盛,添加域名解析
ping snowspace.github.io
PING snowspace.github.io (185.199.111.153): 56 data bytes
創(chuàng)建CNAME文件,并添加域名
cd static
touch CNAME
hugo.jiudian.link
驗(yàn)證域名
完成
總結(jié)
冰凍三尺非一日之寒愉舔,技術(shù)積累也不是一朝一夕的事情,需要長期堅(jiān)持伙菜、努力轩缤、堅(jiān)持努力。期待大家的技術(shù)博客??
github:https://github.com/yangpeng7