Node.js
Next.js
Learn how to integrate JigsawStack with Next.js to build AI-powered applications
Models
Explore our complete list of models and API references here.
Prerequisites
Before you begin, make sure you have:
- Created a JigsawStack account
- Retrieved your API key
- Installed Node.js (version 18.10.0 or higher)
- Set up a Next.js project
Installation
Add the JigsawStack SDK to your Next.js project:
Configuration
Setting up environment variables
- Create or modify your
.env.local
file in the root of your Next.js project:
.env.local
- For production, make sure to add the environment variable to your deployment platform (Vercel, Netlify, etc.)
API Route Implementation
JigsawStack can be easily integrated into Next.js API routes. Here’s an example of a text-to-speech API endpoint:
pages/api/tts.ts
Client-Side Implementation
For client components that need to use JigsawStack, you should make requests through your API routes rather than directly from the client to protect your API key.
components/TextToSpeechButton.jsx
App Router Support
If you’re using Next.js App Router, you can create a route handler:
app/api/tts/route.ts
JigsawStack seamlessly integrates with Next.js to provide powerful AI capabilities while maintaining best practices for security and performance.