Follow the steps below to get the core application up and running in under 5 minutes. After that, you can start activating other services or setting up any of the demo applications.

​
Quick setup

Hi there 👋 - ready to build your AI app? Let’s get into it!

1

Clone the repository

We’ll start by getting your project up and running locally:

2

Get your Supabase credentials

  1. Create a Supabase account account or sign in to your existing one.
  2. In your Supabase dashboard, go to “Project Settings” then “API Settings”.
  3. Copy your Supabase URL, anon key, and service key.
  4. Paste these values into your .env file. Also set your PRODUCTION_URL in the .env file (can be http://localhost:3000 if deploying locally):
.env
PRODUCTION_URL=https://apps.anotherwrapper.com
NEXT_PUBLIC_SUPABASE_URL=https://somethingsomething.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=youranonkey
NEXT_SUPABASE_SERVICE_KEY=yourservicekey
3

Install dependencies and run

We’ll install all the required packages and run it locally:

cli
npm install
npm run dev

Go to http://localhost:3000 - your website should be up and running!

4

Customize website metadata

Go to config.ts in the root of your projects folder and fill in your website metadata. You’ll be able to fill in things like your website’s title, description, logo, URL, theme and so on!

Don’t forget to correctly fill-in the Inside Routing part of the config. This is important for auth redirection.

config.ts
/// Core Website config
export const companyConfig = {
////// Base config
  company: {
    name: "AnotherWrapper",
    theme: "anotherwrapper",
    homeUrl: "https://apps.anotherwrapper.com",
    appUrl: "/",
    description: "Build your AI startup in hours using our demo apps",
    logo: "/logo.png",
    navbarLinks: [
        { label: "Home", href: "https://anotherwrapper.com" },
        { label: "Other apps", href: "https://apps.anotherwrapper.com" },
        { label: "Blog", href: "/blog" },
      ],
  },

////// UI config
...
// Themes and customization
...
// Legal stuff
...

After following these steps, the basic setup is done. You can now start activating other services (analytics, payments, storage, ..) or set up one of the 8 demo applications.

Instead of starting from scratch, set up one of our 8 AI demo applications to quickstart your development. Demo apps include capabilities to generate text, images, analyze images, create chatbots, chat with PDFs, transcribe audio and more!

Set up storage

Set up S3 compatible storage using Cloudflare R2

Set up OpenAI

Set up OpenAI & understand how it’s used throughout the app

Set up Groq

Set up Groq & understand how it’s used throughout the app

Set up payments

Accepting payments and set up a paywall using LemonSqueezy

Set up email

Set up your first email funnel using Loops

Set up analytics

Set up PostHog Analytics to understand user behavior

Chat with PDF app

Build your own Chat with a PDF app

Transcribe audio

Build your own audio transcription app

Project Structure