開始

安裝

LearnByDiff 適用於 VS Code、Cursor，以及其他以 VS Code 為基礎的 IDE。

在擴充功能檢視搜尋 LearnByDiff，或開啟對應商店：

• Visual Studio Marketplace（VS Code）
• Open VSX（Cursor 及其他以 Open VSX 為基礎的 IDE）

也可以手動安裝：從發布頁下載 .vsix 檔案，拖入擴充功能檢視安裝。

開始課程

點一下 Explorer 的 LEARN BY DIFF 檢視標題列的「開啟課程」按鈕（或在命令選擇區執行 LearnByDiff: 開啟課程）。

從清單中選擇一門官方課程，或貼上以下 demo 課程設定檔位址並確認：

https://github.com/RJiazhen/learn-by-diff/blob/main/packages/courses-config/demo-course/.course-config/course.jsonc

在彈出視窗中選擇一個目錄存放學習工作區，課程相關檔案會自動下載到該目錄。

下載完成後的學習工作區目錄結構

對應 IDE 使用者也可以點以下連結一鍵開課：

• VS Code
• Cursor

用你習慣的方式學習

第一次開啟課程時，會預設把第一章的初始狀態程式碼匯出到本機。

對於 demo 課程，可以使用 Live Preview 擴充功能即時預覽 index.html。

然後點對應章節的「已完成」按鈕，就會把本機程式碼換成該章的完成狀態，以便預覽完成效果。

也可以點「文件」按鈕查看該章的文件，了解內容與學習目標。

或點章節中的檔案，查看為達成目標所做的程式碼修改。

單獨開啟單一章節資料夾做對比、切換回未開始等功能，請參考 功能。