Quickstart
Get started with Tambo - either with our template or by adding to your existing app
Quickstart
There are two ways to get started with Tambo:
- Using our template project (recommended for new projects)
- Adding Tambo to an existing Next.js/React application
Using the Template
The Tambo template provides a pre-configured project setup to help you get started quickly. You can install it using either a step-by-step approach or a single command.
Step by Step Installation
Follow these commands one at a time:
This command will walk you through setting up your project and obtaining your API key. If you don't already have an account, sign up for free to get your API key.
or install everything at once, you can run this single command:
Adding to Existing App
If you have an existing Next.js application and want to add Tambo functionality, follow these steps:
Step 1: Install tambo-ai
This command will:
- Setup Tambo in your existing project and get you an API key
- Install components that are hooked up to tambo-ai
- Show you how to wrap your app with the
<TamboProvider>
If you prefer manual setup, you can run npx tambo init
which will just get you set up with an API key. If you don't have an account yet, sign up for free first.
Step 2: Add the TamboProvider
Once the installation completes, update your src/app/layout.tsx
file to enable Tambo:
API Key Setup
You need to create a .env.local
file in the root of your project to store
your Tambo API key: NEXT_PUBLIC_TAMBO_API_KEY=your_api_key_here
Replace your_api_key_here
with the actual API key you received during setup.
This file should not be committed to version control as it contains sensitive
information.
Note that the TamboProvider
only works in the browser. On Next.js, specify
"use client"
at the top of your file to ensure that the TamboProvider
is
rendered in the browser.
Step 3: Add the MessageThreadFull component
The <MessageThreadFull>
component that the full-send
command installed provides a complete chat interface for your AI assistant. Here's how to add it to your src/app/page.tsx
file:
Run your app
When you are done, you should see a chat interface like this: