---
title: "JigsawStack Starter"
description: "AI-powered starter kit using Next.js & JigsawStack APIs to quickly build apps. AI features include AI Scrape, image gen, TTS, OCR, and more."
url: "https://vercel.com/templates/next.js/jigsawstack-starter"
links:
  repository: "https://github.com/JigsawStack/jigsawstack-starterkit"
  demo: "https://jigsawstack-starterkit.vercel.app/"
  deploy: "https://vercel.com/new/clone?demo-title=JigsawStack+Starter&demo-description=AI-powered+starter+kit+using+Next.js+%26+JigsawStack+APIs+to+quickly+build+apps.+AI+features+include+AI+Scrape%2C+image+gen%2C+TTS%2C+OCR%2C+and+more.&demo-url=https%3A%2F%2Fjigsawstack-starterkit.vercel.app%2F&demo-image=%2F%2Fimages.ctfassets.net%2Fe5382hct74si%2F4omU8229oVxBV3A5OVefI7%2F7b5855141caab66d595a71b764fd6ade%2Fthumbnail_template.png&project-name=JigsawStack+Starter&repository-name=jigsawstack-starter&repository-url=https%3A%2F%2Fgithub.com%2FJigsawStack%2Fjigsawstack-starterkit&from=templates&skippable-integrations=1&env=JIGSAWSTACK_API_KEY&envDescription=You+can+create+a+JigsawStack+API+key+in+your+project+dashboard.+Add+it+here+to+authenticate+and+access+AI+features+with+our+small+custom+models.&envLink=https%3A%2F%2Fjigsawstack.com%2Fdocs%2Fintroduction"
---

# JigsawStack Starter

AI-powered starter kit using Next.js & JigsawStack APIs to quickly build apps. AI features include AI Scrape, image gen, TTS, OCR, and more.

<a href="https://github.com/jigsawstack/nextjs-template">
  <h1 align="center">JigsawStack Next.js Template</h1>
</a>

<p align="center">
  An open-source AI-powered starter kit built with Next.js, Tailwind CSS, and JigsawStack AI APIs.
</p>

<p align="center">
  <a href="#features"><strong>Features</strong></a> ·
  <a href="#deploy-your-own"><strong>Deploy Your Own</strong></a> ·
  <a href="#running-locally"><strong>Running Locally</strong></a> ·
  <a href="#available-ai-apis"><strong>Available AI APIs</strong></a>
</p>
<br/>

## Features

- Ready-to-use AI API integrations powered by [JigsawStack](https://jigsawstack.com), including image generation, text-to-speech, speech-to-text, translation, OCR, and web search.
- Modern UI components using [shadcn/ui](https://ui.shadcn.com/) with [Tailwind CSS](https://tailwindcss.com).
- Built with the latest [Next.js 15](https://nextjs.org) App Router and React 19.
- Turbopack for faster development experience.
- Dark mode support via next-themes.
- TypeScript for type safety.

## Deploy Your Own

You can deploy your own version to Vercel by clicking the button below:

[![Deploy with Vercel](https://vercel.com/button)](https://vercel.com/new/clone?repository-url=https%3A%2F%2Fgithub.com%2Fjigsawstack%2Fnextjs-template&project-name=jigsawstack-nextjs-app&repository-name=jigsawstack-nextjs-app)

## Running Locally

1. Clone the repository and install dependencies:

   ```bash
   git clone https://github.com/jigsawstack/nextjs-template.git
   cd nextjs-template
   npm install
   # or
   yarn install
   # or
   pnpm install
   # or
   bun install
   ```

2. Create a `.env.local` file in the root directory and add your JigsawStack API key:

   ```
   JIGSAWSTACK_API_KEY=your_api_key_here
   ```

   You can get your API key by signing up at [JigsawStack](https://jigsawstack.com).

3. Run the development server:

   ```bash
   npm run dev
   # or
   yarn dev
   # or
   pnpm dev
   # or
   bun dev
   ```

4. Open [http://localhost:3000](http://localhost:3000) to view your application.

## Available AI APIs

This template includes ready-to-use API routes for the following JigsawStack AI services:

- **Image Generation** - Create AI-generated images from text prompts
- **Text-to-Speech (TTS)** - Convert text to natural-sounding speech
- **Speech-to-Text** - Transcribe audio to text
- **Translation** - Translate text between languages
- **Visual OCR** - Extract text from images
- **AI Web Scraping** - Extract structured data from websites
- **Web Search** - Perform AI-powered web searches

Each API is pre-configured in the `app/api/jigsawstack` directory and ready to use in your Next.js application.

## Learn More

To learn more about the technologies used in this template:

- [JigsawStack Documentation](https://docs.jigsawstack.com) - learn about JigsawStack AI APIs
- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js features and API
- [Tailwind CSS](https://tailwindcss.com/docs) - utility-first CSS framework
- [shadcn/ui](https://ui.shadcn.com) - beautifully designed components

## License

This project is open source and available under the [MIT License](https://github.com/JigsawStack/jigsawstack-starterkit/tree/main/LICENSE).

## Related Templates

### [AI SDK Image Generator](https://vercel.com/templates/next.js/ai-sdk-image-generator)

An open-source AI image generator built with Next.js, the AI SDK, and various AI providers (Replicate, Fireworks, Google Vertex AI, OpenAI)

### [Internal Knowledge Base - AI SDK](https://vercel.com/templates/next.js/ai-sdk-internal-knowledge-base)

A retrieval-augmented generation Next.js chatbot using the AI SDK's middleware interface.

### [Vercel x xAI Chatbot](https://vercel.com/templates/next.js/vercel-x-xai-chatbot)

An open-source AI chatbot built with Next.js, the AI SDK, and xAI.

---

## Additional documentation

The [Vercel Knowledge Base](https://vercel.com/kb) contains guides and answers to common questions about Vercel, including deployment, framework configuration, domains, caching, and troubleshooting.