Skip to content

usama7871/hackathon-2

Folders and files

NameName
Last commit message
Last commit date

Latest commit

5867278 Β· Feb 13, 2025

History

12 Commits
Jan 8, 2025
Jan 8, 2025
Feb 13, 2025
Jan 8, 2025
Jan 8, 2025
Feb 4, 2025
Feb 4, 2025
Feb 13, 2025
Feb 13, 2025
Jan 8, 2025
Jan 24, 2025
Jan 24, 2025
Jan 8, 2025
Jan 8, 2025
Jan 8, 2025

Repository files navigation

πŸ›‹οΈ Funiro - Modern Furniture E-commerce

Funiro Logo

A modern, responsive e-commerce platform for luxury furniture.


✨ Features

  • 🎨 Modern, minimalist design
  • πŸ“± Fully responsive layout
  • πŸ›’ Real-time cart management
  • πŸ’³ Secure checkout process
  • πŸ” Advanced product filtering
  • πŸ–ΌοΈ Dynamic image galleries
  • πŸŒ™ Smooth animations
  • πŸ”’ User authentication
  • πŸ’– Wishlist functionality
  • πŸ”„ Product comparison

πŸš€ Tech Stack

  • Framework: Next.js 14
  • Styling: Tailwind CSS
  • Animations: Framer Motion
  • State Management: Context API
  • Icons: Lucide Icons
  • Form Handling: React Hook Form
  • Image Optimization: Next/Image
  • Type Safety: TypeScript

πŸ› οΈ Installation

  1. Clone the repository:

    git clone https://github.com/usama7871/hackathon-2.git
    cd hackathon-2
  2. Install dependencies:

    npm install
  3. Run the development server:

    npm run dev

πŸ“‚ Project Structure

funiro/
β”œβ”€β”€ src/
β”‚   β”œβ”€β”€ app/ # App router pages
β”‚   β”‚   β”œβ”€β”€ about/ # About page
β”‚   β”‚   β”‚   └── page.tsx # About page component
β”‚   β”‚   β”œβ”€β”€ blog/ # Blog pages
β”‚   β”‚   β”‚   β”œβ”€β”€ [slug]/ # Dynamic blog post pages
β”‚   β”‚   β”‚   β”‚   └── page.tsx # Blog post component
β”‚   β”‚   β”‚   β”œβ”€β”€ category/ # Blog category pages
β”‚   β”‚   β”‚   β”‚   β”œβ”€β”€ [category]/ # Dynamic category pages
β”‚   β”‚   β”‚   β”‚   β”‚   └── page.tsx # Category page component
β”‚   β”‚   β”‚   └── tag/ # Blog tag pages
β”‚   β”‚   β”‚       β”œβ”€β”€ [tag]/ # Dynamic tag pages
β”‚   β”‚   β”‚       β”‚   └── page.tsx # Tag page component
β”‚   β”‚   β”œβ”€β”€ cart/ # Cart page
β”‚   β”‚   β”‚   └── page.tsx # Cart page component
β”‚   β”‚   β”œβ”€β”€ checkout/ # Checkout pages
β”‚   β”‚   β”‚   β”œβ”€β”€ page.tsx # Checkout page component
β”‚   β”‚   β”‚   └── success/ # Checkout success page
β”‚   β”‚   β”‚       └── page.tsx # Success page component
β”‚   β”‚   β”œβ”€β”€ compare/ # Compare page
β”‚   β”‚   β”‚   └── page.tsx # Compare page component
β”‚   β”‚   β”œβ”€β”€ contact/ # Contact page
β”‚   β”‚   β”‚   └── page.tsx # Contact page component
β”‚   β”‚   β”œβ”€β”€ shop/ # Shop pages
β”‚   β”‚   β”‚   β”œβ”€β”€ [productId]/ # Dynamic product detail pages
β”‚   β”‚   β”‚   β”‚   └── page.tsx # Product detail component
β”‚   β”‚   β”‚   └── page.tsx # Shop page component
β”‚   β”‚   β”œβ”€β”€ wishlist/ # Wishlist page
β”‚   β”‚   β”‚   └── page.tsx # Wishlist page component
β”‚   β”‚   β”œβ”€β”€ layout.tsx # App layout
β”‚   β”‚   β”œβ”€β”€ page.tsx # Main entry point
β”‚   β”‚   └── globals.css # Global styles
β”‚   β”œβ”€β”€ components/ # Reusable components
β”‚   β”‚   β”œβ”€β”€ AdminDashboard.tsx # Admin dashboard component
β”‚   β”‚   β”œβ”€β”€ Auth/ # Authentication components
β”‚   β”‚   β”œβ”€β”€ Blog/ # Blog components
β”‚   β”‚   β”œβ”€β”€ Cart/ # Cart components
β”‚   β”‚   β”œβ”€β”€ Checkout/ # Checkout components
β”‚   β”‚   β”œβ”€β”€ Contact/ # Contact components
β”‚   β”‚   β”œβ”€β”€ Home/ # Home page components
β”‚   β”‚   β”œβ”€β”€ Shop/ # Shop components
β”‚   β”‚   β”œβ”€β”€ common/ # Common components
β”‚   β”‚   └── ... # Other components
β”‚   β”œβ”€β”€ context/ # Context providers
β”‚   β”‚   β”œβ”€β”€ CartContext.tsx # Cart context
β”‚   β”‚   β”œβ”€β”€ WishlistContext.tsx # Wishlist context
β”‚   β”‚   └── CompareContext.tsx # Compare context
β”‚   β”œβ”€β”€ data/ # Static data
β”‚   β”‚   β”œβ”€β”€ blogContent.ts # Blog content data
β”‚   β”‚   └── products.ts # Product data
β”‚   β”œβ”€β”€ types/ # TypeScript types
β”‚   β”‚   β”œβ”€β”€ product.ts # Product types
β”‚   β”‚   β”œβ”€β”€ blog.ts # Blog types
β”‚   β”‚   └── cart.ts # Cart types
β”‚   └── utils/ # Utility functions
β”‚       β”œβ”€β”€ formatPrice.ts # Price formatting functions
β”‚       └── stripe.js # Stripe utility functions
β”œβ”€β”€ public/ # Static assets
β”‚   β”œβ”€β”€ Logo.png # Logo image
β”‚   └── Pictures/ # Additional images
β”œβ”€β”€ tailwind.config.js # Tailwind configuration
β”œβ”€β”€ next.config.mjs # Next.js configuration
β”œβ”€β”€ package.json # Project metadata and dependencies
└── .eslintrc.json # ESLint configuration



πŸ”§ Configuration

Tailwind CSS configuration includes:

  • Custom colors
  • Extended animations
  • Custom plugins
  • Responsive breakpoints

πŸ“± Responsive Design

  • Mobile-first approach
  • Breakpoints:
    • sm: 640px
    • md: 768px
    • lg: 1024px
    • xl: 1280px
    • 2xl: 1536px

⚑ Performance

  • Optimized for fast loading times
  • Uses Next.js for server-side rendering (SSR) and static site generation (SSG)

πŸ“„ License

This project is licensed under the MIT License.


🀝 Contributing

Contributions are welcome! Please feel free to submit a pull request.


πŸ“§ Contact

For any inquiries, please contact us at kusamakhan1234@gmail.com.