Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/medusajs/nextjs-starter-medusa
A performant frontend ecommerce starter template with Next.js 14 and Medusa.
https://github.com/medusajs/nextjs-starter-medusa
cart composable composable-commerce e-commerce ecommerce hacktoberfest headless javascript medusa medusajs nextjs nodejs react tailwindcss typescript
Last synced: 2 days ago
JSON representation
A performant frontend ecommerce starter template with Next.js 14 and Medusa.
- Host: GitHub
- URL: https://github.com/medusajs/nextjs-starter-medusa
- Owner: medusajs
- License: mit
- Created: 2021-06-25T14:44:03.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2024-10-22T20:19:16.000Z (3 months ago)
- Last Synced: 2024-10-29T15:32:47.877Z (2 months ago)
- Topics: cart, composable, composable-commerce, e-commerce, ecommerce, hacktoberfest, headless, javascript, medusa, medusajs, nextjs, nodejs, react, tailwindcss, typescript
- Language: TypeScript
- Homepage: https://next.medusajs.com/
- Size: 101 MB
- Stars: 1,710
- Watchers: 34
- Forks: 471
- Open Issues: 75
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
- awesome-medusajs - Nextjs starter
- Awesome-NextJs - nextjs-starter-medusa - [website](https://medusajs.com/) (Nextjs Templates)
README
Medusa Next.js Starter Template
Combine Medusa's modules for your commerce backend with the newest Next.js 15 features for a performant storefront.
### Prerequisites
To use the [Next.js Starter Template](https://medusajs.com/nextjs-commerce/), you should have a Medusa server running locally on port 9000.
For a quick setup, run:
```shell
npx create-medusa-app@latest
```
Check out [create-medusa-app docs](https://docs.medusajs.com/create-medusa-app) for more details and troubleshooting.
# Overview
The Medusa Next.js Starter is built with:
- [Next.js](https://nextjs.org/)
- [Tailwind CSS](https://tailwindcss.com/)
- [Typescript](https://www.typescriptlang.org/)
- [Medusa](https://medusajs.com/)
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:
```shell
cd nextjs-starter-medusa/
mv .env.template .env.local
```
### Install dependencies
Use Yarn to install all dependencies.
```shell
yarn
```
### Start developing
You are now ready to start up your project.
```shell
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
- [Stripe](https://stripe.com/)
To enable the integrations you need to add the following to your `.env.local` file:
```shell
NEXT_PUBLIC_STRIPE_KEY=
```
You'll also need to setup the integrations in your Medusa server. See the [Medusa documentation](https://docs.medusajs.com) for more information on how to configure [Stripe](https://docs.medusajs.com/resources/commerce-modules/payment/payment-provider/stripe#main).
# Resources
## Learn more about Medusa
- [Website](https://www.medusajs.com/)
- [GitHub](https://github.com/medusajs)
- [Documentation](https://docs.medusajs.com/)
## Learn more about Next.js
- [Website](https://nextjs.org/)
- [GitHub](https://github.com/vercel/next.js)
- [Documentation](https://nextjs.org/docs)