Upgrade to Pro — share decks privately, control downloads, hide ads and more …

ChromeExtensions_PIXNET

Avatar for CypressKuo CypressKuo
June 24, 2016
Technology
0
73

 ChromeExtensions_PIXNET

ChromeExtensions_PIXNET

Avatar for CypressKuo

CypressKuo

June 24, 2016
Tweet

More Decks by CypressKuo

See All by CypressKuo
Deep-copying.pdf
Avatar for CypressKuo cypresskuo
0
32
CSS_for_Web_Vitals.pdf
Avatar for CypressKuo cypresskuo
0
38
談談_Code_review.pdf
Avatar for CypressKuo cypresskuo
0
44
REST_vs_GraphQL_今夜はご注文はどっち.pdf
Avatar for CypressKuo cypresskuo
0
22
CSS_重構.pdf
Avatar for CypressKuo cypresskuo
0
25
跟上_JS_的腳步-ES2020.pdf
Avatar for CypressKuo cypresskuo
0
28
Core_Web_Vitals.pdf
Avatar for CypressKuo cypresskuo
0
52
這個時代人人都知道的敏捷開發.pdf
Avatar for CypressKuo cypresskuo
0
56
Webassembly.pdf
Avatar for CypressKuo cypresskuo
0
12

Other Decks in Technology

See All in Technology
まだ間に合う！ Agentic AI on AWSの現在地をやさしく一挙おさらい
Avatar for みのるん minorun365
19
3.4k
[PR] はじめてのデジタルアイデンティティという本を書きました
Avatar for ritou ritou
0
680
ECS_EKS以外の選択肢_ROSA入門_.pdf
Avatar for モブエンジニア（Masaki Okuda） masakiokuda
1
120
AI with TiDD
Avatar for Shiraji shiraji
1
330
人工知能のための哲学塾 ニューロフィロソフィ篇 第零夜 「ニューロフィロソフィとは何か？」
Avatar for miyayou miyayou
0
230
投資戦略を量産せよ 2 - マケデコセミナー(2025/12/26)
Avatar for tomo gamella
0
560
_第4回__AIxIoTビジネス共創ラボ紹介資料_20251203.pdf
Avatar for AIxIoTビジネス共創ラボ iotcomjpadmin
0
170
『君の名は』と聞く君の名は。 / Your name, you who asks for mine.
Avatar for NTT docomo Business nttcom
1
140
AIと融ける人間の冒険
Avatar for pujisi pujisi
0
100
ハッカソンから社内プロダクトへ AIエージェント ko☆shi 開発で学んだ4つの重要要素
Avatar for Tech Leverages leveragestech
0
500
Strands AgentsのEvaluatorをLangfuseにぶち込んでみた
Avatar for あんどお andoooooo_bb
0
110
2025年 山梨の技術コミュニティを振り返る
Avatar for しみず ゆうき yuukis
0
140

Featured

See All Featured
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
Avatar for Tammy Everts tammyeverts
55
3.2k
Reflections from 52 weeks, 52 projects
Avatar for Jefferson Lam jeffersonlam
355
21k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
Avatar for Aleyda Solis aleyda
2
9.2k
WCS-LA-2024
Avatar for Leonardo Collado-Torres lcolladotor
0
400
Effective software design: The role of men in debugging patriarchy in IT @ Voxxed Days AMS
Avatar for Kenny Baas-Schwegler baasie
0
180
Between Models and Reality
Avatar for mayunak mayunak
1
150
The B2B funnel & how to create a winning content strategy
Avatar for Katarina Dahlin katarinadahlin
PRO
0
210
Skip the Path - Find Your Career Trail
Avatar for Mark Kilby mkilby
0
29
Leo the Paperboy
Avatar for Maya Tellez mayatellez
0
1.3k
Noah Learner - AI + Me: how we built a GSC Bulk Export data pipeline
Avatar for Tech SEO Connect techseoconnect
PRO
0
76
New Earth Scene 8
Avatar for Sydney Stone popppiees
0
1.3k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
75

Transcript

  1. Chrome Extensions 開發入⾨ /14 1 CypressKuo @PIXNET F2E

  2. What are Chrome extensions? ✤ Extensions are small software programs

    that can modify and enhance the functionality of the Chrome browser. ✤ You write them using web technologies such as HTML, JavaScript, and CSS. /14 2

  3. Basic Architecture ✤ manifest.json ✤ icon.png ✤ popup.html ✤ popup.js

    ✤ popup.css /14 3

  4. manifest.json /14 4

  5. Background ✤ persistent background pages ✤ event pages /14 5

  6. Content Script ✤ page's DOM /14 6

  7. Browser Action /14 7

  8. Page Action /14 8

  9. Debugging ✤ console.log is useful ✤ background or content scripts

    /14 9

  10. /14 10

  11. Packaging /14 11

  12. Demo /14 12

  13. References ✤ https://developer.chrome.com/extensions/manifest ✤ https://blog.longwin.com.tw/2014/01/chrome- extensions-plugin-develop-2014/ ✤ http://www.cnblogs.com/guogangj/p/ 3235703.html#t5 ✤

    http://code.tutsplus.com/tutorials/developing- google-chrome-extensions--net-33076 /14 13

  14. Thank you /14 14