Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/iamnaveen8851/boat-life-style-clone

This is my first ever React Project using Vite tool, cloning the BoAt Lifestyle, I have crafted an online electronic products shopping app named Boat Lifestyle, allowing users to browse and purchase items.
https://github.com/iamnaveen8851/boat-life-style-clone

chakraui localstorage react react-router-dom react-slideshow-image

Last synced: 16 days ago
JSON representation

This is my first ever React Project using Vite tool, cloning the BoAt Lifestyle, I have crafted an online electronic products shopping app named Boat Lifestyle, allowing users to browse and purchase items.

Awesome Lists containing this project

README

        

# BoAt Lifestyle Clone

This is a clone of `BoAt Lifestyle website` which i created for my `Construct Week Project`.

## Features
### Login button on navbar
- I've added a `login` feature based on the user mobile number which will accept only `10 digit` numbers to `verify` in the navbar .

### Add to cart Button right next to the login button
- Add to `cart` feature is added while listing all product and also the `cart button` is added on the top right in the `navbar`

- if any user click on the particular product to add in the cart it will open the cart drawer and display the product details with `remove` button and `Confirm order button` to buy the product.

- if user wants to remove any of the single product from the cart page he'll be able to delete from cart.

### Auto SlideShow Feature onto the UI
- I've added `Auto Slide-Show Effect` as well to display the trending products onto the UI

### Listed All Products from the Mock Server
- I created my own `mock-server` to store data.

- run my mock-server and made network request to get the data and store it in the State Variable.

- listed all the products on to the UI
- with product name.
- with product image.
- with product price.
- with product rating
- with Add to cart Button.

### Navbar
- it has some `Links` to navigate the user to other pages.

- A `BoAt` logo that will redirect to the home page.

- It has search bar

- It has `Login icon-button` from there user can login

- It also has Cart-icon-button to have look on to the add products on the cart page.

### Footer
- In the footer, there is another `signup` `Feature` where user can register with `Email Id`.

- there are lists of all products details.

- At last there is a short description.

# Tech Stack
### -> React

## Tools
### Vite
### Chakra-UI Library
### React-Router-Dom Library
### React-Slide-Show-Image Library
### Axios Library

### Local Storage

### Deadline
### -> 5-Days