https://github.com/codingnaveen46/meesho-webapp-main
https://github.com/codingnaveen46/meesho-webapp-main
Last synced: about 1 year ago
JSON representation
- Host: GitHub
- URL: https://github.com/codingnaveen46/meesho-webapp-main
- Owner: Codingnaveen46
- Created: 2024-06-02T09:02:32.000Z (about 2 years ago)
- Default Branch: main
- Last Pushed: 2024-06-02T09:08:33.000Z (about 2 years ago)
- Last Synced: 2025-02-15T20:57:34.931Z (over 1 year ago)
- Language: JavaScript
- Size: 9.98 MB
- Stars: 0
- Watchers: 1
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Meesho-WebApp
## Overview
This project is a front-end web application inspired by Meesho, built with React.js to provide a seamless and visually appealing shopping experience. The app allows users to browse products, manage their cart, and handle user authentication efficiently. The project integrates modern design principles and robust state management to ensure a smooth and responsive user interface
## Deployment
The application is deployed on vercel and can be accessed at: (https://meesho-web-app.vercel.app)
## Screenshots
### 1]Home Page
### 2] All Product Details
### 3] Login Page
### 4]Register Page
### 5]Add To Cart
## Technologies used
• React.js\
• Redux Toolkit\
• Firebase Authentication\
• Tailwind CSS\
• Axios\
• React Router\
• Vercel (for deployment)
## Features:
1] **Frontend Interface Development**: A visually appealing frontend interface inspired by Meesho, incorporating modern design principles and elements.\
2] **User Authentication and Cart Management**: Features for user login, signup, and cart management, ensuring smooth interaction and data handling.\
3] **Browse Products Without Login/Signup**: Users can browse products without needing login/signup.\
4] **Data Management with Redux Toolkit**: Efficient state management and data flow using Redux Toolkit.\
5] **Authentication Methods**: Utilizes Firebase authentication for secure and reliable user authentication.\
6] **Search Functionality**: Allows users to search for products easily.\
7] **Documentation and Deployment**: Clear instructions for deploying and accessing the application.
## How to Run:
### **Clone the repository:**
```bash
git clone https://github.com/priya1599/Meesho-WebApp
cd Meesho-Webapp
```
### **Install the dependencies:**
```bash
npm install
```
### **Run the development server:**
```bash
npm run dev
```
### **Build for production:**
```bash
npm run build
```
## Documentation and Deployment
### Development Process
Meesho WebApp was developed to provide users with a seamless shopping experience, leveraging modern web development technologies and best practices. The development process involved several key steps:
1. **Planning and Design:** Before diving into coding, a comprehensive plan and design were laid out to determine the app's structure, features, and user interface. Wireframes and mockups were created to visualize the final product.
2. **Setting up the Environment:** The development environment had the necessary tools and libraries. React, Redux Toolkit, Tailwind CSS, and Firebase were chosen as the primary technologies for building the app.
3. **Feature Implementation:** Features such as authentication, cart management, product showcasing, category-wise filtering, and order management were implemented focusing on user experience and functionality.
4. **Testing and Debugging:** Throughout the development process, rigorous testing and debugging were conducted to identify and fix any issues or bugs. Cross-browser and device testing ensured compatibility and responsiveness.
5. **Optimization and Performance:** Performance optimization techniques were employed to enhance the app's speed and efficiency. Code splitting, lazy loading, and image optimization were implemented to minimize loading times and improve overall performance.
6. **Documentation:** Comprehensive documentation was created to guide developers and users through the application's setup, usage, and deployment. This documentation provides clear instructions and explanations for each step, making it easy for developers and users to understand and utilize the app effectively.
## Deployment
(https://meesho-web-app.vercel.app/)