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
570
解決策をひとつ増やそう!ブラウザ拡張機能作成のススメ
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
620
UDフォントの話
maepon
0
410
箱ひげ図
maepon
0
610
Core Web Vitals についてあれやこれや
maepon
1
430
大規模サイトにおけるSEO観点でのURL設計
maepon
4
4.1k
ミーティングの「進行役」を考える
maepon
1
600
ミーティングの「進行役」考
maepon
1
600
DB使わずWordPressのデータ取得
maepon
0
610
JavaScriptの読み込みを考える〜場所、async、defer、その仕組みと使い所〜
maepon
3
2.7k
Other Decks in Programming
See All in Programming
オープンセミナー2025@広島LT技術ブログを続けるには
satoshi256kbyte
0
150
未来を拓くAI技術〜エージェント開発とAI駆動開発〜
leveragestech
2
200
サイトを作ったらNFCタグキーホルダーを爆速で作れ!
yuukis
0
740
Processing Gem ベースの、2D レトロゲームエンジンの開発
tokujiros
2
120
Claude Codeで実装以外の開発フロー、どこまで自動化できるか?失敗と成功
ndadayo
3
1.8k
TanStack DB ~状態管理の新しい考え方~
bmthd
2
370
ECS初心者の仲間 – TUIツール「e1s」の紹介
keidarcy
0
140
Langfuseと歩む生成AI活用推進
licux
3
320
Oracle Database Technology Night 92 Database Connection control FAN-AC
oracle4engineer
PRO
1
360
マイコンでもRustのtestがしたい その2/KernelVM Tokyo 18
tnishinaga
2
2.4k
パスタの技術
yusukebe
1
550
Namespace and Its Future
tagomoris
6
670
Featured
See All Featured
The Art of Programming - Codeland 2020
erikaheidi
55
13k
BBQ
matthewcrist
89
9.8k
Faster Mobile Websites
deanohume
309
31k
The Pragmatic Product Professional
lauravandoore
36
6.8k
Mobile First: as difficult as doing things right
swwweet
224
9.9k
Bootstrapping a Software Product
garrettdimon
PRO
307
110k
Typedesign – Prime Four
hannesfritz
42
2.8k
Cheating the UX When There Is Nothing More to Optimize - PixelPioneers
stephaniewalter
284
13k
Dealing with People You Can't Stand - Big Design 2015
cassininazir
367
27k
Git: the NoSQL Database
bkeepers
PRO
431
66k
Optimizing for Happiness
mojombo
379
70k
CSS Pre-Processors: Stylus, Less & Sass
bermonpainter
358
30k
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ΑΓෑډߴ͍ײ͡ʣ
͋Γ͕ͱ͏͍͟͝·ͨ͠