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
解決策をひとつ増やそう!ブラウザ拡張機能作成のススメ
Search
Masayuki Maekawa
December 09, 2023
Programming
1
560
解決策をひとつ増やそう!ブラウザ拡張機能作成のススメ
2023/12/09
合同勉強会 in 大都会岡山 -2023 Winter-
https://gbdaitokai.connpass.com/event/299345/
Masayuki Maekawa
December 09, 2023
Tweet
Share
More Decks by Masayuki Maekawa
See All by Masayuki Maekawa
拡張機能でええんちゃう?
maepon
1
600
UDフォントの話
maepon
0
400
箱ひげ図
maepon
0
600
Core Web Vitals についてあれやこれや
maepon
1
420
大規模サイトにおけるSEO観点でのURL設計
maepon
4
4k
ミーティングの「進行役」を考える
maepon
1
590
ミーティングの「進行役」考
maepon
1
590
DB使わずWordPressのデータ取得
maepon
0
590
JavaScriptの読み込みを考える〜場所、async、defer、その仕組みと使い所〜
maepon
3
2.7k
Other Decks in Programming
See All in Programming
エンジニア向け採用ピッチ資料
inusan
0
170
AWS CDKの推しポイント 〜CloudFormationと比較してみた〜
akihisaikeda
3
320
Team topologies and the microservice architecture: a synergistic relationship
cer
PRO
0
1.1k
Create a website using Spatial Web
akkeylab
0
310
Systèmes distribués, pour le meilleur et pour le pire - BreizhCamp 2025 - Conférence
slecache
0
110
Benchmark
sysong
0
280
なぜ適用するか、移行して理解するClean Architecture 〜構造を超えて設計を継承する〜 / Why Apply, Migrate and Understand Clean Architecture - Inherit Design Beyond Structure
seike460
PRO
1
710
Select API from Kotlin Coroutine
jmatsu
1
190
PipeCDのプラグイン化で目指すところ
warashi
1
220
コードの90%をAIが書く世界で何が待っているのか / What awaits us in a world where 90% of the code is written by AI
rkaga
48
32k
新メンバーも今日から大活躍!SREが支えるスケールし続ける組織のオンボーディング
honmarkhunt
0
120
PostgreSQLのRow Level SecurityをPHPのORMで扱う Eloquent vs Doctrine #phpcon #track2
77web
2
410
Featured
See All Featured
GitHub's CSS Performance
jonrohan
1031
460k
Practical Tips for Bootstrapping Information Extraction Pipelines
honnibal
PRO
20
1.3k
The Illustrated Children's Guide to Kubernetes
chrisshort
48
50k
We Have a Design System, Now What?
morganepeng
53
7.7k
The Language of Interfaces
destraynor
158
25k
Performance Is Good for Brains [We Love Speed 2024]
tammyeverts
10
940
What’s in a name? Adding method to the madness
productmarketing
PRO
23
3.5k
The Straight Up "How To Draw Better" Workshop
denniskardys
234
140k
The Art of Delivering Value - GDevCon NA Keynote
reverentgeek
15
1.5k
Producing Creativity
orderedlist
PRO
346
40k
ピンチをチャンスに:未来をつくるプロダクトロードマップ #pmconf2020
aki_iinuma
124
52k
Keith and Marios Guide to Fast Websites
keithpitt
411
22k
Transcript
ղܾࡦΛͻͱͭ૿ͦ͏ʂ $ISPNF֦ுػೳ࡞ͷ εεϝ ߹ಉษڧձJOେձԬࢁ8JOUFS લণɹ
͡Ίʹ
͜ͷ͓ͷత w ʮ֦ுػೳͰղܾͰ͖Δͷ͋Γͦ͏ʯ w ʮ֦ுػೳ࡞Εͦ͏ʯ w ʮ֦ுػೳ࡞ͬͯΈΔ͔ʯ w ʮ࡞֦ͬͨுػೳετΞʹެ։ͯ͠ΈΔ͔ʯʢ˞ͦ͏ͳΕ͍͍ͳʣ
͓͠ͳ͕͖ w $ISPNF֦ுػೳͱʁ w ࣮ࡍʹ࡞ͬͨͷհ w ΄΅࠷খߏͷ$ISPNF֦ுػೳ w ࡞࣌ͷ5JQTΛ͍͔ͭ͘
લণ w ΣϒΫϦΤΠλʔζχϡʔεཧਓ w IUUQTXXXGBDFCPPLDPNHSPVQT w IUUQTUXJUUFSDPNXFCDSFJOGP w ઌपܴ͑·ͨ͠ w
$MBTTJגࣜձࣾιϑτΣΞΤϯδχΞ w ։ൃάϧʔϓϦʔμʔϓϩμΫτΦʔφʔ
$ISPNF֦ுػೳͱʁ
https://www.google.com/search?q=Chrome%E6%8B%A1%E5%BC%B5%E6%A9%9F%E8%83%BD%E3%81%A8%E3%81%AF%EF%BC%9F
https://chat.openai.com/share/98eb53e3-c9c0-4f32-8152-ba1ff4342d3a
࡞Γखઢͩͱछྨ ˞େཚʹݴͬͯ·͢ Σϒϖʔδͷ)5.-ʹ TDSJQUΛՃ͢Δ $ISPNFͷ"1*Λ͏ TDSJQUΛΈࠐΉ
࡞Γखઢͩͱछྨ ˞େཚʹݴͬͯ·͢ Σϒϖʔδͷ)5.-ʹ TDSJQUΛՃ͢Δ ͪ͜ΒͷΞϓϩʔνͩͱ ඇৗʹෑډ͕͍
࣮ࡍʹ࡞ͬͨͷհ
(PPHMF.FFU$IBU$MJQCPBSE w $MBTTJࣾͰͷʮ.FFUͷνϟοτͷอଘΕͨʂʯΛड͚ͯ w ίϐʔϘλϯͷՃ w ୀग़ϘλϯԡԼ࣌ʹΫϦοϓϘʔυʹࣗಈͰอଘ w λϒΛด͡Δ࣌ʹμΠΞϩά w
ʢࣾͰʣരέ https://chromewebstore.google.com/detail/google-meet-chat-to-clipb/djoaekihkgkgcgckfjakaekoiplcpoec?hl=ja
Σϒϖʔδͷ)5.-ʹTDSJQUΛՃ͢Δ
ଞʹετΞެ։͠ͳ͍ۀิॿ֦ுػೳ w ϝʔϧ৴4BB4ͷʮબΜ͡Ό͍͚ͳ͍ϥδΦϘλϯʯແޮԽ w จॻཧ4BB4͔Β༰Λύʔεͯࣾ͠γεςϜͷϦϯΫੜ w ςεταΠτͱຊ൪αΠτΛಉҰύεͰӾཡ͢Δ
΄΅࠷খߏͷ$ISPNF֦ுػೳ w IUUQTHJUIVCDPNNBFQPONJOFYUFOTJPO w )5.-ͷ4DSJQUՃํࣜͷʢ΄΅ʣ࠷খߏ
DISPNFFYUFOTJPOT σϕϩούʔϞʔυʹνΣοΫΛೖΕΕɺ ϑΥϧμΛ֦ுػೳͱͯ͠ಡΈࠐΊ·͢ɻ
NBOJGFTUKTPO { "manifest_version": 3, "name": "࠷খݶͷChrome֦ுػೳ", "version": "1.0", “description": "ϖʔδ্ͷHTMLΛมߋ͢Δ࠷খݶͷChrome֦ுػೳ",
"content_scripts": [ { "matches": ["<all_urls>"], "js": ["content.js"] } ] } ఆٛɾઃఆϑΝΠϧ
NBOJGFTUKTPO { "manifest_version": 3, "name": "࠷খݶͷChrome֦ுػೳ", "version": "1.0", “description": "ϖʔδ্ͷHTMLΛมߋ͢Δ࠷খݶͷChrome֦ுػೳ",
"content_scripts": [ { "matches": ["<all_urls>"], "js": ["content.js"] } ] } ఆٛɾઃఆϑΝΠϧ શͯͷΣϒϖʔδͰɺ DPOUFOUKTΛద༻͢Δ
DPOUFOUKT // content.js // ϖʔδ্ͷςΩετΛมߋ document.body.innerText = "Hello, Chrome֦ுػೳ!"; //
ུ ࣮ߦϑΝΠϧ
DPOUFOUKT // content.js // ϖʔδ্ͷςΩετΛมߋ document.body.innerText = "Hello, Chrome֦ுػೳ!"; //
ུ ࣮ߦϑΝΠϧ ڟѱ͗͢Δ
DPOUFOUKT // content.js // ϖʔδ্ͷςΩετΛมߋ // document.body.innerText = "Hello, Chrome֦ுػೳ!";
// DomContentLoad࣌ʹaλάͷtargetଐੑΛআ͢Δ function removeTarget() { const links = document.querySelectorAll('a[target]'); links.forEach((link) => { link.removeAttribute('target'); }); setTimeout(removeTarget, 500) } removeTarget(); ࣮ߦϑΝΠϧ ϖʔδશͯͷUBSHFUଐੑ ΛSFNPWF͢Δ
NBOJGFTUKTPO { "manifest_version": 3, "name": "࠷খݶͷChrome֦ுػೳ", "version": "1.0", “description": "ϖʔδ্ͷHTMLΛมߋ͢Δ࠷খݶͷChrome֦ுػೳ",
"content_scripts": [ { "matches": ["https://maepon.blog*"], "js": ["content.js"] } ] } ఆٛɾઃఆϑΝΠϧ ద༻͢ΔαΠτࢦఆͨ͠ํ ͕ແͰ͢ ʢਖ਼نදݱ͑ͳ͍ͣʣ
+BWB4DSJQUॻ͚Ε ͳΜͱ͔ͳΔ ؾ͕͖ͯ͠·ͤΜʁ
࡞࣌ͷ5JQTΛ͍͔ͭ͘ w DPOUFOUKT͕ಡΈࠐ·ΕΔͷ%0.$POUFOU-PBEFEͷޙ w MPDBM4USBHFී௨ʹ͑·͢ɻͨͩ͠ϖʔδͷυϝΠϯͷΈ w υϝΠϯΛ·͍ͨ͗ͨ߹ɺ$IPSNF"1*Λར༻͢Δ w 41"తͳͷ.VUBUJPO0CTFSWFSʹͱͯੈʹͳΓ·͢ w
࣌ʹJOUFSWBMճ͢͜ͱʜ
ؾΛ͚ͭΔ͜ͱ w 6*͍͡Δܥ%0.ΛͳΜͱ͔ηϨΫλۦͯ͠ཁૉΛ௫Ή w ͭ·ΓΫϥε໊มΘͬͨΒಈ͔ͳ͘ͳͬͨΓ w ͜Ε͔ΓͲ͏͠Α͏ͳ͍ w ηϨΫλͷৄࡉΛͲΕ͚ͩখ͘͞Ͱ͖Δ͔ͷউෛ w
ͱ͍͑ؤுͬͨͱ͜ΖͰɺͷੈքͰ͋Δ
ͥͻ4UPSFެ։Λ w ͬͯ͘Βͬͯྑ͍ͳɺͱ͍͏ͷੋඇετΞެ։Λ w $ISPNFͷετΞΛճ͑σϕϩούʔʹͳΕ·͢ w ΞΠίϯΞΠΩϟονը૾͕ඞཁɻ͕ΜΕʂ w &EHFͷ֦ுػೳετΞ͋Γ·͢ w
ͪ͜ΒແྉʢͰ$ISPNFΑΓෑډߴ͍ײ͡ʣ
͋Γ͕ͱ͏͍͟͝·ͨ͠