Next 13, React, Sanity, Stripe, & TailwindCSS
-This full-stack e-commerce app is built with Next 13, features a modern and responsive user interface.
-Powerful shopping cart: Customers can add, update, and remove items from their cart and view the total cost, including shipping.
-Ability to sort products by different criteria: Customers can sort products by price, date, popularity, or other criteria.
-Advanced filter component: Customers can filter products by category, size, color, and other criteria.
-Full-text search: Customers can search for products by keyword.
-Custom Stripe checkout page: Customers can pay for their purchases quickly and easily on a secure checkout page.
👉 Follow these steps to set up the project locally on your machine.
Cloning the Repository
git clone https://github.com/your-username/your-project.git
cd your-project
Installation
Install the project dependencies using npm:
npm install
Set Up Environment Variables
Create a new file named .env
in the root of your project and add the following content:
NEXT_PUBLIC_SANITY_PROJECT_ID=
NEXT_PUBLIC_SANITY_DATASET=
NEXT_PUBLIC_STRIPE_PUBLIC_KEY=
STRIPE_SECRET_KEY=
Shipping address
Address Line 1:
123 fake street
United States
123 Fake Street
Address line 2:
City: Oak Lawn
Zip: 60453
State: Illinois
Payment details
Card information
4242 4242 4242 4242
Visa
MM/YY 04 / 24
CVC 242