Preface

This documentation is based on version 1.8.2. If inconsistencies are found after template upgrades, the official documentation shall prevail.

Prerequisites

To ensure you can successfully develop projects using ShipAny, please click to complete the prerequisites

Initializing the Project

Click to see how to clone the project locally

After cloning,

Installing Dependencies

pnpm install

Starting the Development Server

pnpm dev

Open the webpage in your browser: http://localhost:3000 to preview the project.

Modifying the Website Color Scheme

shadcn Theme Debugger

Access https://tweakcn.com/editor/theme, choose a theme color scheme for your project.

The current template uses tailwindcss4. Please use oklch color format and copy the theme styles.

Paste the theme styles into your project file: src/config/style/theme.css

Configure Environment Variables

cp .env.example .env.development

Modify NEXT_PUBLIC_APP_NAME

Replace NEXT_PUBLIC_APP_NAME with your project name

Modify DATABASE_URL

Using the Supabase Database

Visit https://supabase.com/ and create a new project.

After successful creation,

Click the "Copy" icon in the image below.

Back in the IDE editor, open .env.development and update the DATABASE_URL value.

Note: [YOUR-PASSWORD] is the content you want to replace; the brackets [] must also be removed, otherwise the connection will fail.

Modify AUTH_SECRET

Execute the following command in the terminal to generate a value:

openssl rand -base64 32

For example: R6egZTFAaiKY7SMDRtXspXwyVo9UPtxf4yn0w1pLs6w2 Update it to AUTH_SECRET

Database Initialization

Execute in sequence:

pnpm db:generate

pnpm db:migrate

RBAC Initialization

pnpm rbac:init

Account Registration

Access http://localhost:3000/sign-up

First, register an account, for example: root@admin.com

After successful registration, assign super administrator privileges by executing the following in the terminal:

pnpm rbac:assign -- --email=root@admin.com --role=super_admin

After successful execution, access http://localhost:3000/admin to enter the management backend.

Google Login Official Documentation

Github Login Official Documentation

Configure Image Storage R2

R2 Official Documentation

Payment

Stripe Payment

Stripe Payment Official Documentation

Creem Payment

Creem Payment Official Documentation

PayPal Payment

PayPal Payment Official Documentation

A navigation template without data support looks empty. In this case, you need to maintain some well-known navigation items under the /admin/nav-items route in the backend (or crawl some).

If you don't want to go through that trouble, you can import my pre-built navigation data, which is the data you see at https://navs.995010.xyz/.

Open shipany-template-navigation/db/navigation.sql. Copy all the contents and open the SQL Editor under supabase.

Paste the contents and then execute Run.

After successful execution, return to the project at http://localhost:3000/. You can then see the data.

Further management is available at http://localhost:3000/admin/nav-items

Deployment

Deploy to Vercel

Deployment to Vercel Official Documentation

Deploy to Cloudflare

Deployment to Cloudflare Official Documentation

Deploy to Dokploy

Deployment to Dokploy Official Documentation

Quick Start