react-nextjs-ui-development-cursorrules-prompt-fil: Cursor rule
Configures Cursor for React and Next.js App Router development. Forces the agent to outline pseudocode first and maintain dual Vercel and Replit support.
.cursor/rules/react-nextjs-ui-development-cursorrules-prompt-fil.mdcWhat react-nextjs-ui-development-cursorrules-prompt-fil does
This rule constrains Cursor to browser-focused React and Next.js development. The assistant must rely strictly on the App Router. Pages Router code is strictly forbidden.
The workflow enforces planning before code execution. The assistant writes a step-by-step plan in pseudocode and waits for confirmation before coding. Generated files must be explicitly named, with an outright ban on unfinished blocks or TODO markers.
Dual-target deployment creates a strict boundary. All code must run properly on both Vercel and Replit. Readability is prioritized over performance tuning.
What it helps with
- block suggestions and boilerplate targeting Next.js Pages Router
- require step-by-step pseudocode approval before writing code
- eliminate placeholders, omitted logic, and
TODOcomments - maintain simultaneous runtime support for Vercel and Replit
Example prompts for the agent
- Draft a pseudocode plan for a dashboard metrics card in the App Router.
- Build a responsive navigation bar without any placeholders or TODOs.
- Create an API-connected form component compatible with both Vercel and Replit.
How to install react-nextjs-ui-development-cursorrules-prompt-fil
Manually: put the files in place
.cursor/rules/react-nextjs-ui-development-cursorrules-prompt-fil.mdcFrontmatter: description, globs, alwaysApply
Manually: put the files in place
.claude/rules/react-nextjs-ui-development-cursorrules-prompt-fil.mdThe paths frontmatter field limits the files: move globs from the source into paths
AGENTS.md
Codex reads AGENTS.md: paste the rule text there
Manually: put the files in place
.github/instructions/react-nextjs-ui-development-cursorrules-prompt-fil.instructions.mdThe applyTo field sets which files it applies to: move globs from the source into applyTo
Manually: put the files in place
.devin/rules/react-nextjs-ui-development-cursorrules-prompt-fil.mdManually: put the files in place
.clinerules/react-nextjs-ui-development-cursorrules-prompt-fil.mdStep by step, with commands for each platform: Cursor rules: .mdc files, four modes and what replaced .cursorrules
Questions about react-nextjs-ui-development-cursorrules-prompt-fil
How to install react-nextjs-ui-development-cursorrules-prompt-fil in Cursor?
Place the rule file at .cursor/rules/react-nextjs-ui-development-cursorrules-prompt-fil.mdc inside your project root.
Does this rule allow using Next.js Pages Router?
No, the prompt explicitly instructs the assistant never to suggest or write code using the Pages Router.
What hosting platforms does this rule target?
Every code change must remain compatible with both Vercel and Replit hosting environments.
Source text
react-nextjs-ui-development-cursorrules-prompt-fil.mdc · CC0-1.0
--- description: "Cursor rules for React development with Next.js UI integration." globs: **/* alwaysApply: false --- You are an expert AI programming assistant that primarily focuses on producing clear, readable JavaScript code for the browser. You also use the latest versions of popular frameworks and libraries such as React & NextJS (with app router). You provide accurate, factual, thoughtful answers, and are a genius at reasoning. - This project uses Next.js App Router never suggest using the pages router or provide code using the pages router. - Follow the user's requirements carefully & to the letter. - First think step-by-step - describe your plan for what to build in pseudocode, written out in great detail. - Confirm, then write code! - Always write correct, up to date, bug free, fully functional and working, secure, performant and efficient code. - Focus on readability over being performant. - Fully implement all requested functionality. - Leave NO todo's, placeholders or missing pieces. - Be sure to reference file names. - Be concise. Minimize any other prose. - If you think there might not be a correct answer, you say so. If you do not know the answer, say so instead of guessing. - Only write code that is neccessary to complete the task. - Rewrite the complete code only if necessary. - This is app is hosted on Vercel as well as Replit. Make sure your code is compatible with both!
© PatrickJS · CC0-1.0 · PatrickJS/awesome-cursorrules