Convert Figma logo to code with AI

blefnk logorelivator-nextjs-template

🏬 relivator: next.js 15 react 19 ecommerce template ▲ better-auth polar shadcn/ui tailwind drizzle orm typescript ts radix, postgres neon, app router saas commerce ecommerce shop pricing payments dark mode full stack free ⭐ more stars 👉 more features

1,355
246
1,355
3

Top Related Projects

13,314

Next.js Commerce

30,176

The world's most flexible commerce platform.

21,730

Saleor Core: the high performance, composable, headless commerce API.

14,771

An open source eCommerce platform giving you full control and customizability. Modular and API-first. Multi-vendor, multi-tenant, multi-store, multi-currency, multi-language. Built using Ruby on Rails. Developed by @vendo-dev

5,184

🛒 Solidus, the open-source eCommerce framework for industry trailblazers.

Quick Overview

Relivator is a modern, full-stack e-commerce starter kit built with Next.js 13, React, and TypeScript. It provides a robust foundation for building scalable online stores with features like server-side rendering, API routes, and a modular architecture.

Pros

  • Utilizes the latest Next.js 13 features for improved performance and developer experience
  • Includes a comprehensive set of e-commerce functionalities out of the box
  • Highly customizable and extensible architecture
  • Strong focus on TypeScript for improved type safety and code quality

Cons

  • Steep learning curve for developers new to Next.js or React
  • May be overkill for simple e-commerce projects
  • Requires understanding of server-side rendering concepts
  • Documentation could be more extensive for some advanced features

Code Examples

  1. Creating a new product:
import { createProduct } from '@/lib/api/products';

const newProduct = await createProduct({
  name: 'Example Product',
  description: 'This is a sample product',
  price: 19.99,
  category: 'electronics',
});
  1. Fetching products with pagination:
import { getProducts } from '@/lib/api/products';

const { products, totalPages } = await getProducts({
  page: 1,
  limit: 10,
  category: 'clothing',
});
  1. Processing an order:
import { processOrder } from '@/lib/api/orders';

const order = await processOrder({
  userId: 'user123',
  items: [{ productId: 'prod456', quantity: 2 }],
  shippingAddress: {
    street: '123 Main St',
    city: 'Anytown',
    country: 'USA',
  },
});

Getting Started

  1. Clone the repository:

    git clone https://github.com/blefnk/relivator.git
    cd relivator
    
  2. Install dependencies:

    npm install
    
  3. Set up environment variables:

    cp .env.example .env.local
    

    Edit .env.local with your configuration.

  4. Run the development server:

    npm run dev
    
  5. Open http://localhost:3000 in your browser to see the application running.

Competitor Comparisons

13,314

Next.js Commerce

Pros of Commerce

  • More established project with a larger community and contributor base
  • Comprehensive e-commerce features out-of-the-box
  • Extensive documentation and examples

Cons of Commerce

  • Less flexible for customization beyond e-commerce use cases
  • Heavier codebase with more dependencies
  • Steeper learning curve for developers new to the stack

Code Comparison

Commerce:

export const HIDDEN_PRODUCT_TAG = 'hidden'
export const DEFAULT_OPTION = 'Default Title'
export const SHOPIFY_CHECKOUT_URL_COOKIE = 'shopify_checkoutUrl'
export const SHOPIFY_COOKIE_EXPIRE = 90

Relivator:

export const siteConfig = {
  name: 'Relivator',
  description: 'An open-source e-commerce store built with Next.js 13',
  url: 'https://relivator.bleverse.com',
  ogImage: 'https://relivator.bleverse.com/og.jpg',
  links: {
    twitter: 'https://twitter.com/blefnk',
    github: 'https://github.com/blefnk/relivator',
  },
}

Summary

Commerce is a more mature e-commerce solution with robust features, while Relivator offers a lighter, more customizable foundation for building web applications. Commerce may be better suited for larger e-commerce projects, whereas Relivator could be preferable for developers seeking a flexible starting point for various web applications, including but not limited to e-commerce.

30,176

The world's most flexible commerce platform.

Pros of Medusa

  • More mature and established project with a larger community and ecosystem
  • Comprehensive e-commerce functionality out-of-the-box, including order management and inventory tracking
  • Extensive documentation and guides for developers

Cons of Medusa

  • Steeper learning curve due to its more complex architecture
  • Less flexibility for non-e-commerce use cases compared to Relivator's general-purpose approach
  • Heavier codebase which may impact performance for simpler projects

Code Comparison

Medusa (JavaScript):

const product = await productService.create({
  title: "Medusa Coffee Mug",
  handle: "medusa-coffee-mug",
  is_giftcard: false,
  discountable: true
});

Relivator (TypeScript):

const product = await db.product.create({
  data: {
    name: "Relivator Coffee Mug",
    slug: "relivator-coffee-mug",
    price: 1999,
    description: "A stylish mug for developers"
  }
});

Both repositories offer e-commerce solutions, but Medusa provides a more comprehensive out-of-the-box experience for traditional e-commerce needs. Relivator, being built on Next.js, offers more flexibility for general web applications with e-commerce capabilities. The code examples show that Medusa has more built-in e-commerce specific fields, while Relivator's approach is more generic and adaptable.

21,730

Saleor Core: the high performance, composable, headless commerce API.

Pros of Saleor

  • More mature and established project with a larger community and ecosystem
  • Comprehensive e-commerce features out-of-the-box, including inventory management and payment processing
  • Well-documented API and GraphQL support for easy integration

Cons of Saleor

  • Steeper learning curve due to its extensive feature set
  • Potentially overkill for smaller projects or simple online stores
  • Less flexibility for customization compared to Relivator's modular approach

Code Comparison

Saleor (Python):

from django.db import models
from django.utils.translation import gettext_lazy as _

class Product(models.Model):
    name = models.CharField(max_length=250)
    price = models.DecimalField(max_digits=10, decimal_places=2)

Relivator (TypeScript):

import { z } from "zod";

export const productSchema = z.object({
  name: z.string().min(1).max(250),
  price: z.number().positive().multipleOf(0.01),
});

Saleor uses Django's ORM for database models, while Relivator employs Zod for runtime type checking and validation. Saleor's approach is more traditional and database-centric, whereas Relivator focuses on type safety and validation at the application level.

14,771

An open source eCommerce platform giving you full control and customizability. Modular and API-first. Multi-vendor, multi-tenant, multi-store, multi-currency, multi-language. Built using Ruby on Rails. Developed by @vendo-dev

Pros of Spree

  • Mature and well-established e-commerce platform with a large community
  • Extensive documentation and resources available
  • Highly customizable with numerous extensions and plugins

Cons of Spree

  • Steeper learning curve due to its complexity and extensive features
  • Potentially slower development process for simple e-commerce sites
  • Requires more server resources compared to lightweight alternatives

Code Comparison

Spree (Ruby on Rails):

Spree::Config.configure do |config|
  config.allow_guest_checkout = false
  config.currency = "USD"
  config.mails_from = "store@example.com"
end

Relivator (Next.js):

export const siteConfig = {
  name: "Relivator",
  description: "Next.js 13 e-commerce template",
  currency: "USD",
  allowGuestCheckout: false,
};

Key Differences

  • Spree is built on Ruby on Rails, while Relivator uses Next.js and TypeScript
  • Spree offers a more comprehensive set of features out-of-the-box
  • Relivator focuses on modern web technologies and a simpler setup process
  • Spree has a larger ecosystem of plugins and extensions
  • Relivator may be more suitable for developers familiar with React and JavaScript
5,184

🛒 Solidus, the open-source eCommerce framework for industry trailblazers.

Pros of Solidus

  • Mature and well-established e-commerce platform with a large community
  • Extensive documentation and resources for developers
  • Robust feature set for complex e-commerce needs

Cons of Solidus

  • Steeper learning curve due to its complexity
  • Potentially slower development process for simple projects
  • Ruby-based, which may not be preferred by all developers

Code Comparison

Solidus (Ruby):

Spree::Config.configure do |config|
  config.allow_checkout_on_gateway_error = true
  config.check_for_spree_alerts = false
  config.track_inventory_levels = false
end

Relivator (TypeScript):

export const siteConfig = {
  name: 'Relivator',
  description: 'An e-commerce starter built with Next.js 13',
  url: 'https://relivator.bleverse.com',
  ogImage: 'https://relivator.bleverse.com/og.jpg',
  links: {
    twitter: 'https://twitter.com/blefnk',
    github: 'https://github.com/blefnk/relivator',
  },
};

While Solidus offers a more comprehensive e-commerce solution with extensive configuration options, Relivator provides a modern, Next.js-based starter kit for simpler e-commerce projects. Solidus is better suited for large-scale, complex e-commerce applications, while Relivator may be more appropriate for developers looking for a lightweight, React-based solution.

Convert Figma logo designs to code with AI

Visual Copilot

Introducing Visual Copilot: A new AI model to turn Figma designs to high quality code using your components.

Try Visual Copilot

README

🏬 relivator • next.js ecommerce starter

demo — sponsor — discord — github — docs

relivator is a robust ecommerce template built with next.js and other modern technologies. it's designed for developers who want a fast, modern, and scalable foundation without reinventing the backend.

stack

  1. 🧱 core: nextjs 15.3 + react 19.1 + ts 5.8
  2. 🎨 ui: tailwind 4.1 + shadcn/ui
  3. 🔒 auth: better-auth
  4. 🎬 anims: animejs
  5. 📦 storage: uploadthing
  6. 📊 analytics: vercel
  7. 🧬 db: drizzle-orm (pg) + neon/(🤔🔜)supabase
  8. 🏗️ dx: eslint + biome + knip
  9. 📝 forms: react-form (🔜 w.i.p) + arktype
  10. 📅 tables: react-table
  11. 🌐 i18n: next-intl (🔜 w.i.p)
  12. 💌 email: resend (🔜 w.i.p)
  13. 💳 payments: polar
  14. 🔑 api: orpc (🔜 w.i.p)

these features define the main reliverse stack. for an alternative setup—featuring clerk, stripe, trpc, and more—check out versator.

quick start

  1. install git, node.js, bun.

  2. run:

    git clone https://github.com/blefnk/relivator.git
    cd relivator
    bun install
    copy .env.example .env
    
  3. fill in the required environment variables in the .env file.

  4. optionally, edit the src/app.ts file to make the app yours.

  5. run:

    bun db:push # populate db with schema
    bun dev # start development server
    bun run build # build production version
    
  6. edit something in the code manually or ask ai to help you.

  7. done. seriously. you're building now.

commands

commanddescription
bun devstart local development
bun buildcreate a production build
bun latestinstall latest deps
bun uiadd shadcn components
bun db:pushapply db schema changes
bun db:authupdate auth-related tables
bun db:studioopen visual db editor

polar integration

relivator now integrates with polar for payment processing and subscription management.

features

  • checkout flow for subscription purchases
  • customer portal for managing subscriptions
  • webhook handling for subscription events
  • automatic customer creation on signup
  • integration with better-auth for seamless authentication

setup instructions

  1. create an account on polar
  2. create an organization and get an organization access token
  3. configure your environment variables in .env:
    POLAR_ACCESS_TOKEN="your_access_token"
    POLAR_WEBHOOK_SECRET="your_webhook_secret"
    POLAR_ENVIRONMENT="production" # or "sandbox" for testing
    
  4. create products in the polar dashboard
  5. update the product IDs in src/lib/auth.ts to match your polar products:
    checkout: {
      enabled: true,
      products: [
        {
          productId: "your-product-id", // Replace with actual product ID from Polar Dashboard
          slug: "pro" // Custom slug for easy reference in Checkout URL
        }
      ]
    }
    
  6. run bun db:push to create the necessary database tables
  7. start the application with bun dev

verification

to verify that the integration is working:

  1. sign up for an account
  2. navigate to the dashboard billing page (/dashboard/billing)
  3. try subscribing to a plan
  4. check that your subscription appears in the billing dashboard
  5. test the customer portal by clicking "manage subscription"

api routes

the following api routes are available for payment processing:

  • /api/payments/customer-state - get the current customer state
  • /api/payments/subscriptions - get user subscriptions

notes

  • relivator 1.4.0+ is ai-ready — optimized for ai-powered ides like cursor, making onboarding effortless even for beginners.
  • version 1.3.0 evolved into versator, featuring clerk authentication and stripe payments. explore versator demo, repo, or docs.

stand with ukraine

  • 💙 help fund drones, medkits, and victory.
  • 💛 every dollar helps stop russia's war crimes and saves lives.
  • ‼️ please, donate now, it matters.

stand with reliverse

  • ⭐ star the repo to help the reliverse community grow.
  • 😉 follow this project's author, nazar kornienko and his reliverse ecosystem, to get updates about new projects faster.
  • 🦄 become a sponsor and power the next wave of tools that just feel right.

every bit of support helps keep the dream alive: dev tools that don't suck.

license

mit © 2025 nazar kornienko (blefnk), reliverse