Game Vault

Project Overview

"This repository contains the source code for a sports item e-commerce website. The platform allows users to browse and purchase various sports equipment and accessories. The website features a user-friendly interface, efficient product management, and a secure checkout process, providing an excellent shopping experience for sports enthusiasts."

Features

• React 18: Highly performant and flexible UI components.
• Material Tailwind: Stylish and customizable UI elements.
• Firebase: Backend integration for authentication and data storage.
• Lottie Animations: Enhanced user experience with animations.
• Routing: Seamless navigation using React Router DOM.
• SweetAlert2: Beautiful and customizable alert pop-ups.
• Swiper: Interactive sliders and carousels.

Technologies Used

Category	Libraries/Tools
Frontend	React, React DOM, React Router DOM
UI Library	Material Tailwind, DaisyUI
Animations	Lottie React, Swiper, React Awesome Reveal
Backend	Firebase
Styling	Tailwind CSS, PostCSS, Autoprefixer
Utilities	Dotenv
Build Tool	Vite
Linting	ESLint

Getting Started

Prerequisites

Ensure you have the following installed:

• Node.js (>= 14.x)
• npm (comes with Node.js)

Installation

1. Clone the repository:

   git clone https://github.com/forhad1518/assignemt-a10.git
   cd assignment-10-client

2. Install dependencies:

   npm install

Environment Variables

Create a .env file in the root directory and add the necessary environment variables:

REACT_APP_API_KEY=your_api_key_here
REACT_APP_AUTH_DOMAIN=your_auth_domain_here

Running the Application

Start the development server:

npm run dev

Build for Production

npm run build

Preview the Production Build

npm run preview

Linting

npm run lint

Project Structure

assignment-10-client
├── public
├── src
│   ├── components
│   ├── pages
│   ├── services
│   └── App.jsx
└── package.json

Scripts

Command	Description
npm run dev	Start development server
npm run build	Build for production
npm run preview	Preview the production build
npm run lint	Run ESLint to check code quality

Dependencies

Production

• @emotion/react: ^11.13.5
• @material-tailwind/react: ^2.1.10
• dotenv: ^16.4.6
• firebase: ^11.0.2
• lottie-react: ^2.4.0
• react: ^18.3.1
• react-awesome-reveal: ^4.2.14
• react-dom: ^18.3.1
• react-fast-marquee: ^1.6.5
• sweetalert2: ^11.14.5
• swiper: ^11.1.15

Development

• @eslint/js: ^9.15.0
• @types/react: ^18.3.12
• @types/react-dom: ^18.3.1
• @vitejs/plugin-react: ^4.3.4
• autoprefixer: ^10.4.20
• daisyui: ^4.12.14
• eslint: ^9.15.0
• eslint-plugin-react: ^7.37.2
• eslint-plugin-react-hooks: ^5.0.0
• eslint-plugin-react-refresh: ^0.4.14
• globals: ^15.12.0
• postcss: ^8.4.49
• react-router-dom: ^7.0.2
• tailwindcss: ^3.4.15
• vite: ^6.0.1

Contribution

Feel free to open issues or submit pull requests for any improvements.

License

This project is licensed under the MIT License.

---

This README will help you maintain and showcase your project effectively. Happy coding, Forhad!