Skip to content

FizzyStore is a modern e-commerce web application built with React.js, utilizing Redux and Redux Thunk for state management, React Router for seamless navigation, and styled with Tailwind CSS. It features secure authentication, a dynamic product catalog, and shopping cart functionality, all integrated with a RESTful API via Axios.

Notifications You must be signed in to change notification settings

baharkyc/ecommerce-website-frontend

Repository files navigation

FizzyStore E-Commerce Website

FizzyStore is a modern e-commerce platform designed to provide users with a seamless shopping experience. The website features a clean and responsive design, intuitive navigation, and robust functionality to cater to both customers and administrators.


Features

  • Product Catalog: Browse a wide range of products with detailed descriptions, pricing, and images.
  • User Authentication: Secure login and signup functionality for customers.
  • Shopping Cart: Add products to the cart and proceed to checkout.
  • Product Filtering: Filter products by categories, price, and other attributes.
  • Responsive Design: Fully optimized for desktop, tablet, and mobile devices.
  • Multi-Page Navigation: Includes pages for Home, Shop, Product Details, About, Contact, Team, and more.
  • Admin Features: Role-based access for managing products, categories, and users.
  • Localization: Support for multiple languages and themes.

Technologies Used

  • Frontend:

    • React.js: Component-based architecture for building the user interface.
    • React Router: For seamless navigation between pages.
    • Tailwind CSS: Utility-first CSS framework for styling.
    • React Hook Form: For managing form validation and submission.
  • State Management:

    • Redux: Centralized state management for the application.
    • Redux Thunk: Middleware for handling asynchronous actions.
  • Backend Integration:

    • Axios: For making API requests to the backend.
    • RESTful API: Integration with a backend API for fetching and managing data.
  • Other Libraries:

    • React Toastify: For displaying notifications and alerts.
    • Lucide React: Icon library for modern and customizable icons.

API Integration

  • The website communicates with a RESTful API hosted at:

https://workintech-fe-ecommerce.onrender.com

Key Endpoints:

  • Authentication:

    • /login: User login.
    • /signup: User registration.
    • /verify: Token verification.
  • Products:

    • /products: Fetch product list.
    • /categories: Fetch product categories.
  • Roles:

    • /roles: Fetch user roles for role-based access.

Pages Overview

  • Home Page: Highlights featured products, categories, and promotional banners.
  • Shop Page: Displays all products with filtering and sorting options.
  • Product Detail Page: Detailed view of a single product, including images, reviews, and related products.
  • About Page: Information about the company and its mission.
  • Contact Page: Contact form and company contact details.
  • Team Page: Meet the team behind FizzyStore.
  • Login/Signup Pages: User authentication and account creation.

Design Philosophy

FizzyStore is built with a focus on:

  • User Experience: Ensuring a smooth and intuitive shopping journey.
  • Performance: Optimized for fast loading times and responsiveness.
  • Scalability: Modular architecture for easy feature expansion.

Future Enhancements

  • Wishlist: Allow users to save products for later.
  • Order Tracking: Enable users to track their orders.
  • Payment Integration: Add secure payment gateways for checkout.
  • Admin Dashboard: Advanced tools for managing products, orders, and users.

FizzyStore is a comprehensive e-commerce solution designed to meet the needs of modern online shoppers while providing a robust platform for administrators to manage their store efficiently.

About

FizzyStore is a modern e-commerce web application built with React.js, utilizing Redux and Redux Thunk for state management, React Router for seamless navigation, and styled with Tailwind CSS. It features secure authentication, a dynamic product catalog, and shopping cart functionality, all integrated with a RESTful API via Axios.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages