查看最終代碼和網站效果
https://github.com/skka3134/Dapp-Ticketmaster-Clone
https://dapp-ticketmaster-clone-foelzygo-skka3134.4everland.app/
- 使用 remix and Wizard 開發合約
https://remix.ethereum.org/
https://docs.openzeppelin.com/contracts/4.x/wizard
編譯選擇 optimization 優化,版本選擇 0.18.8+
部署到 sepolia 0x734e5aE3a4DDD8f8dF0f8703617a3D593D353d4C
- 創建一個 React 項目
npx create-react-app test
- 安裝依賴
npm install [email protected]
npm install [email protected]
npm install web3uikit
npm install @web3uikit/icons
npm install @web3uikit/core
npm install [email protected]
npm install express
npm install dotenv
npm install cors
npm install moralis
npm install react-moralis
npm install bootstrap
npm install react-bootstrap
- 啟動項目
npm start
- 修改 index.css
- 創建導航組件 /src/components/Navigation.js
- 創建卡片組件 src/components/Card.js
- 創建搜索組件 /src/components/Sort.js
- 創建坐位組件 /src/components/Seat.js
- 創建坐位組件 /src/components/SeatChart.js
- 導入合約的 abi /src/abis/TokenMaster.json
- 修改網頁 /src/app.js
- 上傳到 github
https://github.com/
https://github.com/skka3134/Dapp-Ticketmaster-Clone - 部署到 4everland,4everland 是一個靜態托管工具,一步到位。
https://4everland.org/
https://dapp-ticketmaster-clone-foelzygo-skka3134.4everland.app/