An open API service indexing awesome lists of open source software.

https://github.com/bd-arfat/panjabi-client


https://github.com/bd-arfat/panjabi-client

axios-react emotion firebase jwt-token react-dom-router react-helmet-async react-icons react-slick reacticons reactjs reactstripe slick-carousel switealeart tailwindcss

Last synced: about 1 month ago
JSON representation

Awesome Lists containing this project

README

          

# 🌈 Rainbow Collection

A festive full-stack **e-commerce website** designed to help users shop for **clothing, accessories, and gifts during Eid**. Built with modern technologies and a focus on clean UI, responsive design, and seamless shopping experience.

---

## 🚀 Live Site

🌐 **Live Demo**: [Click here to visit](https://panjabi-server.web.app/)
📁 **Frontend Repository**: [GitHub Link](https://github.com/BD-Arfat/panjabi-client)
📁 **Backend Repository**: [GitHub Link](https://github.com/BD-Arfat/panjabi-server)

---

## 📖 Project Description

**Rainbow Collection** is a full-featured e-commerce platform built to celebrate the festive joy of Eid. It allows users to explore categories, purchase products, leave reviews, and manage orders. Admins can manage users, products, and payments through a dedicated dashboard.

---

## 🔧 Features

- ✅ Full-stack responsive web application
- 🛍️ Product listing by category on the home & product pages
- ✍️ Users can purchase and review products
- 👤 User Dashboard:
- View ordered products
- Profile management
- Secure logout
- 💳 Integrated Stripe payment system
- 🔒 Authentication via Firebase
- 🛠️ Admin Dashboard:
- Manage users and promote them to admin
- Add, edit, or delete products
- Monitor all orders and payments

---

## 🛠️ Tech Stack

### 🚧 Frontend:
- **React** – UI library
- **React DOM** – DOM rendering
- **React Router DOM** – Routing
- **React Icons** / **Lucide React** – Icon support
- **React Slick** – Carousel/slider
- **SweetAlert2** – Alert modals
- **React Helmet / Helmet Async** – SEO & Head management

### 🎨 Styling:
- **Tailwind CSS** – Utility-first CSS framework
- **Emotion (styled & react)** – CSS-in-JS styling

### 🔥 Backend & Authentication:
- **Firebase** – Authentication, Hosting
- **JWT (jsonwebtoken)** – Token-based authentication

### 📦 API & State Management:
- **Axios** – API client
- **React Query (@tanstack/react-query)** – API data fetching and caching

### 💳 Payment Integration:
- **Stripe JS / React Stripe JS** – Secure payment integration

### 🧰 Tooling & Development:
- **Vite** – Fast dev server & build tool
- **ESLint** – Code linting
- **PostCSS + Autoprefixer** – CSS processing
- **TypeScript (types for React)** – Development type safety

---

## 📂 Project Structure Overview

---

## 🖼️ Screenshots (Optional)

> Add screenshots here to showcase UI/UX

---

## 🙋‍♂️ Author

Made with ❤️ by **Ariful Islam Arfat**

- 🔗 GitHub: [@BD-Arfat](https://github.com/BD-Arfat)
- 🔗 LinkedIn: [yourprofile](https://www.linkedin.com/in/ariful-islam-b4a405274/)

---

## 📄 License

This project is open-source and available under the [MIT License](LICENSE).

---