iT邦幫忙

鐵人檔案

第 11 屆 iThome 鐵人賽
回列表
Modern Web

Chrome extension 學習手札 系列

記錄個人的學習歷程,並且整理成三十天循序漸進的文章,可以與網路上的高手們切磋。

鐵人鍊成 | 共 30 篇文章 | 21 人訂閱 訂閱系列文 RSS系列文
DAY 21

Chrome extension 學習手札 21 - 腳本實作 - 臺鐵時刻表查詢系統 - part 4

昨天,我們已經把Vue切出來的版給套用到我們的浮動頁面了, 所以今天要寫的就是商業邏輯的部分,先暫定要給後台腳本的資料格式以及要從後台腳本取得什麼資料, 先看...

2019-10-02 ‧ 由 崔斯 分享
DAY 22

Chrome extension 學習手札 22 - 腳本實作 - 臺鐵時刻表查詢系統 - part 5

今天,應該是會完成整個查詢功能了,只剩後台管理的部分,再串接一下內容腳本就好囉 原本整理出來的資料格式 store/train.json { &quot...

2019-10-03 ‧ 由 崔斯 分享
DAY 23

Chrome extension 學習手札 23 - 腳本實作 - 臺鐵時刻表查詢系統 - 整理優化

既然這是要上架的系統,還是要好好的優化一下, 所以今天的進度可能就是基本的程式碼調整、重構或版面上的調整 首先是浮動頁面,我們為了要確保後面的資料都正常運作,...

2019-10-04 ‧ 由 崔斯 分享
DAY 24

Chrome extension 學習手札 24 - 腳本實作 - 臺鐵時刻表查詢系統 - part 6

話說,這個系統我使用了以後,覺得還是不夠好用,覺得每次開啟以後 資料都要一直重複填寫 這樣的UX體驗似乎不夠好,所以今天來做個『歷史記錄』 首先是右上角放一個...

2019-10-05 ‧ 由 崔斯 分享
DAY 25

Chrome extension 學習手札 25 - 腳本實作 - 台鐵時刻表查詢系統 - part 7

今天的目標就是完成歷史紀錄,看有沒有時間再優化一下其他地方 首先要先幫chrome.storage預設資料 bg.js class TrainManager...

2019-10-06 ‧ 由 崔斯 分享
DAY 26

Chrome extension 學習手札 26 - 測試上架

因為從來沒有上架過,今天剛好就筆記一下,嘗試上架功能,並且以官方的文件為參考進行步驟 官方文件 先登入到Google開發者平台, 點選「新增商品」...

2019-10-07 ‧ 由 崔斯 分享
DAY 27

Chrome extension 學習手札 27 - 延伸學習 - 使用 Vue Cli 開發應用程式

Vue cli 而上次有提到要用vue cli建構chrome extension,而且網路上有許多模板可以操作, 我就順便整理了一些比較熱門的模板,分別是 s...

2019-10-08 ‧ 由 崔斯 分享
DAY 28

Chrome extension 學習手札 28 - 延伸學習 - 使用 React 開發一個應用程式

既然有Vue,怎麼可以沒有React呢? 那我們今天就來用React完成一個Chrome extension吧! 首先,我們要安裝 React,已經安裝過的可...

2019-10-09 ‧ 由 崔斯 分享
DAY 29

Chrome extension 學習手札 29 - 快速開發及彙總

前言 是的,這次鐵人賽已經接近尾聲了, 我們這二十八天以來嘗試過了許多不同的範例, 但 『chrome.api』 的功能還有很多,而且前端框架與設計模型也是五花...

2019-10-10 ‧ 由 崔斯 分享
DAY 30

Chrome extension 學習手札 30 - 鐵人賽完賽心得

心得 歷經了30天的淬鍊,現在的我對Chrome extension也有了更多的了解, 發現了許多厲害的服務以及技術,每天下班以後就是逛技術文章或是github...

2019-10-11 ‧ 由 崔斯 分享