Slack を TweetDeck にしてみた件 / slackdeck-proto

LT for M3 TechTalk

Transcript

1. Slack Λ TweetDeck ʹͯ͠Έͨ݅ @blue_1617
2. ࢲ͸୭ʁ blue (@blue_1617) https://blue0513.github.io/show_room/ 2 ࠓظͷΞχϝϦετ ‣ ߥͿΔقઅͷԵঁͲ΋Αɻ ‣ ͔ͭͯਆ्ͩͬͨͨͪ΁ ‣ Dr. STONE ‣ ൴ํͷΞετϥ ‣ μϯ·ͪ ‣ μϯϕϧԿΩϩ࣋ͯΔʁ ‣ ίοϓΫϥϑτ
3. ΈΜͳɺTwitter ޷͖ͩΖʁ 3
4. ΈΜͳɺTwitter ޷͖ͩΖʁ 4 Ұཡੑʹ͚ܽΔ͔ʁ
5. TweetDeck ͸࠷ߴͩͥʁ 5
6. TweetDeck ͸࠷ߴͩͥʁ 6 ֤ΫϥελຖʹΧϥϜΛΘ͚ͯදࣔͰ͖Δ ‣ Ұཡੑ Λ୲อͭͭ͠ɺ৘ใΛ ੔ཧ Ͱ͖Δ
7. ΈΜͳɺSlack ޷͖ͩΖʁ 7 ‣ ๛෋ͳϦΞΫγϣϯ ‣ εϨουػೳ ‣ ֤छγϣʔτΧοτ ‣ ଞΞϓϦͱͷ౷߹ ‣ etc ... etc ...
8. ΈΜͳɺSlack ޷͖ͩΖʁ 8 Ұཡੑʹ͚ܽΔ͔ʁ
9. 9 Slack ΋ҰཡੑΑͨ͘͘͠ͳ͍ʁ TweetDeck ෩ͳ Viewer Λ ࡞Ε͹͍͍ͷͰ͸ʁ blueࢯ
10. 10 Slack ΋ҰཡੑΑͨ͘͘͠ͳ͍ʁ TweetDeck ෩ͳ Viewer Λ ࡞Ε͹͍͍ͷͰ͸ʁ blueࢯ ఱ࠽తൃ૝
11. 11 https://github.com/blue0513/slackdeck-proto ࡞ͬͯΈͨ ~ SlackDeck Proto ~
12. 12 ׬શউརͨ͠ blue ࢯ ࡞ͬͯΈͨ ~ SlackDeck Proto ~ ✌
13. 13 ߏ੒ཁૉ Electron (Vanilla JS)
14. 14 ߏ੒ཁૉ Webview, Custom CSS
15. 15 ߏ੒ཁૉ ‣ main.js: 400ߦ ‣ ґଘ package ‣ electron-builder (Ϗϧυ༻) ‣ electron-store (ઃఆอଘ༻) ‣ Slack API: ඇ࢖༻
16. 16 ػೳ ‣ Multiple columns like TweetDeck ‣ Multiple workspaces ‣ Add/Remove columns by button ‣ Selectable CSS styles for each column ‣ Customizable settings as JSON ‣ Settings are saved and persisted
17. 17 Multiple columns like TweetDeck
18. 18 Multiple workspaces
19. 19 Add/Remove columns by button
20. 20 Selectable CSS styles for each column
21. 21 Customizable settings as JSON ‣ Main Slack URL ‣ Other Workspaces URL ‣ Column Settings
22. 22 Settings are saved and persisted ΞϓϦ൛Ͱ͸ settings.json ΛΠϯϙʔτ͢Δͱ ࣍ճىಈ࣌΋ͦͷઃఆΛҾ͖ܧ͙ ઃఆΠϯϙʔτը໘
23. ىಈɾ࣮ߦ 23 ‣ ΞϓϦ൛ʢMacOSʣ ‣ CUI ىಈ $ npm install $ npm start https://github.com/blue0513/slackdeck-proto/releases
24. ࠷ޙʹ 24 PR ଴ͬͯΔͥʂ blueࢯ