基于MarkDown和Github圖床以及SourceTree的一站式文章編輯和發布

前提說明

對于一篇技術文章而言，技術文章一般開始于一個問題的解決或者一個想法的產生，文章的寫作過程同時也是筆記整理和思考總結的過程。一般來說，寫作主要包括三個過程，寫作前，寫作中，寫作后。文章的發布主要包括三個部分，文字內容，圖片，文章樣式。

寫作前

在解決一個問題時，有對內分析思考和對外尋求幫助兩種方式，無論那種方式都不可避免信息碎片的產生。隨著對問題的探究逐漸深入，問題樹開始枝繁葉茂，離最初的問題越來越遠，大量的信息碎片和重復勞動也分散了時間精力。因此需要對探究的過程進行記錄，思維導圖雖然可以解決這個問題，但是不能很好的解決信息碎片和全局檢索的問題，同時也無法解決知識的可遷移性問題。對于這一點，推薦使用 Mybase 軟件。輕量記錄也可以使用 CherryTree 替代，雖然軟件的程序源碼中使用了 MarkDown 語法，但遺憾的是提供給用戶的編輯器并不支持 MarkDown 語法。在這一過程中，重點是記錄所需要的信息碎片和信息碎片的來源，并采用樹形結構組織信息，網狀更佳，對于所使用的記錄軟件，應支持高級搜索。

寫作中

在解決一個問題后，對問題進行場景復現并抽象化，思考問題出現的原因和解決問題的過程以及最終的解決方式能夠有效的幫助我們更好的理解問題的本質。通過寫作，對問題的認識更加清晰，也便于日后遇到類似的問題時，通過復盤曾經的解決方案，更加高效的解決當前所遇到的問題。

寫作后

對于一篇技術文章，既是自己解決問題和思考的筆記，同時也是一個問題的解決方案。出于開源共享和學習交流以及便于自己查找又或是作為本地備份等原因，經常需要在網上發布文章。對于只是簡單記錄分享的人而言，自己建站和購買圖床都不是必要的。對于國內的博客平臺，相比于 CSDN，博客園簡潔干凈，自定義程度高，是個不錯的選擇。部分人選擇博客園和微信公眾號雙平臺發布，本文便是對這一問題的解決提出自己的方案。

文章管理

對于一篇技術文章，為了保證文章內容的可遷移性，建議采用 MarkDown 語法編寫，MarkDown 同時也能做到文本和樣式分離，保證了文章內容的本質不變性以及簡約性。

對于本地保存，采用 Typora 或 MarkdownPad 2 作為 MarkDown 編輯器，并且這兩款編輯器都支持自定義預覽頁面 CSS 代碼。
對于發布在博客園，采用官方提供的 MarkDown 編輯器，博客園支持自定義頁面 CSS 代碼和 HTML 代碼，自由程度高。
對于發布在公眾號，采用第三方提供的 Markdown Nice 作為 MarkDown 編輯器，Markdown Nice 支持自定義頁面 CSS 代碼。
對于發布在其他平臺，采用第三方提供的 Markdown Here 作為 MarkDown 編輯器，Markdown Here 支持自定義頁面 CSS 代碼。

圖片管理

對于一篇技術文章，為了保證文章內容的可靠性，就要保證圖片的可靠性。為了便于交流分享，本地圖片應該能夠簡單快速的替換為網頁圖片；為了在網頁圖片丟失的情況下本地依舊能夠正常閱讀，網頁圖片應該能夠簡單快速的替換為本地圖片。為了減少空間占用，不建議建立兩個版本的文件。因此，本地圖片文件名與網頁圖片文件名應同名，為了便于管理和備份，本地和云端的圖片應能以文件夾的形式進行組織管理。

圖片操作方法

操作規范

尺寸大小：建議不超過 800x800
命名規范:Image_%y-%m-%d_%h-%n-%s
引用規范:![顯示文字](G:/Pictrue_Bed/Image_%y-%m-%d_%h-%n-%s '提示文字')
- %h：文件 ID
- %n：文件圖片 ID
- %s：文件圖片冗余 ID
本地臨時路徑
./${filename}/
本地圖床路徑
G:/Pictrue_Bed/img/
云端路徑前綴(Github 圖床；CDN 加速)(已廢棄)
https://cdn.jsdelivr.net/gh/Sky-seeker/Pictrue_Bed/img/
云端路徑前綴(Backblaze B2 云存儲)
https://f000.backblazeb2.com/file/Pictrue-Bed/img/

操作說明

網頁上顯示的圖片大小只與圖片的像素（px）有關，與打印尺寸（厘米、英寸、DPI）無關
對于同一篇文章，應保證圖片文件名的年、月、日、時相同，分用于定位圖片在文章中出現的順序，秒用于修改文章時的圖片順序冗余。
如果文章較多，根據實際情況建立年、月、日文件夾以進一步細分。
在文章編輯時，先將臨時圖片暫存于本地臨時路徑中以便于管理，Typora 支持本地路徑設置。
文章定稿并且圖片已經規范命名后，將圖片復制到本地圖床文件夾中。如果只需要本地訪問，批量替換圖片的引用路徑為本地圖床。
GitHub 本地圖床倉庫的圖片上傳到云端倉庫后，批量替換圖片的引用路徑為云端倉庫。

圖片上傳工具選擇

Picgo

雖然可以上傳圖片，但不支持圖片管理，也不方便后期對圖片進行管理。

SourceTree

Git 管理工具，配置起來并不比 Picgo 復雜，能夠輕松高效的管理圖片。
配置好軟件和倉庫后，依次點擊暫存所有->提交->推送就可以完成圖片的上傳，還可以提交圖片描述信息。

注意事項

圖片防盜鏈和 GitHub 訪問加速

對于同一文件，github 主站、github 素材服務器、jsDelivr CDN 加速的訪問鏈接分別如下。

![思考128x128 github主站](https://github.com/Sky-seeker/Pictrue_Bed/blob/master/img/sky-seeker.jpg "思考_128x128")

![思考128x128 github素材服務器](https://raw.githubusercontent.com/Sky-seeker/Pictrue_Bed/master/img/sky-seeker.jpg "思考_128×128")

![思考128x128 cdn加速](https://cdn.jsdelivr.net/gh/Sky-seeker/Pictrue_Bed/img/sky-seeker.jpg "思考_128x128")