Crypto-Lottery Web App:

A Next.Js Web app for crypto-lottery, where users can buy tickets using MATIC cryptocurrency for the lottery, and an admin draws the winner using Solidity Smart contract backend, and thirdweb servers for connecting functionality. All of the WEB3 transactions are currently registred on MATIC Mumbai (a test-net for the MATIC cryptocurrency) to prevent real currency transactions, other than that transaction real and appear between wallets. As a lottery admin, you get commision for evey ticket purchased! and you control the flow of the lottery draw.

Project Technological Stack:

• NextJS & Vercel for quick start and deployment.
• ReactJS for the UI.
• Typescript & Javascript for typing.
• TailwindCSS for styling.
• Solidity for smart contracts.
• Thirdweb for deploying the smart contract.

Usage:

• To join the lottery:
  1. Visit Crypto-Lottery
  2. Create/Use a Metamask account.
  3. Welcome to Crypto-Lottery! here you can buy tickets win a draw is available.\

• To edit:
  1. Clone this repo.
  2. Run npm install to install all dependecies.
  3. Run npm start to start on local server.
  4. Create a Metamask account using the web extension.
  5. Sign in via the Login with Metamask button.\

• To create your own lottery:
  1. Clone this repo
  2. Run npm install to install all dependecies.
  3. Run npm start to start on local server.
  4. Run cd contract
  5. Run npm install to install contract dependicies.
  6. Run npx thirdweb deploy to deploy the contract to thirdweb.
  7. Follow instructions to use your Metamask account as admin.
  7.1- IF testing, make sure to use Mumbai Server as a test net!!!
  7.2- Use Faucet charging websites or similar to charge your Mumbai wallet with Dummy Matic currency.
  8. Once deployed, copy the Contract ID from thirdweb.
  9. Run cd .., Create .env.local file in your folder.
  10. In the .env.local file add the following: NEXT_PUBLIC_LOTTERY_CONTRACT_ADDRESS=YOUR_CONTRACT_ID
  11. Refresh the page.
  12. Sign in using the Metamask account you used in thirdweb.
  13. Congratulations! you can DrawWinner/RefundAll/RestartDraw/WithdrawCommision.

Mumbai Test Net data:

-Network Name: Mumbai Testnet
-New RPC URL: https://rpc-mumbai.maticvigil.com\ -Chain ID: 80001
-Currency Symbol: MATIC
-Block Explorer URL: https://polygonscan.com/

Demo & Showcasing:

• Video: User interactions

• Video: Admin controls

Special Thanks:

• Sonny Sangha for his amazing tutorial.