Thanks to visit codestin.com
Credit goes to github.com

Skip to content

Next.js 15 SaaS Boilerplate and Starter Kit designed and built for SaaS startups. It comes with all necessary integrations, pages, and components you need to launch a feature-rich SaaS websites.

License

Notifications You must be signed in to change notification settings

kritsanan1/play-nextjs

 
 

Repository files navigation

Turborepo Next.js + Expo 54 Monorepo

This project has been converted to a Turborepo monorepo containing both a Next.js web application and an Expo 54 mobile application with shared packages.

What's Inside?

This monorepo includes the following packages and apps:

Apps

  • apps/web: Next.js 15 web application

    • Full-stack SaaS starter kit with authentication (NextAuth.js)
    • Database integration with Prisma (PostgreSQL)
    • Stripe payment integration
    • MDX blog support
    • Styled with Tailwind CSS
    • Runs on port 5000 for Replit compatibility
  • apps/mobile: Expo 54 mobile application

    • Built with Expo Router for file-based navigation
    • React Native 0.81
    • React 19 support
    • TypeScript enabled
    • Cross-platform (iOS, Android, Web)

Shared Packages

  • packages/typescript-config: Shared TypeScript configurations

    • base.json: Base TypeScript config
    • nextjs.json: Next.js specific config
    • react-native.json: React Native/Expo config
  • packages/eslint-config: Shared ESLint configurations

    • next.js: ESLint config for Next.js
    • react-native.js: ESLint config for React Native

Getting Started

Install Dependencies

From the root directory:

npm install --legacy-peer-deps

Note: The --legacy-peer-deps flag is required due to React 19 compatibility.

Run Development Servers

Web App (Recommended)

cd apps/web && npm run dev

The web app will be available at http://localhost:5000

Mobile App

cd apps/mobile && npm run dev

Then:

  1. Install the Expo Go app on your mobile device
  2. Scan the QR code displayed in the terminal
  3. Your app will open in Expo Go

Run All Apps with Turborepo

npm run dev

This runs all development servers concurrently.

Project Structure

.
├── apps/
│   ├── web/              # Next.js SaaS application
│   │   ├── src/          # Source code (app router, components, utils)
│   │   ├── public/       # Static assets
│   │   ├── prisma/       # Database schema
│   │   └── package.json
│   └── mobile/           # Expo mobile app
│       ├── app/          # Expo Router pages (_layout.tsx, index.tsx)
│       ├── assets/       # Images and assets
│       └── package.json
├── packages/
│   ├── typescript-config/  # Shared TS configs
│   └── eslint-config/      # Shared ESLint configs
├── package.json          # Root package.json (workspace)
├── turbo.json            # Turborepo configuration
└── pnpm-workspace.yaml   # Workspace definition

Available Scripts

Root Scripts (Turborepo)

  • npm run dev - Start all development servers
  • npm run build - Build all apps
  • npm run lint - Lint all apps
  • npm run clean - Clean build artifacts

Web App Scripts

  • npm run dev - Next.js dev server (port 5000)
  • npm run build - Build for production
  • npm run start - Start production server
  • npm run lint - Run ESLint

Mobile App Scripts

  • npm run dev - Start Expo dev server
  • npm run android - Open on Android
  • npm run ios - Open on iOS
  • npm run web - Open in browser

Environment Variables

Web App

Required environment variables (see apps/web/.env.example):

  • Database: DATABASE_URL (PostgreSQL)
  • Auth: NEXTAUTH_URL, NEXTAUTH_SECRET
  • Email: Nodemailer configuration
  • Payments: Stripe API keys

Mobile App

Configure in apps/mobile/app.json

Features

Web App (SaaS Starter Kit)

  • ✅ PostgreSQL database with Prisma
  • ✅ NextAuth authentication
  • ✅ Stripe payment integration
  • ✅ MDX blog support
  • ✅ Tailwind CSS styling
  • ✅ Pre-built SaaS pages (login, signup, pricing, blog)
  • ✅ TailGrids components

Mobile App

  • ✅ Expo 54 (React Native 0.81)
  • ✅ Expo Router for navigation
  • ✅ TypeScript support
  • ✅ Cross-platform (iOS, Android, Web)

Monorepo Benefits

  • Turborepo for fast builds and caching
  • 📦 Code sharing between web and mobile
  • 🔧 Shared configs for TypeScript and ESLint
  • 🚀 Parallel execution of tasks

Sharing Code Between Apps

Create shared packages in packages/ and import them:

// In packages/shared/index.ts
export const API_URL = process.env.API_URL || 'http://localhost:5000';

// In apps/web
import { API_URL } from '@repo/shared';

// In apps/mobile
import { API_URL } from '@repo/shared';

Deployment

Web App (Replit)

Already configured for Replit:

  • Port 5000
  • Binds to 0.0.0.0
  • CORS configured

Mobile App (EAS Build)

  1. Install EAS CLI:

    npm install -g eas-cli
  2. Build:

    cd apps/mobile
    eas build --platform ios
    # or
    eas build --platform android

Documentation

Original Play Next.js Features

This monorepo preserves all the features from the original Play Next.js SaaS Starter Kit:

  • Free and open-source SaaS boilerplate
  • Premium design and UI components
  • Essential SaaS integrations (DB, Auth, Payments, MDX)
  • Built with TailGrids components
  • Perfect for startups and SaaS businesses

For detailed setup instructions for the web app features, see the Next.js Templates documentation.

License

MIT - Free for personal and commercial use

Show Your Support

⭐ Star this repository if you find it helpful!


Converted to Turborepo monorepo to enable web + mobile development with shared code and modern build tooling.

About

Next.js 15 SaaS Boilerplate and Starter Kit designed and built for SaaS startups. It comes with all necessary integrations, pages, and components you need to launch a feature-rich SaaS websites.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • TypeScript 64.2%
  • JavaScript 24.8%
  • CSS 11.0%