replicate/getting-started-nextjs-typescript

replicate/getting-started-nextjs-typescript

Description: A Next.js + Typescript starter app using Replicate

Language: TypeScript

License: Apache-2.0

Stars: 31

Forks: 12

Open issues: 0

Created: 2023-12-03T14:32:57Z

Pushed: 2023-12-03T16:05:47Z

Default branch: main

Fork: yes

Parent repository: replicate/getting-started-nextjs

Archived: no

README:

Getting started with Next.js and Replicate

This branch uses Typescript, Tailwind and the Next.js App Router

This is a Next.js template project that's preconfigured to work with Replicate's API.

You can use this as a quick jumping-off point to build a web app using Replicate's API, or you can recreate this codebase from scratch by following the guide at replicate.com/docs/get-started/nextjs

Noteworthy files

• [src/app/page.tsx](src/app/page.tsx) - The React frontend that renders the home page in the browser
• [src/app/api/predictions/route.ts](src/app/api/predictions/route.ts) - The backend API endpoint that calls Replicate's API to create a prediction
• [src/app/api/predictions/[id]/route.ts](src/app/api/predictions/[id]/route.ts) - The backend API endpoint that calls Replicate's API to get the prediction result

Usage

Get a copy of this repo:

npx create-next-app --example https://github.com/replicate/getting-started-nextjs-typescript your-project-name
cd your-project-name

Install dependencies:

npm install

Add your Replicate API token to .env.local:

REPLICATE_API_TOKEN=

Run the development server:

npm run dev

Open http://localhost:3000 with your browser.

For detailed instructions on how to create and use this template, see replicate.com/docs/get-started/nextjs