Frontend · ChatGPT and the OpenAI API
Next.js 16 App Router OpenAI Custom Instructions
Custom instructions for ChatGPT and the OpenAI API, for Next.js 16 App Router work.
- Path
- prompts/openai-custom-instructions.md
- Loads
- Pasted or sent per request
- Format
- Markdown (.md)
- Used by
- ChatGPT and the OpenAI API
What this file tells the agent
Custom instructions in ChatGPT, a Project or the API tell the model your Next.js 16 App Router conventions up front: concise diffs, validation at the boundaries and explicit error handling.
- Enforce React Server Components (RSC) by default; restrict 'use client' strictly to interactive leaf components.
- Mutate state exclusively via Server Actions with Zod safeParse validation.
- Await the async request APIs (cookies(), headers(), params, searchParams); Next.js 16 removed the sync forms.
- Avoid pages/ directory conventions or legacy getServerSideProps.
- Colocate loading.tsx and error.tsx for dynamic route segments.
Code to avoid, and what to write instead
The rule steers the agent away from the left and toward the right.
"use client";
export function SaveItem() {
const submit = async (e: any) => {
e.preventDefault();
await fetch("/api/items", { method: "POST", body: JSON.stringify({ title: "Test" }) });
};
return <button onClick={submit}>Save</button>;
}"use server";
import { z } from "zod";
import { db } from "@/lib/db";
const Schema = z.object({ title: z.string().min(3) });
export async function createItem(formData: FormData) {
const parsed = Schema.safeParse(Object.fromEntries(formData));
if (!parsed.success) return { ok: false, errors: parsed.error.flatten().fieldErrors };
await db.item.create({ data: parsed.data });
return { ok: true };
}Install it in one command
- 01
Go to your project root
The file goes at prompts/openai-custom-instructions.md, relative to the root.
- 02
Download the file
Run the command on the right. It downloads this preset and writes the file.
- 03
Make sure it gets used
Nothing loads this file automatically. Paste it into ChatGPT custom instructions, a Project or a custom GPT, or send it as instructions in the API.
$ mkdir -p "prompts" && curl -fsSL "https://www.devscratchpad.tech/api/raw/openai-instructions/nextjs-16" -o "prompts/openai-custom-instructions.md"
writes prompts/openai-custom-instructions.md
prompts/openai-custom-instructions.md
To write the file from your own code instead, use Read your code or Convert Legacy Rules in the editor above.
More for Next.js 16 App Router
Questions
- Where do I apply these OpenAI instructions?
- Paste it into ChatGPT custom instructions (Settings > Personalization), a Project's instructions or a custom GPT, or send it as instructions in the OpenAI API.
- Which OpenAI models can use these instructions?
- Any current model in ChatGPT or the API. The instructions are plain text, so they work the same way whichever model you pick.