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
Electron で Evernote クライアントを作ってみた
Search
Kenta Okamoto
February 24, 2017
Programming
5
2.4k
Electron で Evernote クライアントを作ってみた
社内の勉強会で話したスライドです。
Kenta Okamoto
February 24, 2017
Tweet
Share
More Decks by Kenta Okamoto
See All by Kenta Okamoto
リリースして 6 年経つ Gem にどう手を入れるか
chocoby
0
430
ErgoDox を買った話
chocoby
0
890
デザイナーのための tmux 超入門
chocoby
7
10k
おすすめ gem
chocoby
2
1.9k
Other Decks in Programming
See All in Programming
Amazon RDS 向けに提供されている MCP Server と仕組みを調べてみた/jawsug-okayama-2025-aurora-mcp
takahashiikki
1
110
Compose Multiplatform × AI で作る、次世代アプリ開発支援ツールの設計と実装
thagikura
0
160
HTMLの品質ってなんだっけ? “HTMLクライテリア”の設計と実践
unachang113
4
2.9k
FindyにおけるTakumi活用と脆弱性管理のこれから
rvirus0817
0
520
1から理解するWeb Push
dora1998
7
1.9k
2025 年のコーディングエージェントの現在地とエンジニアの仕事の変化について
azukiazusa1
24
12k
MCPでVibe Working。そして、結局はContext Eng(略)/ Working with Vibe on MCP And Context Eng
rkaga
5
2.3k
AI Coding Agentのセキュリティリスク:PRの自己承認とメルカリの対策
s3h
0
230
AIを活用し、今後に備えるための技術知識 / Basic Knowledge to Utilize AI
kishida
22
5.8k
GitHubとGitLabとAWS CodePipelineでCI/CDを組み比べてみた
satoshi256kbyte
4
240
Ruby×iOSアプリ開発 ~共に歩んだエコシステムの物語~
temoki
0
320
Flutter with Dart MCP: All You Need - 박제창 2025 I/O Extended Busan
itsmedreamwalker
0
150
Featured
See All Featured
Navigating Team Friction
lara
189
15k
The Straight Up "How To Draw Better" Workshop
denniskardys
236
140k
XXLCSS - How to scale CSS and keep your sanity
sugarenia
248
1.3M
Building Applications with DynamoDB
mza
96
6.6k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
113
20k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
12
1.1k
Designing Dashboards & Data Visualisations in Web Apps
destraynor
231
53k
VelocityConf: Rendering Performance Case Studies
addyosmani
332
24k
What's in a price? How to price your products and services
michaelherold
246
12k
[Rails World 2023 - Day 1 Closing Keynote] - The Magic of Rails
eileencodes
36
2.5k
Save Time (by Creating Custom Rails Generators)
garrettdimon
PRO
32
1.6k
A better future with KSS
kneath
239
17k
Transcript
Electron Ͱ Evernote ΫϥΠΞϯτΛ࡞ͬͨ 2017/02/23 Kenta Okamoto GitHub: @chocoby
ͱ͜ΖͰɺ Evernote ͬͯ·͔͢ʁ
·͋·͋ͬͯΔ • هͳͲͷϝϞ • ϚχϡΞϧͷ PDF • ॻྨͳͲͷεΩϟϯ • Ͷ͍͜͵ͷ͓ؾʹೖΓը૾
1 ݄ Evernote for iOS ϝδϟʔόʔδϣϯΞοϓ
ࠈ • Ξοϓσʔτޙʹىಈ͠ͳ͍ • ϊʔτͷλΠτϧத͕දࣔ͞Εͨޙʹύείʔυ ೖྗ͕දࣔ͞ΕΔ • ىಈޙʹಉظ͕ऴΘΔ·Ͱૢ࡞Λड͚͚ͳ͍ • Χϝϥͷىಈʹ͕͔͔࣌ؒΔ
• ࣸਅΛࡱͬͨ͋ͱ 20 ඵ͘Β͍ݻ·Δ
ͦΜͳকདྷ͕৺ͳ Evernote Ͱ͕͢
Evernote αʔυύʔςΟͷ ΞϓϦ͕๛
͓ؾʹೖΓ PostEver 2 • ܰշͳϝϞΞϓϦ • γϡοͱىಈͯ͠γϡοͱॻ͚Δ • ୯ҐͰϊʔτ͕࡞ΒΕΔͷͰه༻్ ʹ͍ͬͯΔ
None
ಉ͜͡ͱ͕Ͱ͖Δ Mac ΞϓϦΛ࡞Γ͍ͨ
ษڧձۦಈ։ൃ • ΰʔϧͱΓ͋͑ͣ Evernote ʹߘͰ͖Δ͜ ͱ
Ebari • ΤόΔɺΤόΓ • άάΔɺΈ͍ͨͳ • ͪΐͬͱඍົ…
σϞ
͘͡ • ͬͨπʔϧ • SDK/ೝূ • ENML • ϝχϡʔόʔɺγϣʔτΧοτΩʔ •
·ͱΊ
͘͡ • ͬͨπʔϧ • SDK/ೝূ • ENML • ϝχϡʔόʔɺγϣʔτΧοτΩʔ •
·ͱΊ
ͬͨπʔϧ • Electron • Web ։ൃऀΒ͘͠ • Boilerplate Λ͏ •
ڊਓͷݞʹཱͭ • Boilerplate ͋·Γ͖Ͱͳ͍ͷ͕ͩɺ͍͔ͪΒ ڥΛ࡞͍ͬͯΔ͏ͪʹ͖Δ
electron-vue • https://github.com/SimulatedGREG/ electron-vue • Vue Λ͙ͬͯ͢ʹ Electron ΞϓϦͷ։ൃΛ ࢝ΊΒΕΔ
• ࣮ࡍͦ͏ͩͬͨ
ΓΓ • DevTools • HTML/CSS/JS ϓϦϓϩηοα • Hot Module Replacement
• ESLint (Standard, Airbnb) • Unit Testing, E2E Testing • ༻ͷύοέʔδ࡞ (electron-packager, electron-builder)
͘͡ • ͬͨπʔϧ • SDK/ೝূ • ENML • ϝχϡʔόʔɺγϣʔτΧοτΩʔ •
·ͱΊ
Evernote JavaScript SDK • https://github.com/evernote/evernote-sdk-js • Python, Ruby, iOS, Android
ͳͲͳͲʹରԠ • http://dev.evernote.com/doc/reference/
None
ೝূ • OAuth 1.0 • Developer token • GitHub Ͱ͍͏
Personal access token • ࣌ؒͷ߹্ࠓճͪ͜Β • Sandbox ڥ͕͋Γͦ͜Ͱ։ൃ͢Δ • ਃ͢Δͱຊ൪ڥͰ OAuth ͕͑ΔͬΆ͍ʁ
͘͡ • ͬͨπʔϧ • SDK/ೝূ • ENML • ϝχϡʔόʔɺγϣʔτΧοτΩʔ •
·ͱΊ
ENML • Evernote Markup Language • ಠࣗϚʔΫΞοϓݴޠ • XML
<!DOCTYPE en-note SYSTEM "http://xml.evernote.com/pub/enml2.dtd"> <en-note> <div> <span style="color: rgb(51, 102,
255);"> <span style="font-size: 36px;">͜Μʹͪʂੈքʂ</span> </span> </div> </en-note>
ENML • ENML Λѻ͏Α͛͞ͳϥΠϒϥϦͳ͔ͬͨ • ͍͔ͭ͘ XML Λѻ͏ϥΠϒϥϦ͋Δ͚Ͳɺ ͲͷϥΠϒϥϦߏͷ࡞Γํʹ಄Λ͏ •
දݱྗ͍͢͝ͱࢥ͏͚Ͳ… • ࠓճ͜͜ʹҰ൪࣌ؒΛͬͨؾ͕͢Δ
͘͡ • ͬͨπʔϧ • SDK/ೝূ • ENML • ϝχϡʔόʔɺγϣʔτΧοτΩʔ •
·ͱΊ
ϝχϡʔόʔ • σϑΥϧτΟϯυ͕දࣔ͞ΕΔ • ϝχϡʔόʔʹৗற͍ͤͨ͞ • https://github.com/maxogden/menubar
ϝχϡʔόʔ
ϝχϡʔόʔ import menubar from 'menubar'; const mb = menubar({ index:
winURL, // index.html width: 700, height: 130, windowPosition: 'trayCenter', });
γϣʔτΧοτΩʔ • ϝχϡʔόʔʹΧʔιϧΛ͍࣋ͬͯ͘ͷ໘ ͩͱ͍͏͜ͱ͕͔ͬͨ • γϣʔτΧοτΩʔͰݺͼग़ͯ͠γϡοͱೖ ྗͰ͖ΔΑ͏ʹ͍ͨ͠ • https://github.com/electron/electron/blob/ master/docs/api/global-shortcut.md
γϣʔτΧοτΩʔ
γϣʔτΧοτΩʔ import { app, globalShortcut } from 'electron'; let menuWindowOpened
= false; mb.on('ready', () => { globalShortcut.register('Ctrl+Shift+\\', () => { if (menuWindowOpened) { mb.hideWindow(); menuWindowOpened = false; } else { mb.showWindow(); menuWindowOpened = true; } }); });
͘͡ • ͬͨπʔϧ • SDK/ೝূ • ENML • ϝχϡʔόʔɺγϣʔτΧοτΩʔ •
·ͱΊ
·ͱΊ • Electron ͍͢͝ • ENML ͭΒ͍… • Boilerplate ༻๏༻ྔΛकΕศརʹ͑Δ͔ͳͱ
ࢥͬͨ • Electron ΞϓϦΛ࡞͍ͬͯΔํ͕͍ͨΒ͠·͠ΐ ͏ʂ