Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Slack を TweetDeck にしてみた件 / slackdeck-proto
Search
Taiju Aoki
July 18, 2019
Programming
0
3k
Slack を TweetDeck にしてみた件 / slackdeck-proto
LT for M3 TechTalk
Taiju Aoki
July 18, 2019
Tweet
Share
More Decks by Taiju Aoki
See All by Taiju Aoki
本番運用中 Oracle を破壊してしまった話 ~ 破壊と創世 ~ / Oracle Destruction and Creation
blue0513
0
3k
オンプレ to オンプレした話/on-premises2on-premises
blue0513
0
3k
GitもCIもテストもないプロジェクトでデプロイを自動化するまでの道 / rebuild of DevOps
blue0513
0
3.2k
Git & GitLab & コードレビューって? / about Git, GitLab, CodeReview
blue0513
0
240
ElectronでSlackをさらに便利にしちゃう / Slack with Electron
blue0513
3
850
GitHub の README をいい感じにする / Cool Readme
blue0513
3
1.7k
Emacs × Sound やってみた / Emacs with Sound
blue0513
1
1k
知ってるとお得な iTerm2 と zsh/bash の小技
blue0513
3
840
クラウド電子カルテを支える魂の技術
blue0513
0
2.5k
Other Decks in Programming
See All in Programming
AWS発のAIエディタKiroを使ってみた
iriikeita
1
190
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
120
Navigating Dependency Injection with Metro
zacsweers
3
3.5k
OSS開発者という働き方
andpad
5
1.7k
時間軸から考えるTerraformを使う理由と留意点
fufuhu
16
4.8k
私の後悔をAWS DMSで解決した話
hiramax
4
210
Flutter with Dart MCP: All You Need - 박제창 2025 I/O Extended Busan
itsmedreamwalker
0
150
HTMLの品質ってなんだっけ? “HTMLクライテリア”の設計と実践
unachang113
4
2.9k
MCPとデザインシステムに立脚したデザインと実装の融合
yukukotani
4
1.5k
🔨 小さなビルドシステムを作る
momeemt
4
690
FindyにおけるTakumi活用と脆弱性管理のこれから
rvirus0817
0
540
「待たせ上手」なスケルトンスクリーン、 そのUXの裏側
teamlab
PRO
0
570
Featured
See All Featured
How To Stay Up To Date on Web Technology
chriscoyier
790
250k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
7
850
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
How to Think Like a Performance Engineer
csswizardry
26
1.9k
Put a Button on it: Removing Barriers to Going Fast.
kastner
60
4k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
52
5.6k
Why Our Code Smells
bkeepers
PRO
339
57k
ReactJS: Keep Simple. Everything can be a component!
pedronauck
667
120k
Making Projects Easy
brettharned
117
6.4k
Responsive Adventures: Dirty Tricks From The Dark Corners of Front-End
smashingmag
252
21k
It's Worth the Effort
3n
187
28k
Fantastic passwords and where to find them - at NoRuKo
philnash
52
3.4k
Transcript
Slack Λ TweetDeck ʹͯ͠Έͨ݅ @blue_1617
ࢲ୭ʁ blue (@blue_1617) https://blue0513.github.io/show_room/ 2 ࠓظͷΞχϝϦετ ‣ ߥͿΔقઅͷԵঁͲΑɻ ‣ ͔ͭͯਆ्ͩͬͨͨͪ
‣ Dr. STONE ‣ ൴ํͷΞετϥ ‣ μϯ·ͪ ‣ μϯϕϧԿΩϩ࣋ͯΔʁ ‣ ίοϓΫϥϑτ
ΈΜͳɺTwitter ͖ͩΖʁ 3
ΈΜͳɺTwitter ͖ͩΖʁ 4 Ұཡੑʹ͚ܽΔ͔ʁ
TweetDeck ࠷ߴͩͥʁ 5
TweetDeck ࠷ߴͩͥʁ 6 ֤ΫϥελຖʹΧϥϜΛΘ͚ͯදࣔͰ͖Δ ‣ Ұཡੑ Λ୲อͭͭ͠ɺใΛ ཧ Ͱ͖Δ
ΈΜͳɺSlack ͖ͩΖʁ 7 ‣ ๛ͳϦΞΫγϣϯ ‣ εϨουػೳ ‣ ֤छγϣʔτΧοτ ‣
ଞΞϓϦͱͷ౷߹ ‣ etc ... etc ...
ΈΜͳɺSlack ͖ͩΖʁ 8 Ұཡੑʹ͚ܽΔ͔ʁ
9 Slack ҰཡੑΑͨ͘͘͠ͳ͍ʁ TweetDeck ෩ͳ Viewer Λ ࡞Ε͍͍ͷͰʁ blueࢯ
10 Slack ҰཡੑΑͨ͘͘͠ͳ͍ʁ TweetDeck ෩ͳ Viewer Λ ࡞Ε͍͍ͷͰʁ blueࢯ ఱ࠽తൃ
11 https://github.com/blue0513/slackdeck-proto ࡞ͬͯΈͨ ~ SlackDeck Proto ~
12 શউརͨ͠ blue ࢯ ࡞ͬͯΈͨ ~ SlackDeck Proto ~ ✌
13 ߏཁૉ Electron (Vanilla JS)
14 ߏཁૉ Webview, Custom CSS
15 ߏཁૉ ‣ main.js: 400ߦ ‣ ґଘ package ‣ electron-builder
(Ϗϧυ༻) ‣ electron-store (ઃఆอଘ༻) ‣ Slack API: ඇ༻
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 Multiple columns like TweetDeck
18 Multiple workspaces
19 Add/Remove columns by button
20 Selectable CSS styles for each column
21 Customizable settings as JSON ‣ Main Slack URL ‣
Other Workspaces URL ‣ Column Settings
22 Settings are saved and persisted ΞϓϦ൛Ͱ settings.json ΛΠϯϙʔτ͢Δͱ ࣍ճىಈ࣌ͦͷઃఆΛҾ͖ܧ͙
ઃఆΠϯϙʔτը໘
ىಈɾ࣮ߦ 23 ‣ ΞϓϦ൛ʢMacOSʣ ‣ CUI ىಈ $ npm install
$ npm start https://github.com/blue0513/slackdeck-proto/releases
࠷ޙʹ 24 PR ͬͯΔͥʂ blueࢯ