在本文中,我們很高興分享 Chrome 擴充功能的初學者體驗有哪些重大改善,以及您可以如何參與這項計畫。
舊版指南
先前的 Chrome 擴充功能入門教學課程中,我們提供了一個基本擴充功能範例,當使用者按下擴充功能彈出式視窗中的按鈕時,這個範例會變更目前網頁的背景顏色。並提供選項頁面,讓您從四種顏色中挑選所需顏色。
這個基本範例並未示範如何在實際擴充功能中加入熱門功能。是時候進行改版了。
新做法
我們知道開發人員會透過說明文件開始學習 Chrome 擴充功能,因此我們的目標是提供易於存取、適合初學者且相關的學習途徑。我們決定從頭開始,而非嘗試改善現有的教學課程範例。
全新推出的「入門」系列:
- 擴充功能 101
- 簡要介紹 Chrome 擴充功能開發的幾個基本概念,例如網頁技術和常用的擴充功能元件。此外,這份文件也說明在 Chrome 線上應用程式商店中設計及發布擴充功能時,應注意的事項。
- 開發基本概念
- 建立「Hello, Extensions」範例,介紹擴充功能開發工作流程。這份文件會逐步說明如何在開發期間載入擴充功能、找出記錄和錯誤、選擇專案結構,以及使用 Typescript。
- Reading Time 教學課程
- 很高興知道我們需要花多少時間才能讀完文章。「閱讀時間」教學課程會說明如何在每個擴充功能說明文件頁面中插入包含預估閱讀時間的元素。
- 專注模式教學課程
- 移除頁面上的多餘雜訊,可讓我們專注於最相關的資訊。專注模式示範如何變更頁面樣式,並隱藏部分干擾元素。
- 分頁管理工具教學課程
- 在研究擴充功能開發作業時,您可能會在多個視窗中開啟許多說明文件分頁。分頁管理工具可整理 Chrome 擴充功能和 Chrome 線上應用程式商店說明分頁。
這些教學課程不僅會教您如何建構實際的擴充功能,還會分享開發訣竅和最佳做法。此外,使用這些擴充功能可改善閱讀擴充功能說明文件的體驗。
可能發生的情況
每個教學課程都包含以下各節:
- 擴充功能要執行的工作。
- 課程內容。
- 開始前須知。
- 建構擴充功能的逐步操作說明。
- 如何載入及測試擴充功能。
如果您想接受挑戰,我們在本節中提供了一些想法,說明如何自訂擴充功能或新增其他功能。
我們需要你的協助
期待收到你的回覆!如果您在這些指南中發現錯誤或不清楚的內容,請在我們的 GitHub 存放區中回報錯誤。
我們認為這份新版入門指南比舊版更完善,但我們不會就此止步,將持續努力改善及擴充說明文件,為所有擴充功能開發人員提供更優質的服務。
相片來源:Vardan Papikyan 在 Unsplash 網站上提供