JavaScript/TypeScript Quickstart

Build your first AI application with Genkit in JavaScript or TypeScript

This guide will help you create your first AI-powered application using Genkit for JavaScript/TypeScript. You’ll learn how to initialize Genkit, make your first generation request, and run it with the Developer UI.

Prerequisites

• Node.js 18 or later
• npm, yarn, or pnpm
• A Google AI API key (get one at Google AI Studio)

Step 1: Install Dependencies

Create a new project and install Genkit:

npm

npm init -y
npm install genkit @genkit-ai/google-genai
npm install -g genkit-cli

Step 2: Set Your API Key

Set your Google AI API key as an environment variable:

export GOOGLE_GENAI_API_KEY="your-api-key-here"

You can also create a .env file in your project root:

GOOGLE_GENAI_API_KEY=your-api-key-here

Step 3: Create Your First Application

Create a file named index.ts (or index.js for JavaScript):

index.ts

import { genkit } from 'genkit';
import { googleAI } from '@genkit-ai/google-genai';

const ai = genkit({ plugins: [googleAI()] });

const { text } = await ai.generate({
    model: googleAI.model('gemini-2.0-flash'),
    prompt: 'Why is Firebase awesome?'
});

console.log(text);

If you’re using JavaScript instead of TypeScript, you’ll need to use ES modules. Add "type": "module" to your package.json.

Step 4: Run Your Application

Run your application with the Genkit CLI to get automatic tracing and access to the Developer UI:

genkit start -- npx tsx index.ts

For JavaScript:

genkit start -- node index.js

You should see output similar to:

Firebase is awesome because it provides a comprehensive suite of tools...

🔥 Genkit Developer UI: http://localhost:4000

Step 5: Explore the Developer UI

Open http://localhost:4000 in your browser to access the Genkit Developer UI. Here you can:

• View execution traces of your AI requests
• Test different prompts interactively
• Compare outputs from different models
• Debug multi-step flows

What’s Next?

Add Streaming

Stream responses for better user experience:

const { stream } = await ai.generateStream({
    model: googleAI.model('gemini-2.0-flash'),
    prompt: 'Write a short story about AI'
});

for await (const chunk of stream) {
    process.stdout.write(chunk.text);
}

Generate Structured Output

Get type-safe JSON responses:

import { z } from 'zod';

const recipeSchema = z.object({
    title: z.string(),
    ingredients: z.array(z.string()),
    steps: z.array(z.string())
});

const { output } = await ai.generate({
    model: googleAI.model('gemini-2.0-flash'),
    prompt: 'Create a recipe for chocolate chip cookies',
    output: { schema: recipeSchema }
});

console.log(output); // Type-safe recipe object

Create a Flow

Flows are functions that encapsulate AI logic with automatic tracing:

const jokeFlow = ai.defineFlow(
    {
        name: 'tellJoke',
        inputSchema: z.string(),
        outputSchema: z.string()
    },
    async (topic) => {
        const { text } = await ai.generate({
            model: googleAI.model('gemini-2.0-flash'),
            prompt: `Tell me a joke about ${topic}`
        });
        return text;
    }
);

// Run the flow
const joke = await jokeFlow('programming');
console.log(joke);

Add Tool Calling

Give your AI the ability to call functions:

const weatherTool = ai.defineTool(
    {
        name: 'getWeather',
        description: 'Gets the current weather for a location',
        inputSchema: z.object({ location: z.string() }),
        outputSchema: z.string()
    },
    async ({ location }) => {
        // In a real app, call a weather API
        return `The weather in ${location} is sunny and 72°F`;
    }
);

const { text } = await ai.generate({
    model: googleAI.model('gemini-2.0-flash'),
    prompt: "What's the weather in San Francisco?",
    tools: [weatherTool]
});

console.log(text);

Try Other Model Providers

Genkit supports multiple AI providers:

import { anthropic } from '@genkit-ai/anthropic';

const ai = genkit({
    plugins: [
        googleAI(),
        anthropic({ apiKey: process.env.ANTHROPIC_API_KEY })
    ]
});

// Use Claude
const { text } = await ai.generate({
    model: anthropic.model('claude-3-5-sonnet-20241022'),
    prompt: 'Hello, Claude!'
});

Learn More

Text Generation

Learn about different generation options

Structured Output

Generate type-safe JSON responses

Tool Calling

Give AI models access to functions

Developer Tools

Explore the Developer UI features