Plan v1.0

[Yukaii]

本專案有兩大目的：

1. 學習 Vue.js
2. 填以前挖的坑

一直以來 macOS 都沒有一個足夠好用的 Plurk App，用慣了 macOS 下優質 App 的我想當然爾應當貢獻一下。雖然截止目前並不是一個十分活躍的噗浪使用者，希望做完之後除了變腦粉外，也能順便推廣 Plurk。附帶一題，最終的 App 會是全平臺的，順便連 Windows App 都給他上架一下 😈

目前專案在做完「Basic Layout #4 」和「Basic API Usage #5 」之後，整體的樣貌就慢慢可以想像了。因為 Plurk API 實在有些歷史，近年來的改動也不多，API 的部分只要隨著 UI 的演進慢慢擴增即可 🎉

以下是 v1.0 需完成事項：

📓 架構、套件

• 導入 vue-router 導入 vue-router #7
• 導入 vuex Vuex integration #15
• Plurks poling 實作 Timeline 細修 #24
• 導入 vuex-persistedstate
• 導入 vue-keep-scroll 需要自己改寫才能相容 vue 2
• Notification

🎁 UI

• THE 河道 Plurks timeline #8
  • timeline day tag Timeline 更多細節 #14
  • other details polishment
• Plurk show 頁面 Plurk detail view #10
• 個人頁面 Profile About/Profile view #12
  • THE 視差滾動 Profile parallax #16
  • Slider dot & animation
  • 追蹤、加朋友功能
• CRUD 剩餘項目
• Replurk 0cb5c2a
• Every programmer needs a DARK MODE Basic Theming #17
• 發文界面，希望是獨立 Pop out Create plurk - Basic Layout #18
• 回覆 Plurk 界面
• Top Plurks
• 收藏頁面
• THE 貼圖 emoticons
• 設定頁面
• Scroll to refresh

📜 雜項

• 完成過場動畫，無限逼近原生 App
• App theming，噗浪令人最喜愛的地方就是能用 css 自訂個人頁面，如果 App 也能達成就太好了。
  • themed scrollbar 如果改顏色主題，預設的看起來就不太和諧 http://www.hesido.com/web.php?page=customscrollbar Scrollbar theming #19
• config: always on top mainWindow.isAlwaysOnTop()、mainWindow.setAlwaysOnTop(true)
• 多帳號支援
• 用 BrowserWindow setBounds 的 API 做個漂亮的 Image viewer
• webpack resolve path，import 的更漂亮一點 3da1e67
• plurk content DOM event inject 7f92e41
  • image opener。對所有 image 註冊事件，按了之後開 BrowserWindow。不知道 Vue 裡面能不能直接幫 dom 加 listener，還是要直接加 jquery 咧 XD e1e0a7c
  • handle external link 7f92e41
• open external link in browser or customized BrowserWindow
• electron devtools

[Yukaii]

TODOs

[Yukaii]

目前的設計主要是抄襲參考：

1. macOS 版的 twitter App
2. iOS 版的 Plurk App

當然素材那些也只能先用免費的，比如 fontawesome，之後再來研究看看第三方 Plurk App 一般是怎麽弄。我真的很不想自己拉 icon 呀 XDDD

[Yukaii]

會選用 Vue 絕對不是因為 GitLb 的這一篇：Why We Chose Vue.js，我也是今天看報紙才知道。目前寫起來是還沒到綁手綁腳啦，只是做一個 App 魔鬼藏在細節裡，加上又沒有 deadline 很容易永無止境開新坑啊 😆

Vue.js 寫到目前的確是沒啥奇技淫巧，Plain javascript 加上還算良好的 module code splitting 就足已應付目前為止的成果。不過隨著功能的完善又能走到多遠咧 XDD 繼續看下去。

[Yukaii]

Create plurk todos

• privacy => selection group ui ?
• emoicons
• Image upload

上一個 PR 有提到 #18 (comment)

編輯介面有大坑啊，網頁版的 Plurk 是用 textarea 弄的，App 端當然不能僅僅這樣實作 w，一定要有個inline 的貼圖插入才行，不過上傳圖片、emoji 等等又得多花些時間處裡，等於是實作一個小的 WYSIWYG 編輯器惹 😅

• https://code.tutsplus.com/tutorials/create-a-wysiwyg-editor-with-the-contenteditable-attribute--cms-25657

之後再開坑處裡

[Yukaii]

差不多可以開始重構了 😓 最大單一 component 長到 300 行

[Yukaii]

呀，最近事情一多這邊感覺這邊進度也不會走太快了，好險有前兩週的衝刺 XDD

[Yukaii]

靠腰，什麼叫還算活躍的開發啦！已經一個月沒更新了 Q__Q

[Yukaii]

狀態說明

2016 年底的 puraku 至今也快兩歲半了，老實說，自從在臉書 F2E 發宣傳文騙星星之後，這個專案就沒有 commit 了 （幹

兩年半在前端世界裡來說可說人間十年，Vue 快出 4 了，webpack 也朝 5 邁進，puraku 開起來噴一堆 warnings 和 errors，Plurk API 可能也有小改版吧，整個專案重寫說不定還比較快；想要體驗升級 legacy code 的話倒是個很棒的經驗 (X)

Possible Short-term Roadmap

1. 修正錯誤 (6 weeks)
   • 整理開發文件 (1st week)
   • 開 console 玩過現有的功能，把所有的 warning 和 error 開成 issue (1st week)
   • 基本的 linter + CI/CD 架構建立 (1st week)
   • 一週兩張票的速度把最 critical 的票解完 (3~5 weeks)
2. 升級套件與重構 (4 weeks)
   • 升級 webpack
   • 升級 Vue
   • 升級 Vuex
   • Review 各式套件
   • 整理 Vuex Store 形狀，與各種 action
   • 全面採用最新 es 語法
3. 長期維護和新功能 (TBD)

假如只有這個 Side Project 就能用這種速度做完吧 😆 很可惜並不是，所以時間乘二或三會更合理點。