寫於 2016.01.18
專案地址: github.com/jrainlau/ma…
demo地址: jrainlau.github.io/markcook/
首先介紹一下Markcook,顧名思義,可以理解為“煮markdown的鍋”……
她是一個開源的,免費的,簡潔且高效的markdown編輯器,當然你也可以把她作為本地客戶端使用。
非常的簡單,高效,沒有多餘的東西。
她的優點有很多:
- 實時預覽,所見即所得,無需擔心排版問題。
- 提供了齊全的快捷按鈕,無需查閱markdown語法即可進行排版。
- 完全離線的單頁應用,可以把gh-pages分支的檔案clone下來,作為本地客戶端使用。
- 提供本地快取功能,防止重要內容丟失。
Markcook介紹完了,就談一談開發她的過程吧。
由於不久前終於(學會)建立了自己的個人部落格,需要用md來寫文。在寫文的過程中,開始構思,能不能自己也寫一個能解析md的編輯器出來呢。因為已經掌握vue.js,同時它官網也有相似的例子,覺得這個idea可以有,於是馬上就動手做起。
首先花了一個上午學習vue-cli以及webpack的基本使用方法(之前使用vue的開發方案是用fis3+modjs進行的,可參考我另外一篇文章FIS3+mod.js開發方案線上上部署時出現無法找到檔案的bug的解決過程)。才發現原來用webpack進行開發是完全不同的體驗啊,很開心又學會了一門新技能。無比感謝所在Q群的各位大神的無私幫助。
在學習了基本的webpack知識以後,通過vue-cli初始化專案,開始實際的開發。因為功能不復雜,所以開發得很快,在一個下午之內就把功能及樣式都搞定了。樣式是使用bootstrap-material這個框架,因為個人特別喜歡material design的設計。同時為了凸顯“應用”的特徵,把滾動條的樣式也進行了定製,在webkit核心瀏覽器裡面顯示效果蠻漂亮的o(∩_∩)o
以前特別羨慕有線上作品的人,因為自己後端知識比較匱乏,所以一直不知道如何把作品部署到伺服器。這算是我第一個線上的開源作品,在輸入地址成功線上上瀏覽到我的專案的時候,那一刻真的特別激動。對大神來說可能這太小兒科了,但對我來說卻是一份很不一樣的經歷。
專案會繼續維護,以後可能會加入更多的功能,或者和其他的專案合併。反正學一點做一點吧哈哈~
Thanks for reading, see ya next time!