Awesome
<p align="center"> <a href="https://www.medusajs.com"> <picture> <source media="(prefers-color-scheme: dark)" srcset="https://user-images.githubusercontent.com/59018053/229103275-b5e482bb-4601-46e6-8142-244f531cebdb.svg"> <source media="(prefers-color-scheme: light)" srcset="https://user-images.githubusercontent.com/59018053/229103726-e5b529a3-9b3f-4970-8a1f-c6af37f087bf.svg"> <img alt="Medusa logo" src="https://user-images.githubusercontent.com/59018053/229103726-e5b529a3-9b3f-4970-8a1f-c6af37f087bf.svg"> </picture> </a> </p> <h1 align="center"> Medusa Next.js Starter Template </h1> <p align="center"> Combine Medusa's modules for your commerce backend with the newest Next.js 15 features for a performant storefront.</p> <p align="center"> <a href="https://github.com/medusajs/medusa/blob/master/CONTRIBUTING.md"> <img src="https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat" alt="PRs welcome!" /> </a> <a href="https://discord.gg/xpCwq3Kfn8"> <img src="https://img.shields.io/badge/chat-on%20discord-7289DA.svg" alt="Discord Chat" /> </a> <a href="https://twitter.com/intent/follow?screen_name=medusajs"> <img src="https://img.shields.io/twitter/follow/medusajs.svg?label=Follow%20@medusajs" alt="Follow @medusajs" /> </a> </p>Prerequisites
To use the Next.js Starter Template, you should have a Medusa server running locally on port 9000. For a quick setup, run:
npx create-medusa-app@latest
Check out create-medusa-app docs for more details and troubleshooting.
Overview
The Medusa Next.js Starter is built with:
Features include:
- Full ecommerce support:
- Product Detail Page
- Product Overview Page
- Product Collections
- Cart
- Checkout with Stripe
- User Accounts
- Order Details
- Full Next.js 15 support:
- App Router
- Next fetching/caching
- Server Components
- Server Actions
- Streaming
- Static Pre-Rendering
Quickstart
Setting up the environment variables
Navigate into your projects directory and get your environment variables ready:
cd nextjs-starter-medusa/
mv .env.template .env.local
Install dependencies
Use Yarn to install all dependencies.
yarn
Start developing
You are now ready to start up your project.
yarn dev
Open the code and start customizing
Your site is now running at http://localhost:8000!
Payment integrations
By default this starter supports the following payment integrations
To enable the integrations you need to add the following to your .env.local file:
NEXT_PUBLIC_STRIPE_KEY=<your-stripe-public-key>
You'll also need to setup the integrations in your Medusa server. See the Medusa documentation for more information on how to configure Stripe.