GitHub 熱榜上的 1324 個健身動作項目，我用 AI 編程做成了搜索站
整理版優先睇
用 vibe coding 將 GitHub 健身數據集變成搜索站，AI 真係拉低咗實現門檻
呢篇文章嘅作者見到 GitHub 熱榜有個 exercises-dataset，整理咗 1324 個健身動作嘅結構化數據。佢覺得呢啲數據好好用，但淨係睇文字唔夠，所以諗住整一個可以搜、可以睇 GIF 嘅網站。
作者用 vibe coding 嘅方法，配合 React + Ant Design，再補上 ExerciseGymGifsDB 嘅動作 GIF，好快就砌咗個在線搜索站出嚟。佢嘅結論係：AI 編程令到一個諗法好快變成可以操作嘅頁面，不過商業用就要留意媒體授權問題。
- 用 vibe coding 可以快速將結構化數據變成實用工具，唔使再淨係收藏。
- 整合 exercises-dataset 動作數據同 ExerciseGymGifsDB 動作 GIF，用 React + Ant Design 搭建搜索頁面。
- 傳統做法要手動處理數據，而家直接用結構化數據配合 AI 提示詞，第一版就落地。
- AI 編程降低實現門檻，但商業使用一定要重新確認媒體授權。
- 可以參考作者嘅提示詞同代碼，自己整一個健身動作搜索站或者小程序。
exercises-dataset
1324 條健身動作結構化數據，包含動作名稱、分類、目標肌羣、器械、多語言說明等
ExerciseGymGifsDB
健身動作 GIF 演示素材庫，透過 CDN 可穩定存取
在線演示
作者整嘅健身動作搜索站，可以搜動作、篩選、睇 GIF 同步驟
示範代碼
GitHub 倉庫，包含完整 React 源碼
健身數據集嘅結構化價值
呢個 exercises-dataset 喺 GitHub 熱榜上好火，因為佢將 1324 個健身動作 整理成結構化數據。每條動作都有動作名稱、分類、身體部位、目標肌羣、輔助肌羣、器械、步驟說明同多語言內容（支援6種語言）。
結構化字段令到程式可以直接讀取、篩選、組合，唔使再從文字重新拆
例如一條數據嘅格式係 JSON，包含 id、name、body_part、equipment、target、secondary_muscles、instruction_steps 等字段。咁樣做訓練計劃生成器或者 AI 私教知識庫就好方便。
媒體資源嘅補完：GIF 演示
淨係文字唔夠，健身動作需要圖片或者 GIF 先明點發力。exercises-dataset 有 media_id，但作者發現直接攞 GIF 嘅路徑唔穩定。佢揾到另一個項目 ExerciseGymGifsDB，呢個庫提供咗動作 GIF 嘅索引同素材地址，用 jsDelivr CDN 可以穩定存取。
- exercises-dataset：提供動作數據、分類、器械、目標肌羣、多語言說明
- ExerciseGymGifsDB：提供動作 GIF 演示素材
用 vibe coding 搭頁面：React + Ant Design
作者用 vibe coding 嘅方法，直接俾 AI 一個清楚嘅提示詞：準備好兩個數據源，要求用 React + Ant Design 做一個搜索頁面，包含搜索框、篩選條件、分頁卡片列表同詳情彈窗。
我準備了兩個健身動作相關的數據源：
1. exercises-dataset，裏面有動作名稱、分類、身體部位、目標肌羣、器械、步驟說明、多語言內容和 media_id。
2. ExerciseGymGifsDB，裏面有動作 GIF 信息，可以通過 jsDelivr CDN 讀取索引和素材地址。
請用 React + Ant Design 幫我做一個健身動作搜索頁面。
頁面要求：
- 頂部有搜索框，可以按動作名稱搜索。
- 支持按身體部位、器械、目標肌羣篩選。
- 主體是分頁卡片列表，每張卡片展示動作名稱、部位、器械和 GIF 預覽。
- 點擊卡片後打開詳情彈窗。
- 詳情彈窗裏展示 GIF、動作基礎信息、目標肌羣、輔助肌羣和分步驟說明。呢個提示詞唔複雜，但關鍵係講清楚數據來源、技術棧同核心功能。作者強調，如果只講「幫我做個健身網站」，結果好易走偏；寫具體啲，第一版就更容易落地。
AI 編程將實現想法嘅門檻拉低咗好多，以前可能收藏就完，而家可以即刻整出嚟
總結：從數據到產品，仲要留意授權
最後做出嚟嘅係一個在線健身動作搜索站，列表頁可以搜動作、篩選，詳情頁有 GIF 同步驟說明。作者話，如果係自己學習、寫文、演示，用開源素材組合冇問題；但想做商業產品，動作圖片、GIF 呢啲媒體素材一定要 重新確認授權。
- 1 可以繼續做微信小程序動作庫，方便手機查詢
- 2 可以做訓練計劃生成器，按目標肌羣、器械自動組合動作
作者仲提到，呢個項目嘅起點只係一個簡單嘅搜索站，但已經足夠開始。如果你都想試，可以從作者提供嘅三個入口開始：原始數據集、在線演示同示範代碼。
最近 GitHub Trending 上有個健身數據集好興，叫做 exercises-dataset。佢整理咗 1324 個健身動作，分類、器械、目標肌羣、動作步驟、多語言說明都配齊曬。
健身動作資料整理係細緻功夫。動作叫咩名，主要練邊度，使唔使器械，步驟點寫，中文說明點補，輔助肌羣點標，呢啲資訊真要逐條處理，要花唔少時間。exercises-dataset 直接將呢啲內容整理成一份可以重用嘅數據，用嚟做篩選搜尋、動作庫、訓練計劃，都非常正。
呢個項目提供啲咩
主角 hasaneyldrm/exercises-dataset，GitHub 地址喺呢度：
https://github.com/hasaneyldrm/exercises-dataset佢提供咗1324 條健身動作嘅結構化數據。每條數據入麪包含動作名稱、分類、身體部位、目標肌羣、輔助肌羣、器械、步驟說明、多語言內容（支援6種唔同語言，英文、西班牙文、意大利文、土耳其文、俄文、中文）。
一條動作數據大概係咁樣：
{ "id": "0001", "name": "3/4 sit-up", "body_part": "waist", "equipment": "body weight", "target": "abs", "secondary_muscles": ["hip flexors", "lower back"], "instruction_steps": [ "Lie flat on your back with your knees bent and feet flat on the ground.", "Place your hands behind your head with your elbows pointing outwards.", "Engaging your abs, slowly lift your upper body off the ground." ], "media_id": "0001"}呢份數據好用嘅地方，在於佢已經將動作名稱、訓練部位、目標肌羣、器械同步驟說明拆成字段。程式可以直接讀取、篩選、組合，唔使再從一大段文字度重新拆。
例如做訓練計劃生成器，可以按目標肌羣同器械條件去組合動作。做 AI 私教嗰陣，呢啲結構化字段都可以作為底層知識庫，令生成嘅建議更具體。
媒體資源點處理
做健身動作查詢，剩係睇文字唔夠。一個動作到底點發力、身體點移動，最好仲有圖片或者 GIF。
exercises-dataset 嘅數據入面有 media_id，項目文檔話可以透過 media_id 調用接口揾到對應動作 GIF。但我實際用嗰陣，呢條路徑喺當前環境下冇辦法穩定正常攞到。
喺 X 上面見到有位老師提到 ExerciseGymGifsDB，呢個項目啱啱補返動作 GIF 呢塊。於是，喺我嘅搜尋站項目開發中，exercises-dataset 負責動作數據，ExerciseGymGifsDB 負責動作 GIF 演示。
| hasaneyldrm/exercises-dataset | |
| JahelCuadrado/ExerciseGymGifsDB |
ExerciseGymGifsDB 嘅 GitHub 地址喺呢度：
https://github.com/JahelCuadrado/ExerciseGymGifsDB我啲代碼入面用緊 ExerciseGymGifsDB 提供嘅呢個索引：
https://cdn.jsdelivr.net/gh/JahelCuadrado/ExerciseGymGifsDB@v1.1.0/api/en/exercises.json目前喺國內網絡環境下，呢個地址都正常訪問到。
準備好數據源之後，vibe coding 搭頁面
數據源處理完，頁面本身就好簡單喇。我做嘅係一個 Web 演示，用 React + Ant Design。對成日 vibe coding 嘅人嚟講，React 應該唔陌生；Ant Design 又係 React 生態入面成日用嘅組件庫，表單、列表、卡片、彈窗、分頁呢啲組件都有，做呢啲管理台風格嘅小頁面好順手。
今次頁面結構比較簡單：頂部搜尋框、篩選條件、分頁卡片列表、動作詳情彈窗，再加埋 GIF 預覽同步驟說明。
畀 AI 嘅提示詞，大概可以寫成咁樣：
我準備了兩個健身動作相關的數據源： 1. exercises-dataset，裏面有動作名稱、分類、身體部位、目標肌羣、器械、步驟說明、多語言內容和 media_id。2. ExerciseGymGifsDB，裏面有動作 GIF 信息，可以通過 jsDelivr CDN 讀取索引和素材地址。 請用 React + Ant Design 幫我做一個健身動作搜索頁面。 頁面要求：- 頂部有搜索框，可以按動作名稱搜索。- 支持按身體部位、器械、目標肌羣篩選。- 主體是分頁卡片列表，每張卡片展示動作名稱、部位、器械和 GIF 預覽。- 點擊卡片後打開詳情彈窗。- 詳情彈窗裏展示 GIF、動作基礎信息、目標肌羣、輔助肌羣和分步驟說明。呢個提示詞唔複雜，關鍵係將數據來源、技術棧、核心功能同㩒落去之後嘅展示內容都講清楚。淨係話「幫我做個健身網站」，結果好容易走樣；將頁面結構同交互寫具體，第一版就更容易出嚟。
我之後亦有計劃將呢個方向繼續做成微信小程序版本，而家仲喺籌備中。小程序更適合手機查詢，尤其係健身動作呢啲隨手打開、隨手查嘅場景。
最後做出嚟嘅效果
最後做出嚟嘅係一個在線健身動作搜尋站。列表頁入面可以搜尋動作，亦可以按身體部位、器械、目標肌羣篩選。㩒開某個動作之後，會彈出詳情頁，入面有 GIF、基礎資訊、目標肌羣、輔助肌羣同分步驟說明。
列表頁截圖：
詳情頁截圖：
頁面操作影片：
在線體驗地址：
https://eric8787x.github.io/exercise/演示代碼都放咗上 GitHub：
https://github.com/eric8787x/exercise/tree/main你可以直接打開頁面體驗，亦可以將代碼拉落嚟喺自己電腦執行。如果唔想用我啲代碼，都可以複製上面嘅提示詞，換成自己嘅數據源，做一個自己嘅版本。
今次做完之後嘅感受
我以前見到呢啲數據集，大概都係先收藏。收藏夾入面又多一個「以後可能有啲用」嘅項目，然後好長時間都唔會再開。
而家有咗 AI 同 vibe coding，一個想法好快就可以變成可以打開、可以操作嘅頁面。做完呢個小項目，都忍唔住感嘆：AI 真係將實現想法嘅門檻拉低咗好多。
呢度都要將授權問題講清楚。如果只係自己學習、寫文章、做演示，開源素材組合埋一齊玩一玩問題唔大。真係要做商業產品，動作圖片、GIF、影片呢啲媒體素材一定要重新確認授權。
之後仲可以點做
呢個項目繼續做落去，有唔少方向。例如做一個微信小程序動作庫，方便手機直接查；亦可以做訓練計劃生成器，按目標肌羣、器械、訓練頻率自動組合動作等等。
呢啲方向都唔使一開始做得太大。先有一個可以搜尋、可以篩選、可以睇動作、可以打開在線連結嘅小版本，就已經夠開始。
寫喺最後
回到 exercises-dataset 呢個項目本身，佢最直接嘅價值，係將 1324 條健身動作整理成結構化數據。
再加上 vibe coding，一個在線健身動作搜尋站好快就可以搭出嚟。
如果你都想試嚇，可以由呢三個入口開始：
原始數據集：https://github.com/hasaneyldrm/exercises-dataset 動作搜索站在線演示：https://eric8787x.github.io/exercise/ 演示代碼：https://github.com/eric8787x/exercise/tree/main你會更想將佢做成邊種版本，健身動作小程序、AI 私教，定係訓練計劃生成器？留言區可以傾嚇。
最近 GitHub Trending 上有個健身數據集很火，叫 exercises-dataset。它整理了 1324 個健身動作，分類、器械、目標肌羣、動作步驟、多語言說明都配好了。
健身動作資料整理起來是細活。動作叫什麼，主要練哪裏，要不要器械，步驟怎麼寫，中文說明怎麼補，輔助肌羣怎麼標，這些信息真要一條條處理，需要不少時間。exercises-dataset 直接把這些內容整理成了一份能複用的數據，用來做篩選搜索、動作庫、訓練計劃，都非常棒。
這個項目提供了什麼
主角 hasaneyldrm/exercises-dataset，GitHub 地址在這裏：
https://github.com/hasaneyldrm/exercises-dataset它提供了1324 條健身動作的結構化數據。每條數據裏包含動作名稱、分類、身體部位、目標肌羣、輔助肌羣、器械、步驟說明、多語言內容（支持6種不同語言，英語、西班牙語、意大利語、土耳其語、俄語、中文）。
一條動作數據大概長這樣：
{ "id": "0001", "name": "3/4 sit-up", "body_part": "waist", "equipment": "body weight", "target": "abs", "secondary_muscles": ["hip flexors", "lower back"], "instruction_steps": [ "Lie flat on your back with your knees bent and feet flat on the ground.", "Place your hands behind your head with your elbows pointing outwards.", "Engaging your abs, slowly lift your upper body off the ground." ], "media_id": "0001"}這份數據好用的地方，在於它已經把動作名稱、訓練部位、目標肌羣、器械和步驟說明拆成了字段。程序可以直接讀取、篩選、組合，不用再從一大段文字裏重新拆。
比如做訓練計劃生成器，可以按目標肌羣和器械條件去組合動作。做 AI 私教時，這些結構化字段也能作為底層知識庫，讓生成出來的建議更具體。
媒體資源怎麼處理
做健身動作查詢，只看文字不夠。一個動作到底怎麼發力、身體怎麼移動，最好還是有圖片或者 GIF。
exercises-dataset 的數據裏有 media_id，項目文檔指出可以通過 media_id 調用接口找到對應動作 GIF。但我實際使用的時候，這條路徑在當前環境裏沒法穩定正常獲取。
在 X 上看到一位老師提到 ExerciseGymGifsDB，這個項目剛好補上了動作 GIF 這塊。於是，在我的搜索站項目開發中，exercises-dataset 負責動作數據，ExerciseGymGifsDB 負責動作 GIF 演示。
| hasaneyldrm/exercises-dataset | |
| JahelCuadrado/ExerciseGymGifsDB |
ExerciseGymGifsDB 的 GitHub 地址在這裏：
https://github.com/JahelCuadrado/ExerciseGymGifsDB我的代碼中使用的是 ExerciseGymGifsDB 提供的這個索引：
https://cdn.jsdelivr.net/gh/JahelCuadrado/ExerciseGymGifsDB@v1.1.0/api/en/exercises.json目前在國內網絡環境下，這個地址也能正常訪問。
準備好數據源以後，vibe coding 搭頁面
數據源處理完，頁面本身就簡單多了。我做的是一個 Web 演示，用 React + Ant Design。對經常 vibe coding 的人來說，React 應該不陌生；Ant Design 又是 React 生態裏常用的組件庫，表單、列表、卡片、彈窗、分頁這些組件都有，做這種管理颱風格的小頁面很順手。
這次頁面結構比較簡單：頂部搜索框、篩選條件、分頁卡片列表、動作詳情彈窗，再加上 GIF 預覽和步驟說明。
給 AI 的提示詞，大概可以寫成這樣：
我準備了兩個健身動作相關的數據源： 1. exercises-dataset，裏面有動作名稱、分類、身體部位、目標肌羣、器械、步驟說明、多語言內容和 media_id。2. ExerciseGymGifsDB，裏面有動作 GIF 信息，可以通過 jsDelivr CDN 讀取索引和素材地址。 請用 React + Ant Design 幫我做一個健身動作搜索頁面。 頁面要求：- 頂部有搜索框，可以按動作名稱搜索。- 支持按身體部位、器械、目標肌羣篩選。- 主體是分頁卡片列表，每張卡片展示動作名稱、部位、器械和 GIF 預覽。- 點擊卡片後打開詳情彈窗。- 詳情彈窗裏展示 GIF、動作基礎信息、目標肌羣、輔助肌羣和分步驟說明。這個提示詞不復雜，關鍵是把數據來源、技術棧、核心功能和點擊後的展示內容都講清楚。只說「幫我做個健身網站」，結果很容易跑偏；把頁面結構和交互寫具體，第一版就更容易落地。
我後面也有計劃把這個方向繼續做成微信小程序版本，目前還在籌備中。小程序更適合移動端查詢，尤其是健身動作這種隨手打開、隨手查的場景。
最後做出來的效果
最後做出來的是一個在線健身動作搜索站。列表頁裏可以搜索動作，也可以按身體部位、器械、目標肌羣篩選。點開某個動作後，會彈出詳情頁，裏面有 GIF、基礎信息、目標肌羣、輔助肌羣和分步驟說明。
列表頁截圖：
詳情頁截圖：
頁面操作視頻：
在線體驗地址：
https://eric8787x.github.io/exercise/演示代碼也放在 GitHub 上了：
https://github.com/eric8787x/exercise/tree/main你可以直接打開頁面體驗，也可以把代碼拉下來本地跑。如果不想用我的代碼，也可以複製上面的提示詞，換成自己的數據源，做一個自己的版本。
這次做完後的感受
我以前看到這種數據集，大概率也是先收藏。收藏夾裏又多一個「以後可能有用」的項目，然後很長時間都不會再打開。
現在有了 AI 和 vibe coding，一個想法很快就能變成可以打開、可以操作的頁面。做完這個小項目，還是會忍不住感嘆：AI 真的把實現想法的門檻拉低了很多。
這裏也要把授權問題說清楚。如果只是自己學習、寫文章、做演示，開源素材組合起來玩一玩問題不大。真要做商業產品，動作圖片、GIF、視頻這些媒體素材一定要重新確認授權。
後面還可以怎麼做
這個項目繼續往下做，有不少方向。比如做一個微信小程序動作庫，方便手機端直接查；也可以做訓練計劃生成器，按目標肌羣、器械、訓練頻率自動組合動作等等。
這些方向都不用一開始做得很大。先有一個能搜索、能篩選、能看動作、能打開在線連結的小版本，就夠開始了。
寫在最後
回到 exercises-dataset 這個項目本身，它最直接的價值，是把 1324 條健身動作整理成了結構化數據。
再加上 vibe coding，一個在線健身動作搜索站很快就能搭出來。
如果你也想試試，可以從這三個入口開始：
原始數據集：https://github.com/hasaneyldrm/exercises-dataset 動作搜索站在線演示：https://eric8787x.github.io/exercise/ 演示代碼：https://github.com/eric8787x/exercise/tree/main你會更想把它做成哪種版本，健身動作小程序、AI 私教，還是訓練計劃生成器？評論區可以聊聊。