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

ChromeExtensions_PIXNET

Avatar for CypressKuo CypressKuo
June 24, 2016
Technology
74
0

 ChromeExtensions_PIXNET

ChromeExtensions_PIXNET

Avatar for CypressKuo

CypressKuo

June 24, 2016

More Decks by CypressKuo

See All by CypressKuo
Deep-copying.pdf
Avatar for CypressKuo cypresskuo
0
35
CSS_for_Web_Vitals.pdf
Avatar for CypressKuo cypresskuo
0
40
談談_Code_review.pdf
Avatar for CypressKuo cypresskuo
0
48
REST_vs_GraphQL_今夜はご注文はどっち.pdf
Avatar for CypressKuo cypresskuo
0
23
CSS_重構.pdf
Avatar for CypressKuo cypresskuo
0
28
跟上_JS_的腳步-ES2020.pdf
Avatar for CypressKuo cypresskuo
0
31
Core_Web_Vitals.pdf
Avatar for CypressKuo cypresskuo
0
55
這個時代人人都知道的敏捷開發.pdf
Avatar for CypressKuo cypresskuo
0
63
Webassembly.pdf
Avatar for CypressKuo cypresskuo
0
13

Other Decks in Technology

See All in Technology
Purview 勉強会報告 Microsoft Purview 入門しようとしてみた
Avatar for masakichi masakichixo
1
430
開発サイクルのボーダーレス化に伴う組織変革から学んだこと / Organizational Transformation Amid the Borderless Development Cycle
Avatar for miisan mii3king
0
160
なぜ、私がCommunity Builderに?〜活動期間1か月半でも選出されたワケ〜
Avatar for Yuuki Yamashita yama3133
0
140
続 運用改善、不都合な真実 〜 物理制約のない運用改善はほとんど無価値 / 20260518-ssmjp-kaizen-no-value-without-physical-constraints
Avatar for opelab opelab
2
240
SREの仕事は「壊さないこと」ではなくなった 〜自律化していくシステムに、責任と判断を与えるという価値〜 / 20260515 Naoki Shimada
Avatar for SHIFT EVOLVE shift_evolve
PRO
1
180
マンション備え付けのネットワークとLTE回線を組み合わせた ネットワークの安定化の考案
Avatar for harutiro harutiro
1
130
おいらのAWSアップデートの追い方〜Slack×AgentCore〜
Avatar for やくも yakumo
1
110
100マイクロサービスのTerraform/Kubernetes管理地獄から抜け出すためのAI活用術
Avatar for Masaki Ishigaki markie1009
0
160
Oracle Base Database Service 技術詳細
Avatar for oracle4engineer oracle4engineer
PRO
15
100k
SLI/SLO、「完全に理解した」から「チョットデキル」へ
Avatar for maru maruloop
5
550
全社統制を維持しながら現場負担をどう減らすか〜プラットフォームチームとセキュリティチームで進めたSecurity Hub活用によるAWS統制の見直し〜/secjaws-security-hub-custom-insights
Avatar for みずほリサーチ&テクノロジーズ株式会社 先端技術研究部 mhrtech
1
540
Claude Code で使える DuckDB Skills を試してみた / DuckDB Skills and Claude Code
Avatar for MasahiroKawahara masahirokawahara
1
540

Featured

See All Featured
How Software Deployment tools have changed in the past 20 years
Avatar for Geshan Manandhar geshan
0
33k
How to make the Groovebox
Avatar for あそなす asonas
2
2.2k
The Language of Interfaces
Avatar for Des Traynor destraynor
162
26k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
Avatar for Michelle Schulp Hunt marktimemedia
31
2.8k
DevOps and Value Stream Thinking: Enabling flow, efficiency and business value
Avatar for Helen Beal helenjbeal
1
190
世界の人気アプリ100個を分析して見えたペイウォール設計の心得
Avatar for Akihiro Kokubo akihiro_kokubo
PRO
70
39k
Leadership Guide Workshop - DevTernity 2021
Avatar for David Neal reverentgeek
1
280
AI in Enterprises - Java and Open Source to the Rescue
Avatar for ivargrimstad ivargrimstad
0
1.3k
Impact Scores and Hybrid Strategies: The future of link building
Avatar for Tamara Novitovic tamaranovitovic
0
270
Redefining SEO in the New Era of Traffic Generation
Avatar for Szymon Słowik szymonslowik
1
300
Faster Mobile Websites
Avatar for Dean Hume deanohume
310
31k
ラッコキーワード サービス紹介資料
Avatar for ラッコ株式会社 rakko
1
3.3M

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