BlockAuth

A modern, responsive product authenticity system for electronic devices, currently implemented as a web app with QR-based verification. Blockchain integration is planned for the future.

🔗Live link

http://block-auth.vercel.app

🚀 Features

• Manufacturer Portal: Register products and generate QR codes
• Retailer Portal: Record sales and buyer information
• Customer Portal: Verify authenticity and view sale history
• Modern UI: Clean, professional interface with smooth user experience
• Responsive: Optimized for all device sizes
• Planned Blockchain: Future-proof design for decentralized verification

📊 Current Level

• Web app built with Vite, React, and TypeScript
• All data managed within the app (blockchain integration not yet implemented)
• QR codes generated for each product for customer verification

🔮 Future Plans

• Integrate blockchain (Ethereum) to store product registration, sales, and verification data
• Use smart contracts for tamper-proof authenticity records
• Enable decentralized verification for customers

🛠️ Tech Stack

Technology	Description
	JavaScript library for building user interfaces
	Strongly typed programming language for scalable apps
	Utility-first CSS framework for rapid styling
	Fast build tool and development server
	Accessible UI components
	Primitives for building design systems
	(Planned) Blockchain interaction library
	(Planned) Smart contract language
	(Planned) Decentralized file storage

🧰 Tools & Utilities

Tool	Purpose
	Code editing
	Version control
	Project hosting

📦 Installation

1. Clone the repository:

git clone <repository-url>
cd blockauth

2. Install dependencies:

npm install

3. Start the development server:

npm run dev

4. Open http://localhost:5173 in your browser.

🏗️ Available Scripts

• npm run dev - Start development server
• npm run build - Build for production
• npm run preview - Preview production build
• npm run lint - Run ESLint

📁 Project Structure

src/
├── components/     # Reusable UI components
│   ├── ui/        # Shadcn/ui panels (Manufacturer, Retailer, Customer)
│   └── ...        # Custom components
├── hooks/         # Custom React hooks
├── lib/           # Utilities (blockchain, QR, etc.)
├── pages/         # Main and 404 pages
└── main.tsx       # Application entry point

🎨 Customization

You can customize colors, fonts, and other design tokens in the src/index.css file. Update contract addresses and ABI in src/lib/utils.ts as needed (for blockchain integration).

📄 License

This project is open source and available under the MIT License.

👤 Author

Arun Pratap Singh