Skip to content

a starter kit for integrating OpenAI's API into a Next.js application.

Notifications You must be signed in to change notification settings

patrickacraig/next-openai-starter

Repository files navigation

Next.js OpenAI Starter App

This is a starter kit for integrating OpenAI's API into a Next.js application. It is crafted with minimal styling and basic API integration so you can strip it and bring your own libraries to make it your own. Feel free to fork and create something amazing!

Getting Started

First, fork the repo to your dev environment and install the packages:

npm install
#or
yarn

Then, run the development server:

npm run dev
# or
yarn dev

If you use something besides yarn, be sure to delete any other package manager lockfiles. Open http://localhost:3000 with your browser to see the result.

Important!

Make sure that update the OPENAI_API_KEY=yourApiKey in the .env.example file, and then change the file name to .env.local. You can get an API key by creating an account with OpenAI and then navigating here.

OpenAI API Endpoint

OpenAI's API route is located at src/pages/api/openai.js.

The pages/api directory is mapped to /api/*. Files in this directory are treated as API routes instead of React pages.

This project uses next/font to automatically optimize and load Inter, a custom Google Font.

Learn More

To learn more about Next.js and OpenAI, take a look at the following resources:

Next.js

OpenAI

You can check out the Next.js GitHub repository - your feedback and contributions are welcome!

Deploy on Vercel

The easiest way to deploy your Next.js app is to use the Vercel Platform from the creators of Next.js.

Check out our Next.js deployment documentation for more details.