This web application submission enables user to view, buy, add, delete their products in the marketplace. This marketplace keeps tracks of user transactions done on the marketplace.
- View list of products in the marketplace
- Add new products
- Delete products
- View transaction history, i.e. a record for every transaction made on the marketplace (buy, sell, and remove transactions).
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.
To run the application locally, follow these steps:
- Clone the repository to your local machine using:
git clone https://github.com/Blisado1/Celo-Frontend-Challenge - Move into react-app folder:
cd celo-fe-101/packages/react-app - Install:
npm installoryarn install - Start:
npm run dev - Open the application in your web browser at
http://localhost:3000
- Install a wallet: MetamaskExtensionWallet.
- Create a wallet.
- Go to https://faucet.celo.org/alfajores and get tokens for the alfajores testnet.
- Switch to the alfajores testnet.
- Connect your wallet to the app.
- Create multiple products.
- Create a second account in your extension wallet.
- Add products to your cart
- Checkout from cart and pay
- Check balance
- Switch to first account and check sales
- Then withdraw money in sales to first account
- Fork this repository
- Create a new branch for your changes: git checkout -b my-feature-branch
- Make your changes and commit them: git commit -m "feat: create new feature"
- Push your changes to your fork: git push origin my-feature-branch
- Open a pull request to this repository with a description of your changes
Please make sure that your code follows the Solidity Style Guide and the React Style Guide. You can add tests for any new features or changes, also please make the front-end more friendly. I welcome any contributions or feedback on this project!