如何快速搭建一個(gè)技術(shù)博客

前言

作為一個(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

image.png

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

image.png

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/

image.png

部署到github(Hugo為例)

  • 本機(jī) git 版本 >= 2.8
  • 一個(gè) github 賬號(hào)
  • build 好的 website

創(chuàng)建一個(gè)新的 Github 項(xiàng)目典蜕,項(xiàng)目名稱為 <username.github.io>

image.png

修改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 代碼

image.png
image.png
git push https://token@github.com/snowspace/snowspace.github.io.git
image.png

自定義域名

獲取IP断盛,添加域名解析

ping snowspace.github.io
PING snowspace.github.io (185.199.111.153): 56 data bytes
image.png

創(chuàng)建CNAME文件,并添加域名

cd static
touch CNAME

hugo.jiudian.link

驗(yàn)證域名

image.png
image.png

完成

image.png

總結(jié)

冰凍三尺非一日之寒愉舔,技術(shù)積累也不是一朝一夕的事情,需要長期堅(jiān)持伙菜、努力轩缤、堅(jiān)持努力。期待大家的技術(shù)博客??

我的博客:https://jiudian.link/

github:https://github.com/yangpeng7

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末贩绕,一起剝皮案震驚了整個(gè)濱河市火的,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌淑倾,老刑警劉巖馏鹤,帶你破解...
    沈念sama閱讀 217,734評(píng)論 6 505
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場離奇詭異娇哆,居然都是意外死亡湃累,警方通過查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 92,931評(píng)論 3 394
  • 文/潘曉璐 我一進(jìn)店門碍讨,熙熙樓的掌柜王于貴愁眉苦臉地迎上來治力,“玉大人,你說我怎么就攤上這事勃黍∠常” “怎么了?”我有些...
    開封第一講書人閱讀 164,133評(píng)論 0 354
  • 文/不壞的土叔 我叫張陵覆获,是天一觀的道長马澈。 經(jīng)常有香客問我,道長弄息,這世上最難降的妖魔是什么痊班? 我笑而不...
    開封第一講書人閱讀 58,532評(píng)論 1 293
  • 正文 為了忘掉前任,我火速辦了婚禮疑枯,結(jié)果婚禮上辩块,老公的妹妹穿的比我還像新娘。我一直安慰自己荆永,他們只是感情好废亭,可當(dāng)我...
    茶點(diǎn)故事閱讀 67,585評(píng)論 6 392
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著具钥,像睡著了一般豆村。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上骂删,一...
    開封第一講書人閱讀 51,462評(píng)論 1 302
  • 那天掌动,我揣著相機(jī)與錄音四啰,去河邊找鬼。 笑死粗恢,一個(gè)胖子當(dāng)著我的面吹牛柑晒,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播眷射,決...
    沈念sama閱讀 40,262評(píng)論 3 418
  • 文/蒼蘭香墨 我猛地睜開眼匙赞,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了妖碉?” 一聲冷哼從身側(cè)響起涌庭,我...
    開封第一講書人閱讀 39,153評(píng)論 0 276
  • 序言:老撾萬榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎欧宜,沒想到半個(gè)月后坐榆,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 45,587評(píng)論 1 314
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡冗茸,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 37,792評(píng)論 3 336
  • 正文 我和宋清朗相戀三年席镀,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片蚀狰。...
    茶點(diǎn)故事閱讀 39,919評(píng)論 1 348
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡愉昆,死狀恐怖,靈堂內(nèi)的尸體忽然破棺而出麻蹋,到底是詐尸還是另有隱情跛溉,我是刑警寧澤,帶...
    沈念sama閱讀 35,635評(píng)論 5 345
  • 正文 年R本政府宣布扮授,位于F島的核電站芳室,受9級(jí)特大地震影響,放射性物質(zhì)發(fā)生泄漏刹勃。R本人自食惡果不足惜堪侯,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 41,237評(píng)論 3 329
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望荔仁。 院中可真熱鬧伍宦,春花似錦、人聲如沸乏梁。這莊子的主人今日做“春日...
    開封第一講書人閱讀 31,855評(píng)論 0 22
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽遇骑。三九已至卖毁,卻和暖如春,著一層夾襖步出監(jiān)牢的瞬間落萎,已是汗流浹背亥啦。 一陣腳步聲響...
    開封第一講書人閱讀 32,983評(píng)論 1 269
  • 我被黑心中介騙來泰國打工炭剪, 沒想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人翔脱。 一個(gè)月前我還...
    沈念sama閱讀 48,048評(píng)論 3 370
  • 正文 我出身青樓奴拦,卻偏偏與公主長得像,于是被迫代替她去往敵國和親届吁。 傳聞我的和親對(duì)象是個(gè)殘疾皇子粱坤,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 44,864評(píng)論 2 354

推薦閱讀更多精彩內(nèi)容