Git Product home page Git Product logo

souravpl8092 / lenskart_clone Goto Github PK

View Code? Open in Web Editor NEW
10.0 1.0 4.0 20.33 MB

Lenskart.com is an Indian e-commerce company that sells eyeglasses, contact lenses, and sunglasses. Lenskart has a wide variety of products and offers services such as free home trial and virtual try-on.

Home Page: https://glassscart.vercel.app/

HTML 0.60% CSS 0.25% JavaScript 99.16%
chakra-ui javascript reactjs expressjs moongose node-js axios cyclic mongodb bcyrpt

lenskart_clone's Introduction

✨✨Welcome to Lenskart_Clone✨✨

💻Project Unique Name : Glasscart ✈️


Lenskart.com is an Indian e-commerce company that sells eyeglasses, contact lenses, and sunglasses. The company was founded in 2010 by Peyush Bansal, Amit Chaudhary, and Sumeet Kapahi, and is based in Delhi. Lenskart has a wide variety of products and offers services such as free home trial and virtual try-on. The company has also has physical stores across India.


Frontend Deployed URL 👉 Click here

Backend API 👉 Click here


🖥️ Tech Stack

Frontend

html5 css3 javascript reactjs chakra-ui redux react-router

Backend

nodejs expressjs jwt mongodb

Tools

git github npm vscode postman

Deployed On:

vercel cyclic


Features

  • Account creation, login, signup and logout functionality.
  • Sign-up and log-in validations.
  • JWT (JSON Web Token) Authentication and BcryptJS Password Hashing
  • Product Filters Based on Gender, Colour, Shape, Glasses Frame
  • Product Sorting Based on Price
  • Product Filtering and Sorting work together
  • Products Pagination (Default 12 Products Per Page)
  • Cart Add and Remove Items
  • Cart Update Quantities
  • Wishlist Add/Remove Items
  • Order Summary
  • My Orders Section for details of all ordered item
  • From Wishlist to directly Add-to-Cart feature
  • Coupons are provided for the discount
  • Payment Gateway
  • User Authentication before placing an order
  • Data fetching from Backend
  • Responsive for all screen sizes

Let's Dive into What we have made

Home Page :

Go through the home page to know more about our website.


Home page

Navbar :

Navbar Navbar

Signup Page :

For signup, user need to fill required details. If user is already exists then it will show you an error. So you can't register again with the same email.


signup page

Login Page :

Users can login using their input credentials which provided while signup.


signin page

Product Page :

Here users can Purchase their eyewear glasses .


Product page 1

Singal Product Page :

Here users can see details information regarding of particular eyewear glass .


Product page 2

Cart Page :

Here users can see their added Product in the Cart .


 cart

Shipping Page :

Here users can enter their shipping details .


Shipping page

Checkout Page :

Here users can checkout their Purchase .


Flight checkout page

Payments Page :

Here users can make the payment .


Payment page

Confirmation Page :

Here after payment users get confirmation for their purchase.


Confirmation page

Order History Page :

Here users can see all of their purchases.


Order History page

Wishlist Page :

Here users can see their product which are added in Wishlist.


Wishlist page


Admin Section

Admin Section is responsible for maintaining and updating the data of the website .


Product-list Product-register
Product-edit

Footer :

Footer


Languages Used :

      ◉ JavaScript : 99.2%
      ◉ Others : 0.8%

This report is provided by the Github language used stats. So, this is the total percentage of the coding languages.



Prerequisites :

  • Node.js
  • npm

Installing :

  1. Clone the repository to your local machine
  2. Navigate to the project directory
  3. Run npm install to install the required dependencies
  4. Run npm start to start the development server



Our Team :

This is a collaborative project built by a team of 5 fullstack web developers and executed in 5 days.



Team Work Efforts :

First of all, we created a Slack and zoom group to establish communication between all the team members. Then we connected over zoom meet for further discussion about assigned project.

In a zoom meet we divideed small parts of project to all the team-member.

We discussed about past days work and present day work, if any one face issue all the team member helps to solve the problem.

All push the data in Git-hub to their respective branch and merge them to main branch.

Finally we make the presentation of the project.

Our Learnings :

On this journey we faced many issues, but we keep motivated each other with patience.

  • We all learned how to read and understand the code of other team members.

  • We learned how to write more efficient and clean code.

  • Even though We also learned how to plan a project and how to execute it step by step.

  • By this Project we have learned how to collaborate and communicate with team effectively and improving the productivity.

  • We also got a glimpse of using GitHub for the version control.

Contributing

We welcome contributions to the Lenskart Clone website. If you have an idea for a new feature or have found a bug, please open an issue in the repository.


Show your support

Give a ⭐️ if you like this project!

✨Thank You✨

lenskart_clone's People

Contributors

devendra0192 avatar govind-kumarr avatar raveenakale475 avatar souravpl8092 avatar tirthorajbadhei avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar

lenskart_clone's Issues

items

  • cart items count
  • fetch

coupon box

  • coupon
  • offers
  • arrow to avail coupon
  • css

Day-5

  • Helping the team members to complete the tasks
  • Debugging
  • Adding chat box to the homepage (if time permits)

cart box

  • image
  • title
  • price
  • remove button
  • repeat button
  • iterate single box

Day-2

  • Designing the basic structure of payment gateway
  • Giving a unique look to this

option box

  • login option
  • arrow button
  • redirect to page
  • functionality

buffer

  • check all functionality
  • check css
  • alignment
  • check all responsiveness

Day-3

  • Adding all the functionalities to the payment gateway
  • Dry run

bill box

  • price
  • discount
  • total
  • tax
  • fees
  • total payment
  • all functionality

Day-4

  • Giving the final touchup to all the sections of the page

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.