All Projects

|

Rarity Haven

🗓️ 2025

  • R
  • a
  • r
  • i
  • t
  • y
  • -
  • H
  • a
  • v
  • e
  • n

Rarity Haven is a platform that allows artists to create and sell unique digital art pieces as NFTs. The platform is built on top of the Ethereum blockchain and uses smart contracts to ensure the ownership and scarcity of the digital art pieces.

Tech Stack:

Next.js

Tailwind CSS

Ether.js

Three.js

Turborepo

Framer Motion

Express.js

MongoDB

Pinata

Cloudinary

Zod

Ethereum

Hardhat

Mongoose

Smart Contract

Zod

Lenis

Lucide React

Typescript

React.js

Email.js

Vercel

Rarity Haven

Features and Functionality

NFT Minting

Artists can mint unique digital art pieces as NFTs on the Ethereum blockchain using smart contracts powered by Hardhat and Ether.js.

Decentralized Storage

Images and metadata are uploaded to IPFS via Pinata, ensuring decentralization and permanence of NFT assets.

User Authentication & Dashboard

Authenticated users can manage their profile, view owned NFTs, and monitor transaction history through a secure dashboard.

Interactive 3D Art Previews

Three.js is used to offer immersive 3D previews for digital art, enhancing the collector’s experience.

Responsive & Smooth UI

Built with Tailwind CSS, Framer Motion, and Lenis for responsive design, fluid animations, and smooth scrolling.

Image Optimization

Cloudinary is integrated for high-performance image optimization and transformation, particularly for thumbnails and previews.

Smart Contract Backend

Backend built with Express.js and MongoDB (via Mongoose) to store user and transaction data that complements the blockchain.

Schema Validation

Zod is used to validate form inputs and API requests, ensuring data integrity across the app.

Monorepo Architecture

Turborepo allows for organized, scalable codebases across multiple packages like the frontend, backend, and smart contracts.

Email Notifications

Email.js sends confirmation emails and notifications for NFT minting, purchases, and important account updates.

Deployment & Hosting

Vercel is used for fast frontend deployment, serverless functions, and easy CI/CD integration.

Challenges and Solutions

Gas Optimization during NFT Minting

Optimized smart contract logic and batch minting to reduce gas fees using Hardhat testing and simulations.

Decentralized Asset Management

Integrated Pinata for IPFS uploads with fallback verification checks to ensure assets are pinned and persistently available.

User Experience for Non-Crypto Users

Added wallet connection guides, simplified MetaMask onboarding, and built fallback alerts for transaction statuses using Ether.js.

Data Sync between Blockchain and Backend

Used event listeners in smart contracts to trigger backend updates and MongoDB sync via Express.js.

3D Rendering Performance Issues

Used lazy loading and reduced asset complexity in Three.js scenes to ensure performance across devices.

File Size and Image Quality Tradeoffs

Cloudinary transformations are used to deliver high-quality compressed images with WebP format for faster loading.

Maintaining Consistency in a Monorepo

Turborepo with shared configurations, strict TypeScript settings, and reusable utilities ensured code consistency across packages.

Validation Across Client and Server

Zod schemas were shared between frontend and backend to maintain a single source of truth for data validation.

Work - Rarity Haven