Skip to content

Latest commit

 

History

History
232 lines (169 loc) · 6.27 KB

README.md

File metadata and controls

232 lines (169 loc) · 6.27 KB
WishList dApp Logo

WishList dApp

Solidity Hardhat Next.js React TailwindCSS License: MIT

A decentralized application for creating and managing wish lists on the blockchain. Empower your gifting experience with transparency and security.

WishList Homepage

Explore DemoReport BugRequest Feature

📑 Table of Contents

🌟 Features

  • 📝 Create and manage personal wish lists on the blockchain
  • 🎁 Add items with names, descriptions, and prices
  • 👀 View wish lists of friends and family
  • 💰 Purchase items from others' wish lists securely
  • 🔒 Transparent and tamper-proof transactions
  • 🌐 Cross-platform compatibility (Desktop & Mobile)

🛠️ Tech Stack

Backend

  • Solidity ^0.8.24
  • Hardhat 2.22.5
  • OpenZeppelin Contracts 5.0.2
  • Ethers.js 6.4.0

Frontend

  • Next.js 14.2.5
  • React 18
  • TailwindCSS 3.4.1
  • RainbowKit 2.1.3
  • wagmi 2.12.0

Testing & Quality Assurance

  • Chai
  • Mocha
  • Hardhat Network Helpers
  • Solidity Coverage

🏗️ Architecture

wishlist-dapp/
├── backend/
│   ├── contracts/
│   │   └── WishList.sol
│   ├── test/
│   │   └── WishList.test.js
│   ├── scripts/
│   │   └── deploy.js
│   ├── hardhat.config.js
│   └── package.json
├── frontend/
│   ├── pages/
│   ├── components/
│   ├── styles/
│   └── package.json
└── README.md

📜 Smart Contract

The WishList.sol contract is the backbone of our dApp, enabling users to:

  1. Add items to their wish list
  2. Buy items from others' wish lists
  3. Retrieve wish list data

Key Functions

function addToWishList(string calldata _name, uint256 _price) external;
function buyItem(address _for, uint16 _itemId) external payable;
function getWishList(address _of) external view returns(Item[] memory);

🚀 Deployed on Polygon AMOY testnet

🔍 View full contract on Polygonscan

🖥️ Frontend

Our frontend provides an intuitive interface for seamless interaction with the WishList smart contract:

  • 🌈 Connect wallet using RainbowKit
  • ➕ Add and manage items in personal wish list
  • 🔍 Explore and purchase items from friends' wish lists
  • 📱 Responsive design for optimal mobile and desktop experience

🚀 Getting Started

  1. Clone the repository
git clone https://github.com/adelamare-blockchain/dApp_wishList
cd wishlist-dapp
  1. Install dependencies
cd backend && yarn
cd ../frontend && yarn
  1. Set up environment variables (refer to .env.example in both directories)

  2. Run the development server

# Terminal 1: Backend
cd backend
yarn hardhat node

# Terminal 2: Frontend
cd frontend
yarn run dev
  1. Open http://localhost:3000 in your browser

🧪 Testing

We've rigorously tested all functionalities using Hardhat. Run the test suite:

cd backend
yarn hardhat test
View Test Results
WishList
  Deployment
    ✔ Should deploy with an empty wish list
  addToWishList
    ✔ Should allow users to add items to their wish list
  buyItem
    ✔ Should allow users to buy items from the wish list
    ✔ Should revert if not enough funds are sent
    ✔ Should revert if the item is already bought
  getWishList
    ✔ Should return the correct wish list for an address

6 passing (1.52s)

🌐 Deployment

  1. Deploy the smart contract
cd backend
yarn hardhat run scripts/deploy.js --network polygonAmoy
  1. Get the contract address & ABI in frontend/constants/index.jsx

  2. Build and deploy the frontend

cd frontend
yarn run build
# Deploy the 'out' directory to your preferred hosting service

📸 Screenshots

WishList Homepage Add Item to WishList
View Friend's WishList

🤝 Contributing

Contributions are welcome! Please check out our Contribution Guidelines for details on our code of conduct and the process for submitting pull requests.

📄 License

This project is licensed under the MIT License. See the LICENSE file for details.

🙏 Acknowledgments

  • OpenZeppelin for secure smart contract libraries
  • Hardhat for Ethereum development environment
  • RainbowKit for wallet connection UI
  • TailwindCSS for utility-first CSS framework
Made with ❤️ by Antoine Delamare (https://github.com/adelamare-blockchain)