Installation

This guide will help you set up Sushify Next.js on your local machine and get your development environment ready.

Prerequisites

Before you begin, make sure you have the following installed on your system:

Required

• Node.js (v20 or higher)

  node --version

• Git

  git --version

• pnpm (v10.14.0 or compatible)

  This project uses pnpm as its package manager. If you don't have it installed:

  # Install pnpm globally
  npm install -g pnpm
  
  # Or use Corepack (built into Node.js v16.13+)
  corepack enable
  corepack prepare pnpm@10.14.0 --activate
  
  # Verify installation
  pnpm --version

Quick Installation

There are multiple ways to get started with Sushify Next.js. Choose the method that works best for you.

Method 1: Fork the Repository (Recommended)

Forking is the recommended approach as it makes it easier to pull updates and contribute back.

1. Visit the Sushify Next.js repository
2. Click the Fork button in the top-right corner
3. Clone your forked repository:

git clone https://github.com/YOUR_USERNAME/sushify-nextjs.git
cd sushify-nextjs

Method 2: Clone Directly

If you don't need to track upstream changes, you can clone directly:

git clone https://github.com/yourusername/sushify-nextjs.git
cd sushify-nextjs

Method 3: Download ZIP

1. Visit the Sushify Next.js repository
2. Click Code → Download ZIP
3. Extract the ZIP file
4. Navigate to the extracted folder in your terminal

Installation Steps

Once you have the repository on your local machine, follow these steps:

1. Install Dependencies

Install all required packages using pnpm:

pnpm install

2. Set Up Environment Variables

Copy the example environment file and configure your variables:

cp .env.local.example .env.local

Open .env.local in your editor and fill in the required values. You'll need to:

# Database
DATABASE_URL="YOUR_DATABASE_CONNECTION_STRING"

3. Select your mail provider

Sushify Next.js supports multiple email service providers. You need to:

1. Choose a provider and configure it in config/index.ts
2. Set the required environment variables for that provider

Step 1: Configure Provider in config/index.ts

Open config/index.ts and update the mails section:

// Mails
mails: {
  // Can be: resend, mailgun, postmark, plunk, nodemailer, console, custom
  provider: "resend", // Change this to your chosen provider
  // The from address for emails
  from: "noreply@yourdomain.com", // Change this to your verified email
},

Step 2: Set Environment Variables

Based on your chosen provider, add the corresponding environment variables to .env.local. If you're using Resend:

RESEND_API_KEY="re_xxxxxxxxxxxx"

4. Set up the payment provider

Sushify Next.js supports multiple payment providers. You need to:

1. Choose a provider and configure it in config/index.ts
2. Set the required environment variables for that provider

Step 1: Configure Provider in config/index.ts

Open config/index.ts and update the payments section:

// Payments
payments: {
  // Can be: stripe, lemonsqueezy, polar, dodopayments
  provider: "stripe", // Change this to your chosen provider
},

Step 2: Set Environment Variables

Based on your chosen provider, add the corresponding environment variables to .env.local. For example, if you're using Stripe:

STRIPE_SECRET_KEY="sk_xxxxxxxxxxxx"

5. Set up the affiliate provider

Sushify Next.js supports affiliate programs with Rewardful and PromoteKit. You need to:

1. Enable and configure the affiliate provider in config/index.ts
2. Set the required environment variables for that provider

Step 1: Configure Affiliate Provider in config/index.ts

Open config/index.ts and update the affiliate section:

// Affiliate
affiliate: {
  // whether the affiliate program should be enabled
  enabled: true,
  // the provider of the affiliate program
  // Can be: rewardful, promotekit
  provider: "rewardful", // Change this to your chosen provider
},

Step 2: Set Environment Variables

Based on your chosen provider, add the corresponding environment variables to .env.local. For example, if you're using Rewardful:

REWARDFUL_API_KEY="your_rewardful_api_key"

Or if you're using PromoteKit:

PROMOTEKIT_API_KEY="your_promotekit_api_key"

6. Set Up the Database

Now that you've configured your database connection, you need to set up the database schema and generate the Prisma client.

Step 1: Push the Database Schema

This command syncs your Prisma schema with your database, creating all necessary tables and relationships:

pnpm --filter database push

This will read your Prisma schema file and create/update the database tables accordingly.

Step 2: Generate Prisma Client

This command generates the type-safe Prisma Client based on your schema:

pnpm --filter database generate

The Prisma Client provides TypeScript types and methods to interact with your database safely.

7. Start Development Server

Start the development server:

pnpm dev

Your application should now be running at http://localhost:3000!

Verify Installation

To verify everything is working correctly:

1. Open http://localhost:3000 in your browser
2. You should see the landing page
3. Try navigating to different pages
4. Check the terminal for any errors

If you encounter any issues, see the Troubleshooting guide.