Skip to main content

Knowledge Base

Starting template

When you start working with Instance, you don't begin with a blank slate. Each new app comes with our starter template, helping you get up and running quickly while enhancing the quality of AI-generated output.

The Instance starter

The starting template provides a working front-end and back-end that are already set up to work together seamlessly. However, it contains no data except for a header that says Instance starter.

The Instance starter code is accessible through the Code tab

When viewing the code through the Code tab (on https://instance.so), you'll notice several pre-installed dependencies—including React, Tailwind, and Radix—that are essential for the setup to function correctly.

Front-end (React + TypeScript + Vite)

  • Location: /client directory
  • Main component: App.tsx with a simple Instance starter heading
  • Styling: Tailwind CSS with shadcn/ui components
  • Build tool: Vite with React plugin

Back-end (Express + TypeScript)

  • Location: /server directory
  • Main file: index.ts with Express 5 setup
  • Static serving: Configured for production builds
  • Development: Hot reload with tsx watch

Key features

  • TypeScript support for both client and server
  • Tailwind CSS with custom design system
  • shadcn/ui component library (15+ components ready)
  • Development server with hot reload
  • Production build process
  • Static file serving for SPA routing