Technology

Copy-Paste Prompts for Every Stage of Web and App Development

A reusable prompt library for web and app developers, covering architecture, frontend, backend, mobile, debugging, and deployment. Built for working developers, not demos.

22 minutes ago · 6 mins read
Summarize and analyze this article with:
Share this

If you've been using AI tools like Claude, ChatGPT, or Cursor on real projects, you already know how much the prompt changes the output. A vague prompt gets you vague code. A precise one gets you something you can actually use.

The problem is most developers don't save their good prompts. They retype variations of the same thing every week, or paste in a rough description and spend 15 minutes nudging the output toward what they actually wanted. That's time you don't have.

A prompt library is a collection of reusable prompts organized by task. That's it. But having one changes how quickly you move once you've built it out across your stack.

Here's a working set, organized by area.


Planning and Architecture

Prompts that force the AI to think through structure before writing code. Worth using early.

System design brief

You are a senior software architect. I'm building [app description]. The stack is [your stack]. Expected user volume: [low/medium/high]. Walk me through a system design: modules to build, how they communicate, what database schema makes sense, and risks I should design around now. Be specific. Skip generic advice.

Database schema review

Here is my database schema: [paste schema]. I'm building [feature]. Review this for: normalization issues, missing indexes, fields that will cause problems at scale, and anything that was designed for MVP but will need reworking. Flag what to fix before going further.

Feature scoping

I want to build [feature]. Stack: [stack]. Break this down: what's needed on the frontend, what's needed on the backend, what API contracts are involved, edge cases to handle, and a rough time estimate by part. Don't pad the scope. Be honest about what's hard.

Frontend Development

React component from requirements

Build a React component for [description]. Requirements: [list]. Functional components with hooks. No class components. Tailwind for styles. TypeScript. Default export. Add prop types. Don't over-engineer it.

Responsive layout

I need a responsive layout for [page/section]. Breakpoints: mobile 375px, tablet 768px, desktop 1280px. Use Grid or Flexbox as fits. Tailwind or plain CSS (I'll specify). Design brief: [describe].

Fix a UI bug

Here's my component: [paste code]. The issue: [what's happening vs what should happen]. Browser: [browser]. Find the exact cause, explain it briefly, give me the fixed code.

API integration on the frontend

Integrate this endpoint: [endpoint]. Expected response shape: [paste or describe]. Write the fetch/axios call with loading, error, and success states using React hooks. Handle: empty response, network error, 4xx, 5xx.

Backend Development

REST API endpoint

Write a [GET/POST/PUT/DELETE] endpoint for [purpose] in [framework]. Include: route definition, input validation, database query or ORM call, error handling, and a success response. Auth: [JWT/session/none]. DB: [PostgreSQL/MySQL/MongoDB].

Slow query fix

Here's a slow query: [paste query]. Table size: roughly [X] rows. Schema: [paste]. Explain why it's slow, rewrite it, and suggest any indexes worth adding. Include the trade-off on each index.

Authentication flow

Write a JWT auth flow in [framework]. Include: registration, login, token generation, refresh token logic, and route protection middleware. Store tokens in [httpOnly cookies/localStorage]. Basic validation included. Don't use a library that hides the core logic.

Background job

I need a background job that [describe job]. Stack: [framework + queue library]. Write the job definition, how it gets queued from the main app, and how errors are handled and retried. Production-ready, not just an example.

Full Stack Features

Multi-role RBAC

I'm building a [platform type] with these roles: [list roles and permissions]. Stack: [stack]. Design the RBAC structure: how roles are stored, how permissions are checked, how to gate API routes, and how to conditionally render UI by role. Working code, not pseudocode.

File upload

Build a file upload feature. Frontend: [framework]. Backend: [framework]. Storage: [S3/local/Cloudinary]. Requirements: [max size, allowed file types]. Include: upload UI with progress, backend endpoint, storage logic, error handling. Return the file URL on success.

Search with filters

I need search for [entity]. Database: [type]. Filters: [list]. Write a backend query that handles all filter combinations including empty state, and is safe from injection. Add an index recommendation if the query warrants it.

Mobile App Development

React Native screen

Build a [screen name] screen in React Native. Purpose: [what it does]. Data from: [API or local state]. Navigation: [where user comes from, where they go]. Style for iOS and Android. Functional components only.

Offline handling

My React Native app needs to work offline for [feature]. Using [AsyncStorage/MMKV/etc]. Write the logic to: cache data locally, detect network state, sync on reconnect, and give the user accurate UI feedback throughout.

Code Review and Debugging

Code review

Review this code: [paste]. Focus on: logic errors, security issues, performance problems, and anything that passes in dev but fails in production. Skip the praise. Just flag issues and give fixes.

Debugging an error

Error: [paste full error and stack trace]. Code: [paste]. What's causing this and how do I fix it? If there are multiple possible causes, rank them by likelihood.

Refactor for readability

Refactor this for readability and maintainability: [paste code]. Don't change the behavior. Reduce nesting, improve naming, extract helper functions where it makes sense. Show before and after with a short note on each change.

DevOps and Deployment

Dockerfile

Write a production-ready Dockerfile for a [framework] app. Runtime version: [specify]. Requirements: multi-stage build, non-root user, correct env variable handling, optimized image size. App runs on port [port].

GitHub Actions CI pipeline

Write a GitHub Actions workflow for a [framework] project. Runs on: push to main and PRs. Steps: install dependencies, run tests, run linter, [deploy step if applicable]. Keep it simple and fast.

Storing and Actually Using This

Save these in Notion, a markdown file, a VS Code snippets file, or wherever you already spend time. The goal is under 30 seconds to find and open one when you need it.

Customize the bracketed placeholders for your stack once and save project-specific versions. After a few months you'll have a set that covers most of what you prompt for day to day without rewriting from scratch each time.

These prompts work for the same reason any good brief works: they tell the other party what you need, in what format, with what constraints. That's it. The more context you give, the less time you spend fixing what comes back.

Read next

The Stack That Keeps Winning: Why Boring Tech Still Ships

Every year there is a new framework, a new runtime, a new way of doing the thing you already know how to do. And every year, some of the most successful products on the internet quietly ship on the same stack they were using three years ago.

Apr 11 · 1 min read