Awesome client

NFT Marketplace

https://github.com/nmaskens/Sarita-s-Marketplace
Project image

Website: Pigeon DAO

Role: Blockchain & Frontend Developer

Timeline: 2022 - Present

Team Members: Watson Lewis-Rodriguez, Frank Dierolf, Pedro Chechin

Tags: Ethereum, XYO, Blockchain, Frontend

Description:

Pigeon DAO connects independent package couriers with customers and allows them to communicate and get paid in crypto through decentralised networks to deliver packages.

Tech Stack:

  • HTML5

  • CSS3

  • TailwindCSS

  • JavaScript

  • Typescript

  • Next.js

  • Solidity

  • Ethers.js

  • Hardhat

Tools:

*

*

*

  • Jira

  • Slack

  • Visual Studio Code

  • Webpack

  • OpenZeppelin

Problem

Pigeon DAO is a decentralised courier protocol. We were trying to a protocol for couriers to connect with customers directly through decentralised protocols, but in a way that was both secure AND scalable.

Solution

So for this we needed to figure out what tools and skills we needed, so that we could learn and use them. We figured out what decentralised protocols we needed, which was Ethereum, XYO Network and Waku protocol, a libp2p-based protocol. We looked into the technologies within them we needed to learn and started learning and implementing them. We are close to launching our V1 of Pigeon, which will be followed by the DAO to fund and manage the protocol.

Phases:

  • Analysis

  • Discovery

  • Design

  • Setup

  • Development

  • Testing

  • Deployment

  • Support

Analysis

Audit:

Research:

Discovery

Technology:

Design

Low Fidelity:

High Fidelity:

Collaboration:

Accessibility:

Delivery:

Setup

Development

Each developer working on the project has a dedicated Staging theme to test feature branches. This process insures that new features are functioning reliably before merging with the Production theme.

Testing

User Testing:

  • Chrome DevTools

  • BrowserStack

Automated Testing:

  • Cypress

  • Deque Accessibility Audit

Deployment

Our team deployed the Shopify theme across 13+ stores using Deploybot with a connection to the Production branch on Bitbucket.

Continuous development is branched off of the Staging branch. All approved feature branches are merged back into Staging and tagged for a release merge into the Production branch.

Deploybot is configured to automate continuous deployment of new feature and code merged into the Production branch and published theme.

Live Website

Pigeon DAO

Support

  • A post-launch accessibility audit was performed on the entire website in collaboration with Deque.
  • Bugs discovered post-launch were added to the Backlog and assigned to developers on the team.

Future Steps

Further optimization of page load speeds and reducing bundle sizes of resources. Refactoring of custom CSS and JavaScript can be done to achieve a lower time to first byte and first paint.

Additional automated testing scripts can be written to test common functions of the website. This reduces the need for user testing and frees up developer time for more productive tasks.

Expansion of horizontal scaling was in the works for ROCCAT Gaming. The 13 Shopify Plus stores initially configured for launch eventually expanded to 20+ stores to scale horizontally across additional regions.

Results

  • A successful launch of an international DTC e-commerce brand across 13+ Shopify Plus stores.

  • Generated millions of dollars in revenue for ROCCAT Gaming and their stakeholders.

  • Created a scalable & highly performant e-commerce experience that engaged users.

Project Overview

The goal of this project is to create an NFT marketplace where users can buy, sell, and trade non-fungible tokens (NFTs) on the Ethereum blockchain. The marketplace will be built using Solidity for smart contract development, ethers.js for interacting with the Ethereum blockchain, and React for front-end development.

Features

  1. User Authentication: Users should be able to sign up and log in to the platform using their Ethereum wallet address and private key.

  2. NFT Marketplace: Users can browse and purchase NFTs listed for sale by other users. They can also list their own NFTs for sale, set their own prices, and receive payments in Ether.

  3. NFT Trading: Users can trade NFTs with other users. They can create their own trades and set their own terms, including the NFT(s) they are willing to trade and the NFT(s) they want in return.

  4. Auctions: Users can create auctions for their NFTs, allowing other users to bid on them. The highest bidder at the end of the auction will win the NFT.

  5. NFT History: Users can view the transaction history of any NFT, including its previous owners and the price it was sold for.

  6. Wallet Integration: Users can connect their Ethereum wallet to the platform to view their NFTs and Ether balance.

  7. Search: Users can search for specific NFTs based on keywords or attributes.

  8. Notifications: Users will receive notifications when they have sold an NFT, when a trade has been accepted, or when an auction they are bidding on is ending soon.

Tech Stack

  1. Smart Contract Development: Solidity, Remix IDE, Truffle

  2. Blockchain Interaction: ethers.js, Web3.js

  3. Front-end Development: React, Material UI

  4. Testing: Mocha, Chai

Deliverables

  1. Solidity smart contracts that handle the core functionality of the NFT marketplace, including buying and selling NFTs, creating and accepting trades, and creating and participating in auctions.

  2. A React-based front-end that allows users to interact with the smart contracts and use the features of the platform.

  3. Unit and integration tests for the smart contracts and front-end components.

  4. A deployment script to deploy the smart contracts and front-end to the Ethereum blockchain.

Timeline

  1. Week 1-2: Develop the smart contracts using Solidity, Remix IDE, and Truffle. Write and execute unit tests.

  2. Week 3-4: Develop the React-based front-end using Material UI. Integrate the front-end with the smart contracts using ethers.js.

  3. Week 5-6: Write and execute integration tests for the smart contracts and front-end components.

  4. Week 7-8: Deploy the smart contracts and front-end to the Ethereum blockchain. Conduct a thorough end-to-end testing of the platform.

Conclusion

The NFT marketplace project is a challenging and exciting opportunity to build a platform that leverages the power of the Ethereum blockchain to enable users to buy, sell, and trade NFTs. By using Solidity for smart contract development, ethers.js for interacting with the Ethereum blockchain, and React for front-end development, you can create a robust and user-friendly marketplace that is easy to use and navigate. With thorough testing and deployment, you can ensure that your NFT marketplace is secure, reliable, and scalable.