Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

20150417 firefox & developer tools

2,409 views

Published on

firefox & developer tools

Published in: Internet
  • Be the first to comment

  • Be the first to like this

20150417 firefox & developer tools

  1. 1. Firefox & Developer tools AlexW 2015.04.17
  2. 2. agenda • Free / OpenSource • extensions ( I ) • advence user • extensions ( II ) • Developer tool • Userscript & Front-end • Q&A
  3. 3. About me
  4. 4. AlexW開源 自由 宅宅 鄉民 暴民
  5. 5. 為什麼我在這裡?
  6. 6. 交了壞朋友 摸了git / 學了 python / 換了 Debian
  7. 7. 每個人都需要壞朋友 好朋友支持你原本的生活 壞朋友改變你原本的視野
  8. 8. 先談談自由與開源*
  9. 9. Back to FireFox
  10. 10. Firefox 是什麼? 能吃嗎 ?
  11. 11. 不就瀏覽器?
  12. 12. 調查兵團 出動 !
  13. 13. 瀏覽器 IE / Chrome / Firefox Safari / Opera
  14. 14. 可以給我理由嗎?
  15. 15. IE 內建
  16. 16. 你知道 IE 掰了嗎?
  17. 17. 可是公務都要用 IE 欸 就是這樣掰了才覺得爽
  18. 18. IE 回歸正途 所以世界都爆炸了
  19. 19. Chrome 又快又潮
  20. 20. 綁 Google 快! 把我綁起來 <3
  21. 21. Firefox 老派宅
  22. 22. 先不管 Firefox 你聽過火狐娘嗎? 2008
  23. 23. ===自high 分隔線 ===
  24. 24. Firefox
  25. 25. 核心價值
  26. 26. 自由。隱私
  27. 27. Tracking cookies mozilla privacy
  28. 28. Do Not Track
  29. 29. Micro$oft default enable DNT
  30. 30. 各家優勢
  31. 31. IE : 免安裝 各位的責任
  32. 32. Chrome : 我爸估狗
  33. 33. 同步 / 商店 / 常駐
  34. 34. 不過我倒覺得是這樣啦吼
  35. 35. 以使用者為中心
  36. 36. 簡單 強大
  37. 37. Open Source 公開透明。光明磊落
  38. 38. Lv.1 普 user
  39. 39. extensions 附加元件初探
  40. 40. 不要廣告 ADblock plus
  41. 41. μBlock (beta) https://github.com/gorhill/uBlock
  42. 42. Tab mix plus https://addons.mozilla.org/zh-tw/firefox/addon/tab-mix-plus/
  43. 43. BBSFox https://addons.mozilla.org/zh-TW/firefox/addon/bbsfox/
  44. 44. 新聞小幫手 http://newshelper.g0v.tw/
  45. 45. Lv.2 宅 user
  46. 46. 人狐合一
  47. 47. 搜尋列 search bar ctrl + K
  48. 48. 分頁群組 Tab Groups
  49. 49. shortcut
  50. 50. google it ! moztw 鍵盤捷徑
  51. 51. 搭配滑鼠自定義 滾輪左右偏: 切換分頁 大拇指: 關閉分頁
  52. 52. Trackpad 搭配 BetterTouchTool
  53. 53. 阿宅御用瀏覽器 怎麼可能這麼少
  54. 54. 官方快捷鍵 日常任務
  55. 55. 好用到爆炸 關鍵字搜尋 ( 搜尋列 掰~ ) 不 好 ⽤用 , 免 錢 !
  56. 56. 萬惡 Big5 解決方法
  57. 57. Ctrl-L Ctrl-K
  58. 58. Lv.3 Advance user
  59. 59. extensions again 附加元件威能
  60. 60. refcontrol https://addons.mozilla.org/zh-TW/firefox/addon/refcontrol/
  61. 61. Live HTTP Headers https://addons.mozilla.org/zh-TW/firefox/addon/live-http-headers/
  62. 62. GreaseMonkey* https://addons.mozilla.org/zh-tw/firefox/addon/greasemonkey/
  63. 63. 油猴威能 外掛中的外掛
  64. 64. OpenUserJS https://openuserjs.org/
  65. 65. Greasy Fork https://greasyfork.org/
  66. 66. DEMO apple online store location switch
  67. 67. Lv.4 Developer tools
  68. 68. Firefox developer tools
  69. 69. 網站排版
  70. 70. Frame Table CSS
  71. 71. <div class=’im_your_father’> <div id=’u_r_my_son’> <div id=’noooooooooooo’> <div id=’argo’> ◢▆▅▄▃-崩╰(〒⽫皿〒)╯潰-▃▄▅▆◣ </div> </div> </div> </div>
  72. 72. modify upload reload
  73. 73. no change ! try again ...
  74. 74. extension
  75. 75. Web Developer https://addons.mozilla.org/zh-tw/firefox/addon/web-developer/
  76. 76. Firebug https://addons.mozilla.org/zh-tw/firefox/addon/firebug/
  77. 77. 現在內建了
  78. 78. 內建開發者工具 Firefox 4+ chrome 也有 聽說IE也有
  79. 79. 檢測元素 Inspect Element
  80. 80. DEMO
  81. 81. Real time
  82. 82. 截圖
  83. 83. CLI 魂
  84. 84. Developer Edition http://mozilla.com.tw/firefox/developer/
  85. 85. 獨立 Profile
  86. 86. Dark mode
  87. 87. 太alpha 淚砍 Dark mode 掰~
  88. 88. Lv.5 Developer
  89. 89. 淺談 User Script 與前端開發
  90. 90. 你用什麼做網頁 ?
  91. 91. FrontPage
  92. 92. 你透露出你的年紀了
  93. 93. M$-Word 好吧 我承認我也被逼著用
  94. 94. Dreamweaver ?
  95. 95. 你有聽過鄙視鏈嗎? 軟體工程師鄙視鏈 設計師鄙視鏈
  96. 96. Namo? 賣鬧啊~ 連鄙視鏈都排不上
  97. 97. Sublime ! 可以留下 email 嗎? 我想請教你
  98. 98. 網站越來越難做
  99. 99. before CSS / JS
  100. 100. What u see is what u get
  101. 101. after CSS / JS
  102. 102. What the fuuu is what u get
  103. 103. 還有 Responsive Web Design
  104. 104. UI / UX
  105. 105. F2EFront End Engineer
  106. 106. HTML / CSS / JS WYSIWYG
  107. 107. JSbin codepen* jsfiddle
  108. 108. DEMO
  109. 109. Firefox Scratchpad https://developer.mozilla.org/en-US/docs/Tools/Scratchpad
  110. 110. DEMO
  111. 111. GreaseMonkey https://addons.mozilla.org/zh-tw/firefox/addon/greasemonkey/
  112. 112. 寫一個 User Script meta-data
  113. 113. OpenUserJS https://openuserjs.org/
  114. 114. Q & A 之前 北投吳先生提到 Firefox 當機問題
  115. 115. flash 疑難排解
  116. 116. Q & A 送貼紙勒~
  117. 117. Thanks.

×