- Overview
- Features
- Getting Started
- Usage
- Sorting Options
- Pages
- Theme Options
- Payment
- Technologies Used
- Contact
Infinite Shops is a feature-rich e-commerce website built using Next.js and Tailwind CSS, featuring a seamless shopping experience with the power of Flutterwave as the payment gateway. Our primary goal is to provide a highly performant, user-friendly, and secure platform for users to browse, purchase, and manage products.
Visit the site: Infinite Shops
- Server-Side Rendering (SSR): Utilizes Next.js to provide a fast and responsive user experience.
- User Authentication: Includes Sign In and Sign Out functionality for personalized experiences.
- Shopping Cart: Allows users to add and manage items in their shopping cart.
- Transaction History: Tracks and displays users' transaction history.
- Product Listings: Displays a wide range of products with details and prices.
- Product Details: Allows users to view detailed information about individual products.
- Payment Gateway: Utilizes Flutterwave for secure online payments.
- Product Sorting: Users can sort products based on:
- Time created
- Price from low to high
- Price from high to low
To set up and run this project locally, follow these steps:
-
Clone this repository:
git clone https://github.com/sammy-jeff/Infinite-shops.git
-
Change to the project directory:
cd infinite-shops-2 -
Install the required dependencies:
npm install
-
Create a .env.local file and store all your sensitive keys there.
-
Start the developement server:
npm run dev
-
Open your web browser and access the site locally at http://localhost:3000 (or your specified port).
Infinite Shops provides an intuitive and user-friendly interface. Here's how to use it:
Home Page: Browse a wide range of products.
Sign In and Sign Out: Manage your account and track transactions.
Cart: Add, remove, and manage items in your shopping cart.
Transaction: View your transaction history.
Products: Explore detailed product listings.
Individual Product: View in-depth information about a specific product.
Infinite Shops offers the following product sorting options:
Time Created: Sort products based on the time they were added to the platform.
Price from Low to High: Arrange products in ascending order of price.
Price from High to Low: Arrange products in descending order of price.
Home: The landing page featuring a wide range of products.
Sign In: Log in or create an account.
Sign Up: Create a new account.
Cart: View and manage the contents of your shopping cart, in addition, next.js latest advanced routing option (parallel and intercepting routing) was added to this page to enhance user experience.
Transaction: Track your transaction history.
Products: Explore detailed product listings.
Individual Product: View information about a specific product.
Infinite Shops offers both Light Mode and Dark Mode themes to enhance the user experience. Users can select their preferred theme for comfortable browsing, day or night.
Use these cards if you want the payment to succeed.
Card1:
Type : Mastercard
Card Number: 5531886652142950
CVV: 564
PIN: 3310
Expiry: 09/32
OTP: 12345
Card2:
Type : Visa card
Card Number: 4187427415564246
CVV: 828
PIN: 3310
Expiry: 09/32
OTP: 12345
Next.js
Tailwind CSS
Flutterwave (Payment Gateway)
Zustand (State Management)
Supabase (Backend and Authentication)
Sanity.io (Content Management)
If you have any questions, suggestions, or need assistance, feel free to reach me at okoyechibuike048@gmail.com or okoyechibuike048@yahoo.com.
© 2023 Infinite Shops All rights reserved.