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
My Chrome Plugin
Search
Syo Igarashi
July 17, 2017
Technology
0
110
My Chrome Plugin
Syo Igarashi
July 17, 2017
Tweet
Share
More Decks by Syo Igarashi
See All by Syo Igarashi
2020冬開発合宿
igara
0
180
2019冬開発合宿
igara
0
69
2018夏開発合宿
igara
0
120
2018冬開発合宿
igara
0
1k
2017夏開発合宿
igara
0
160
Bariiiii
igara
0
100
2017冬合宿
igara
0
130
Other Decks in Technology
See All in Technology
Alpine.js を活用した Laravel MPA フロントエンド最適化戦略 / Alpine.js MPA
tzmfreedom
1
750
バクラクでのSystem Risk Records導入による変化と改善の取り組み/Changes and Improvement Initiatives Resulting from the Implementation of System Risk Records
taddy_919
0
180
caching_sha2_passwordのはなし
boro1234
0
160
大規模プロジェクトにおける 品質管理の要点と実践 / 20250327 Suguru Ishii
shift_evolve
0
200
製造業の会計システムをDDDで開発した話
caddi_eng
3
800
Engineering Managementのグローバルトレンド #emoasis / Engineering Management Global Trend
kyonmm
PRO
6
930
20250326_管理ツールの権限管理で改善したこと
sasata299
0
150
コミュニティとおかねの話 / Community and Money
kgsi
0
110
技術好きなエンジニアが _リーダーへの進化_ によって得たものと失ったもの / The Gains and Losses of a Tech-Enthusiast Engineer’s “Evolution into Leadership”
kaminashi
0
180
AIが変えるソフトウェア開発__未来のアジャイルチームとは__.pdf
buchirei
0
360
モンテカルロ木探索のパフォーマンスを予測する Kaggleコンペ解説 〜生成AIによる未知のゲーム生成〜
rist
4
930
ウェブアクセシビリティとは
lycorptech_jp
PRO
0
150
Featured
See All Featured
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
129
19k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
22
2.6k
Producing Creativity
orderedlist
PRO
344
40k
RailsConf & Balkan Ruby 2019: The Past, Present, and Future of Rails at GitHub
eileencodes
134
33k
It's Worth the Effort
3n
184
28k
Building a Modern Day E-commerce SEO Strategy
aleyda
38
7.2k
Embracing the Ebb and Flow
colly
84
4.6k
JavaScript: Past, Present, and Future - NDC Porto 2020
reverentgeek
47
5.3k
Java REST API Framework Comparison - PWX 2021
mraible
29
8.5k
Chrome DevTools: State of the Union 2024 - Debugging React & Beyond
addyosmani
4
460
Making Projects Easy
brettharned
116
6.1k
Why Our Code Smells
bkeepers
PRO
336
57k
Transcript
僕のChrome拡張 五十嵐 翔
アジェンダ ・自己紹介 ・作成意欲 ・Chrome Extension ・作成のひとくふう ・Extensionの術 ・まとめなど
自己紹介 ・五十嵐 翔(いがらし しょう) ・お仕事 Web作成〜PHP、JavaScript ・趣味のプログラミング システムプログラミング学習〜Rust VR〜Unity、Mono C#
作成意欲 ・みんなブラウザ使っているならば ブラウザ内で使えるツールで楽になること あるのでは? ブラウザの操作を楽にできるツールとか 需要ありそう
Chrome Extension ・Chromeが提供しているAPIを使用して ブラウザの拡張を行う 拡張例)左クリック時に表示される メニューの追加とか manifestに記載できるpermission参照 https://developer.chrome.com/extensions/declare_permissions
作成のひとくふう ・IntelliSense強化 ・ただのJavaScriptでも TypeScriptの型定義ファイル使用して 補完強化 ライブラリのグローバル変数の補完など jQueryの「$」 Chrome Extensionなら「chrome」
None
作成のひとくふう ・IntelliSense強化 ・JSDocちゃんと書こ? コメントによる入力補完 functionのreturn、paramに型情報が あることで補完の恩恵受けることできる
None
Extensionの術 ・Element Jack 指定した箇所のElementを取得し、 DOMの変更など行わせる igara/XPathToolForChromeでは XPath(Elementの絶対位置)を取得し Select一覧変更ができるようになっている https://github.com/igara/XPathToolForChrome
Extensionの術 ・Basic Admin Passing Basic認証に失敗した時に 右クリックのメニューから 半強制的に認証成功させに行く ※igara/XPathToolForChromeにない機能 で紹介程度に記載
None
まとめなど ・background.jsとcontent_script.jsの イベントのはしごリレーが厄介 ブラウザで表示中のElementいじれるのは content_script.jsだけなのでどうしても sendMessage→content_scriptで受け取る やりとりが多発する
まとめなど ・自分のPC内のファイル操作に弱い Native Messaging使いこなせば 可能性ある? Native Messaging Chrome Extensionから 実行ファイルを呼び出すことができるAPI
https://developer.chrome.com/extensions/nativeMessaging
お し ま い