GiftHub Website
🚀 GiftHub is a modern, production-ready e-commerce website built with cutting-edge web technologies, designed to deliver a smooth shopping experience for customers looking for personalized gifts and subscription boxes.
✨ Technology Stack
This project uses a robust, modern stack:
Core Framework
⚡ Next.js 15 – Production-ready React framework with App Router
📘 TypeScript 5 – Type-safe JavaScript for a better developer experience
🎨 Tailwind CSS 4 – Utility-first CSS framework for rapid UI development
UI Components & Styling
🧩 shadcn/ui – Accessible, high-quality components built on Radix UI
🎯 Lucide React – Consistent, modern icon library
🌈 Framer Motion – Smooth animations and interactions
Forms & Validation
🎣 React Hook Form – Easy-to-use forms
✅ Zod – TypeScript-first schema validation
State Management & Data Fetching
🐻 Zustand – Simple and scalable state management
🔄 TanStack Query – Efficient data fetching and caching
🌐 Axios – Promise-based HTTP client
Database & Backend
🗄️ Prisma – Type-safe database ORM
🔐 NextAuth.js – Authentication solution
Advanced UI Features
📊 TanStack Table – Headless tables with sorting, filtering, and pagination
🖱️ DND Kit – Drag-and-drop functionality
📊 Recharts – Charts and data visualization
🖼️ Sharp – High-performance image optimization
Utilities
🌍 Next Intl – Multi-language support
📅 Date-fns – JavaScript date utility library
🪝 ReactUse – Collection of essential React hooks
🏎️ Key Features
Fast development with pre-configured tooling
Beautiful, responsive UI using shadcn/ui and Tailwind CSS
Full TypeScript type safety and Zod validation
Database-ready with Prisma ORM
Authentication included via NextAuth.js
Advanced data handling with charts, tables, and drag-and-drop
Internationalization and theme support
🚀 Quick Start
npm install
npm run dev
npm run build
npm start
Open http://localhost:3000 to view the site locally.
📁 Project Structure src/ ├── app/ # Next.js App Router pages ├── components/ # Reusable React components │ └── ui/ # shadcn/ui components ├── hooks/ # Custom React hooks └── lib/ # Utilities and configuration
🎨 Features
UI Components: Cards, forms, alerts, modals, navigation, and more
Data Features: Tables with filtering/pagination, charts, and analytics
Interactive Features: Animations, drag-and-drop, theme switching
Backend Integration: Authentication, Prisma database, API client
Production-Ready: Multi-language support, image optimization, type safety