CELO FRONTEND 101

My live demo from celo dacade frontend 101 course: https://celo-frontend-101-react-app-xi.vercel.app/

Description

A simple dapp built on celo blockchain interact with nextjs frontend. User can do simple CRUD and choose random product to buy on Alfajores testnet. (https://explorer.celo.org/alfajores/address/0xa590a8FCdc235481710290BF62E5A651b7121da3)
Contract deploy on alfajore testnet: 0xa590a8FCdc235481710290BF62E5A651b7121da3

Demo choose random function product

random_product.mp4

Tech stacks

This web aplication uses the following tech stack:

• Solidity - A programming language for Ethereum smart contracts.
• React - A JavaScript library for building user interfaces.
• Typescript - a strongly typed programming language that builds on JavaScript.
• Rainbowkit-celo - RainbowKit is a React library that makes it easy to add wallet connection to dapp.
• Wagmi - wagmi is a collection of React Hooks containing everything you need to start working with Ethereum
• Hardhat - A tool for writing and deploying smart contracts.
• TailwindCss - A CSS framework that dress up webpage.

Prerequisites

• Node v16 or higher
• Git v2.38 or higher
• Metamask or CeloExtension wallet

Usage & installation

• Clone the repository using command git clone https://github.com/anhfactor/celo-frontend-101
• Move into react folder cd celo-frontend-101/packages/react-app/
• Run yarn install or npm install to install all required dependencies
• Start the server using command yarn run dev or npm run dev
• Open web browser and go to http://localhost:3000