# web3買賣平台
成果：https://www.youtube.com/watch?v=NE3BwEfdpfM
github：https://github.com/chenangel89/second_hand_books_marketplace

- [二手書打包成NFT](https://hackmd.io/@chenangel89/SkGbRNt7h)
- [樣板網站(還沒用react、用其他專案改的所以程式會有點亂)](https://jsfiddle.net/chen_angel89/89j30srf/7/)
- [顯示nft的方法](https://hackmd.io/@chenangel89/H19NU5qEn)
- [網頁上架NFT+買賣](https://hackmd.io/@chenangel89/HJqhNvCHh)

| date | task | complete |
| -------- | -------- | -------- |
| 4/25 | figma畫頁面功能 | done |
| 5/2 | 了解把書打包成nft| done |
| 5/9 | 把nft顯示在前端 | done |
| 5/16 | 把nft顯示在前端 + 前端個人nft顯示的設計 | △ |
| 5/23 | 可在前端直接上架nft | △ |
| 5/30 | 可轉移nft到購買人錢包 可轉移測試幣 | △ |
| 6/6 | 測試+修正前端頁面 合約 | |

使用工具：Hardhat(+Hardhat-Ethers)、MetaMask、 NFT.Storage(IPFS)、Dotenv、Solidity(openzeppelin)、react

<br>

要完成的項目：

- [x] figma 畫頁面功能
- [x] 連接metamask
* 商品list
* 商品介紹、個數...
* ~~關鍵字搜尋功能(進階搜尋)~~
* 購買
* ~~辦會員~~

<div style="margin-bottom:1000px"></div>

<blockquote>
第一週（4/25-5/1）：

- 建立React應用程式框架。

- 建立基本的前端頁面，例如登錄和首頁。

使用工具：
- React

第二週（5/2-5/8）：
- 實現用戶註冊和登錄功能，並與Hardhat合約互動驗證帳戶是否存在。
- 在Hardhat中建立一個最簡單的Solidity合約，並測試合約部署和互動。

使用工具：
- React
- Hardhat

第三週（5/9-5/15）：
- 完成二手書展示商品頁，從Hardhat合約中讀取商品數據，並在前端頁面中顯示。
- 實現商品詳細資料頁面，該頁面應該包含有關書籍的詳細信息。

使用工具：
- React
- Hardhat

第四週（5/16-5/22）：
- 實現購物車功能，允許用戶添加商品到購物車並查看已選擇的商品。
- 在Hardhat合約中更新庫存和購買紀錄。

使用工具：
- React
- Hardhat

第五週（5/23-5/29）：
- 完成填寫資料頁面，允許用戶輸入收貨地址、付款方式等資料。
- 完成會員詳細資料頁面，允許用戶查看其訂單紀錄。

使用工具：
- React
- Hardhat

第六週（5/30-6/2）：
- 優化應用程式，修復任何錯誤。
- 測試整個應用程式。
- 可選：加入其他功能或特性，例如身份驗證或付款處理。

使用工具：
- React
- Hardhat

</blockquote>

- [ ] Hardhat & metamask 環境設定
- [ ] react框架

參考資料：
[Learn Blockchain, Solidity, and Full Stack Web3 Development with JavaScript – 32-Hour Course](https://www.youtube.com/watch?v=gyMwXuJrbJQ)