Skip to content

Latest commit

 

History

History
117 lines (82 loc) · 4.69 KB

File metadata and controls

117 lines (82 loc) · 4.69 KB

React InsForge Starter

The fastest way to build apps with React and InsForge

Demo · Features · Quick launch · Clone and run locally · Deploy to Vercel

React InsForge Starter


Demo

Check out the live demo: demoreact.insforge.site

Features

  • Works across a modern React starter stack
    • React 19
    • Vite
    • React Router
    • TypeScript
    • It just works
  • InsForge auth configured across the starter app
  • Viewer state wired through a shared auth context for the starter routes
  • Protected example route with signed-in user details and starter steps
  • Optional Google and GitHub OAuth providers
  • Browser-side auth actions using @insforge/sdk
  • Starter homepage with environment setup guidance
  • Styling with Tailwind CSS
  • Ready for local development and Vercel deployment

Quick launch

If you want the fastest path, use the InsForge CLI and follow the prompts:

npx @insforge/cli create

From there:

  1. Choose the React starter template
  2. Follow the prompt flow to create or connect your InsForge project
  3. Let the CLI handle the initial setup
  4. Choose to deploy with InsForge from the guided flow

Use the sections below if you want to set up the starter manually.

Clone and run locally

  1. Clone this repository and move into the starter directory.
git clone https://github.com/InsForge/insforge-templates.git
cd insforge-templates/react
  1. Install dependencies.
npm install
  1. Go to the InsForge dashboard, create a project, and click ConnectCLI to get the link command:
npx @insforge/cli link --project-id <your-project-id>
  1. Copy env.example to .env.local and update the values with your InsForge project settings (find these in the InsForge dashboard under ConnectAPI Keys):
cp env.example .env.local

Set the following values in .env.local:

VITE_INSFORGE_BASE_URL=https://your-project.region.insforge.app
VITE_INSFORGE_ANON_KEY=your-anon-key

You can find the project URL and anon key in your InsForge project settings.

  1. Start the development server.
npm run dev

The starter should now be running on localhost:5173.

Deploy to Vercel

Click Deploy with Vercel, then fill in the required environment variables during the setup flow:

  • VITE_INSFORGE_BASE_URL
  • VITE_INSFORGE_ANON_KEY

Deploy with Vercel

After importing into Vercel:

  1. In your InsForge dashboard, open AuthenticationGeneralAllowed Redirect URLs
  2. Add your deployed callback URL, for example https://your-project.vercel.app/auth/callback
  3. If you test locally as well, also allow http://localhost:5173/auth/callback

The above will also clone the starter kit to your GitHub, so you can clone it locally and continue development there.