使用 React.js 串接 Recipe Search API 製作食譜網站，並部屬至 Firebase

API ID & KEY 放在 .env 檔內，可至 GIthub/README 查看

食譜網站連結(Firebase):

https://recipeapp-reactjs-22d3c.firebaseapp.com/

Recipe Search API:

https://developer.edamam.com/edamam-docs-recipe-api

在 Search bar 輸入食材關鍵字，如 "tomato"

以及選擇健康標籤選單

則可獲得 "tomato" 相關食譜

由於螢幕錄影無法擷取到健康標籤選單內容，這邊附上選單縮圖

點擊圖片即可查看食譜

查詢其他食材關鍵字，如 "broccoli"

專案技術

- Node.js v16.18.0

- axios v1.2.1

- react v18.2.0

- react-dom v18.2.0

- react-scripts v5.0.1

完整程式碼(Github):

https://github.com/Bajohn69/js-practice/tree/main/Recipe/recipe