Skip to main content

Starter Templates

Get up and running in minutes with our production-ready starter templates. Each template comes with authentication, user management, and 23blocks SDK pre-configured.

Available Templates​

TemplateFrameworkBest For
Next.js TemplateNext.js 15 + React 19Modern web apps with SSR
Angular TemplateAngular 19Enterprise web applications
Mobile TemplateReact Native (Expo 52)Cross-platform iOS & Android

Next.js Template​

Modern web applications using Next.js 15 with App Router and Server Components.

Features​

  • Next.js 15 with App Router and React 19
  • Pre-built auth flows: Sign-in, sign-up, password reset
  • Tailwind CSS for styling
  • Full TypeScript support
  • Dark mode ready
  • Cookie or token authentication modes

Quick Start​

Option 1: Use GitHub Template (Recommended)

  1. Visit github.com/23blocks-OS/nextjs-template
  2. Click "Use this template" → "Create a new repository"
  3. Clone your new repo and install:
git clone https://github.com/YOUR_USERNAME/YOUR_REPO.git
cd YOUR_REPO
npm install

Option 2: Use degit (No Git History)

npx degit 23blocks-OS/nextjs-template my-app
cd my-app
npm install

Configuration​

cp .env.example .env.local

Edit .env.local with your 23blocks credentials:

NEXT_PUBLIC_23BLOCKS_API_KEY=your-api-key
NEXT_PUBLIC_23BLOCKS_AUTH_URL=https://gateway.23blocks.com

Run Development Server​

npm run dev

Open http://localhost:3000 to see your app.

View on GitHub →

Angular Template​

Enterprise-scale web applications with Angular 19 and reactive patterns.

Features​

  • Angular 19 with standalone components
  • RxJS for reactive state management
  • Pre-built auth flows: Login, registration, password reset
  • Environment-based configuration
  • TypeScript with strict mode
  • Cookie or token authentication modes

Quick Start​

Option 1: Use GitHub Template (Recommended)

  1. Visit github.com/23blocks-OS/angular-template
  2. Click "Use this template" → "Create a new repository"
  3. Clone your new repo and install:
git clone https://github.com/YOUR_USERNAME/YOUR_REPO.git
cd YOUR_REPO
npm install

Option 2: Use degit (No Git History)

npx degit 23blocks-OS/angular-template my-app
cd my-app
npm install

Configuration​

cp src/environments/environment.example.ts src/environments/environment.ts

Edit environment.ts with your 23blocks credentials:

export const environment = {
  production: false,
  apiKey: 'your-api-key',
  authUrl: 'https://gateway.23blocks.com',
  authMode: 'token', // or 'cookie'
  storageType: 'localStorage'
};

Run Development Server​

npm start

Open http://localhost:4200 to see your app.

View on GitHub →

Mobile Template​

Cross-platform iOS and Android applications with React Native and Expo.

Features​

  • Expo 52 with Expo Router for file-based navigation
  • Secure token storage using expo-secure-store
  • Pre-built auth flows: Login, registration, password reset
  • Full TypeScript support
  • Works on iOS, Android, and Expo Go

Quick Start​

Option 1: Use GitHub Template (Recommended)

  1. Visit github.com/23blocks-OS/mobile-template
  2. Click "Use this template" → "Create a new repository"
  3. Clone your new repo and install:
git clone https://github.com/YOUR_USERNAME/YOUR_REPO.git
cd YOUR_REPO
npm install

Option 2: Use degit (No Git History)

npx degit 23blocks-OS/mobile-template my-app
cd my-app
npm install

Configuration​

cp .env.example .env

Edit .env with your 23blocks credentials:

EXPO_PUBLIC_BLOCKS_API_KEY=your-api-key
EXPO_PUBLIC_BLOCKS_AUTH_URL=https://gateway.23blocks.com

Run Development Server​

npm start          # Start Expo dev server
npm run ios        # Run on iOS simulator
npm run android    # Run on Android emulator

View on GitHub →

What's Included​

All templates come with:

FeatureDescription
AuthenticationSign-in, sign-up, password reset flows
User ManagementUser profile and session handling
SDK Integration@23blocks/react SDK pre-configured
TypeScriptFull type safety throughout
Environment ConfigDev/production environment support
Best PracticesProduction-grade security patterns

SDK Hooks Available​

Once configured, use these hooks in your components:

import {
  useAuth,      // Authentication operations
  useUser,      // User profile management
  useSearch,    // Search functionality
  useProducts,  // Product catalog
  useCrm,       // CRM features
  useContent    // Content management
} from '@23blocks/react';

Requirements​

  • Node.js 18+
  • npm or yarn
  • 23blocks account with API key (Get one free)

For mobile template:

  • Expo CLI (npm install -g expo-cli)
  • iOS Simulator (Mac only) or Android Emulator

Need Help?​