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

ChromeExtensions_PIXNET

CypressKuo
June 24, 2016
Technology
0
70

 ChromeExtensions_PIXNET

ChromeExtensions_PIXNET

CypressKuo

June 24, 2016
Tweet

More Decks by CypressKuo

See All by CypressKuo
Deep-copying.pdf
cypresskuo
0
20
CSS_for_Web_Vitals.pdf
cypresskuo
0
28
談談_Code_review.pdf
cypresskuo
0
37
REST_vs_GraphQL_今夜はご注文はどっち.pdf
cypresskuo
0
15
CSS_重構.pdf
cypresskuo
0
19
跟上_JS_的腳步-ES2020.pdf
cypresskuo
0
23
Core_Web_Vitals.pdf
cypresskuo
0
47
這個時代人人都知道的敏捷開發.pdf
cypresskuo
0
44
Webassembly.pdf
cypresskuo
0
9

Other Decks in Technology

See All in Technology
開発者が自律的に AWS Security Hub findings に 対応する仕組みと AWS re:Invent 2024 登壇体験談 / Developers autonomously report AWS Security Hub findings Corresponding mechanism and AWS re:Invent 2024 presentation experience
kaminashi
0
190
SCSAから学ぶセキュリティ管理
masakamayama
0
140
2.5Dモデルのすべて
yu4u
2
610
室長と気ままに学ぶマイクロソフトのビジネスアプリケーションとビジネスプロセス
ryoheig0405
0
320
All you need to know about InnoDB Primary Keys
lefred
0
120
30分でわかる『アジャイルデータモデリング』
hanon52_
9
2.2k
開発スピードは上がっている…品質はどうする？ スピードと品質を両立させるためのプロダクト開発の進め方とは #DevSumi #DevSumiB / Agile And Quality
nihonbuson
1
1.3k
The 5 Obstacles to High-Performing Teams
mdalmijn
0
270
依存関係があるコンポーネントは Barrel ファイルでまとめよう
azukiazusa1
3
530
技術負債の「予兆検知」と「状況異変」のススメ / Technology Dept
i35_267
1
1k
WAF に頼りすぎない AWS WAF 運用術 meguro sec #1
izzii
0
460
技術的負債解消の取り組みと専門チームのお話 #技術的負債_Findy
bengo4com
1
1.2k

Featured

See All Featured
The Success of Rails: Ensuring Growth for the Next 100 Years
eileencodes
44
7k
A better future with KSS
kneath
238
17k
Agile that works and the tools we love
rasmusluckow
328
21k
Making Projects Easy
brettharned
116
6k
Principles of Awesome APIs and How to Build Them.
keavy
126
17k
For a Future-Friendly Web
brad_frost
176
9.5k
How to train your dragon (web standard)
notwaldorf
90
5.8k
Visualization
eitanlees
146
15k
The Power of CSS Pseudo Elements
geoffreycrofte
75
5.5k
Become a Pro
speakerdeck
PRO
26
5.1k
Building an army of robots
kneath
302
45k
Documentation Writing (for coders)
carmenintech
67
4.6k

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