最終のコードとウェブサイトの効果を確認する
https://github.com/skka3134/Dapp-Ticketmaster-Clone
https://dapp-ticketmaster-clone-foelzygo-skka3134.4everland.app/
-
remix と Wizard を使用して契約を開発する
https://remix.ethereum.org/
https://docs.openzeppelin.com/contracts/4.x/wizard
最適化を選択し、バージョンを 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/