Online Bicycle Store 🚴‍

Table of Contents

1. Introduction
2. Overview
3. Deployed Link
4. Tech Stack
5. Tech Stack Detailed Explanation
6. Features
7. Snapshots
8. Installation
9. Contributors

Introduction

Welcome to our cutting-edge online e-commerce platform catered specifically to cycling enthusiasts, a groundbreaking initiative by Masai School. This project, born out of our construct week endeavor, is tailored to deliver a seamless shopping experience for bike enthusiasts, allowing them to explore and purchase a diverse range of plants from the comfort of their homes. Boasting a user-friendly interface and secure payment methods, our platform prioritizes a smooth and safe shopping journey.

In the realm of technology, we have harnessed the power of React, CSS, and JavaScript for our front-end development, ensuring a visually appealing and dynamic user interface. Additionally, the implementation of JSON Server continues to provide a robust fake REST API, while Firebase not only fortifies user authentication but also facilitates real-time database functionality.

To guarantee secure and hassle-free transactions, we've integrated Razorpay for our payment processing needs. Together, these technologies form the backbone of our cycling-centric e-commerce website, elevating the shopping experience for plant enthusiasts on two wheels.

Overview

Specialized is an immersive online bicycle store meticulously crafted using React, Firebase authentication, Redux state management, and a JSON server to seamlessly manage data. It offers an exhilarating experience for users, enabling them to explore a wide array of bicycles and accessories, manage their cart effortlessly, and swiftly process payments.

Deployed Link

https://phenomenal-crisp-d9f0f8.netlify.app/

Tech Stack

• React
• Redux
• Firebase
• JSON Server
• Css

Tech Stack Detailed Explanation

React:

Redux: State management for React applications.

Firebase Authentication : Used for user login and signup. When a user enters their login credentials or signs up for a new account, Firebase Authentication is used to verify their identity and create their account.

JSON Server: Used as a full fake REST API to fetch product data. When a user visits your site, JavaScript code makes requests to JSON Server to get information about the products.

CSS: Used to style the HTML elements on your webpage. This includes things like colors, fonts, and layouts for the product listings, forms, and other components of your site.

Features

• User Authentication: Secure login and sign up
• Live previews
• Fullscreen mode
• Seamless Payments: Swift and secure payment processing

Snapshots

Login page

The gateway for users, offering secure authentication through Firebase for both sign-in and registration.

Home page

A vibrant showcase presenting a diverse range of bicycles and accessories, featuring personalized recommendations and seasonal deals.

Product page

A comprehensive hub providing detailed information, including descriptions, visuals, specifications, and customer reviews for each product.

Product details page

A comprehensive showcase presenting in-depth information, including descriptions, high-resolution visuals, technical specifications, sizing options, availability, customer reviews, and related products, facilitating confident and informed purchase decisions for each individual item.

Payment page

A secure and smooth transaction interface, integrating multiple payment options for a seamless checkout experience.

Installation

Clone the Repository

  git clone https://github.com/105vivek/Electronic_Store.git

Install Dependencies

bash
  npm install --engine-strict

Start JSON Server

bash
  json-server –watch db.json 

Launch the App

bash
  npm start

Contributors

Contributions are always welcome!

1. Vivek Yadav

   • GitHub: @noobnarayan

2. Anjali Sinha

   • GitHub: @Coders6754
   • LinkedIn: Anjali Sinha

3. Ashwek kalgutkar

   • GitHub: @ashwekkalgutkar

4. Devendra Shakya

   • GitHub: @devender-shakya

5. Akriti Jha

   • GitHub: @JhaAakri