E-Commerce Site Demo Using Next.Js & TailwindCSS

This is an eCommerce site built with Next.js and Tailwind CSS. It provides a platform for users to browse and purchase products online. The site offers various features including a product menu, filtering options, search functionality, sorting, cart management, favorite collections, and secure checkout with Razorpay payment integration. 👉👉👉Link Live👈👈👈

Getting Started

To run the project locally, follow these steps:

Clone the repository: git clone https://github.com/SomnathBhunia-dev/E-Commerce_Site-By-Next.JS.git Install dependencies: npm install Start the development server: npm run dev Open your browser and visit http://localhost:3000 to view the site. Feel free to customize the instructions based on your project's setup and any additional steps required.

Features

Product Menu: Browse a wide range of products categorized by brand, category, and price.

Filtering: Narrow down the product list based on brand selection, category, and price range.

Search: Easily search for products by their name or keywords.

Sorting: Sort products alphabetically or by price, both ascending and descending.

Cart Management:** Add products to the cart, view cart details, and proceed to checkout.

Favorite Collections: Create and manage favorite collections to save products for future reference.

Secure Checkout: Seamless integration with Razorpay for secure payment processing.

Single Product View: View detailed information about a specific product.

My Order View: You can retry your Cart Data which stored in Your Local Storage

Challenges Faced

During the development of this eCommerce site, I encountered a few challenges:

Data Management: Implementing a smooth data flow for product management, cart management, and favorite collections.

Filtering and Sorting: Implementing efficient filtering and sorting functionality to provide a seamless user experience.

Payment Integration: Integrating Razorpay for secure and reliable payment processing.

Responsive Design: Ensuring the site is responsive and works well on various devices and screen sizes.

Technology Used

Next.js: A React framework for server-rendered React applications.

Tailwind CSS: A utility-first CSS framework for building modern and responsive user interfaces.

Razorpay: A popular payment gateway for seamless and secure online transactions.

Product Api: Product List and Product Data Provider For free

Useful resources

ChatGpt : I use ChatGpt for optimize my code in various way, its help me a lot in not doing code repeat...

Authors

Somnath

🔗 Links

Screenshots