Convert Figma logo to code with AI

blefnk logorelivator

✨ Relivator 1.3.0 RC.1 is Here 🚀 Next.js 15.1 React 19 eCommerce Template ▲ i18n Stripe Shadcn UI Tailwind Drizzle ORM Zod TypeScript TS Clerk Radix, Responsive Server Components, Postgres Neon, Intl App Router Docs User Actions Kit, SaaS Commerce eCommerce Shop Pricing Payments Dark Mode Full Stack Free ⭐ more stars 👉 more features

1,101
220
1,101
10

Top Related Projects

11,294

Next.js Commerce

24,996

Building blocks for digital commerce

20,917

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

12,911

An open source eCommerce platform giving you full control and customizability. Modular and API-first. Build any eCommerce solution that your business requires. Developed by @vendo-dev

4,997

🛒 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

11,294

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.

24,996

Building blocks for digital commerce

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.

20,917

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.

12,911

An open source eCommerce platform giving you full control and customizability. Modular and API-first. Build any eCommerce solution that your business requires. 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
4,997

🛒 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 Template

Please consider following this project's author, Nazar Kornienko, and consider starring the project to show your ❤️ and support.

cover image

How to Run or Build the Project?

Make sure you have Git, Node.js, and Bun installed. Then:

  1. git clone https://github.com/blefnk/relivator.git
  2. cd relivator
  3. bun i
  4. cp .env.example .env → Fill in the .env file
  5. bun db:push
  6. bun dev / bun run build

What is Relivator?

The Relivator template serves as the foundation for your eCommerce platform, helping you create efficient, engaging, and profitable online stores. Relivator enhances any eCommerce with the power of modern Next.js, React, TypeScript, Tailwind, and more. For detailed information about the Relivator template and its bootstrapper, Reliverse, you can visit the documentation website.

Stack of technologies

  • Core: Next.js 15.1, React 19, TypeScript 5.7
  • Internationalization: next-intl
  • Styling: Tailwind & Shadcn/UI
  • Auth: Clerk
  • Payments: Stripe
  • Database: Drizzle ORM & Neon Postgres
  • File Storage: Uploadthing
  • Tools: ESLint 9, Biome, Knip

What if I want to have another stack?

  1. bun i -g @reliverse/cli@latest
  2. reliverse
  3. Select Build a brand new thing from scratch
  4. Provide details about your new project
  5. Select the technologies you want to use
  6. No more steps! It's ready! 😊🎉