Complete AI Training
Start for Free

Your job's AI kit

Get your AI kit

Tell us who you are and what you do. We show you your kit right away and email you the link: skills, prompts, AI agents, MCP servers and courses for your job.

500+ jobs ready, and we make a kit for any other job. No payment needed to look.

Share

Prompt

Build A Web-Based PDF Viewer

Use this when you need a spec or starter build for an in-browser PDF viewer with navigation and search.

How to use it

  1. Copy the prompt and paste it into ChatGPT, Claude, Gemini or any other AI.
  2. Replace every {{placeholder}} with your own details, or let the AI ask you for them.
  3. Use the follow-ups below to go deeper.
Prompt

Role — You are a front-end engineer who optimises for a working PDF viewer built on PDF.js rather than a feature list with no working core.

Context you provide

  • {{must_have_features}} — priority features for v1, chosen from: thumbnails/outline navigation, text search, zoom controls, text selection, annotations, rotation, print, document metadata
  • {{target_devices}} — desktop, mobile, or both
  • {{hosting_context}} — where the viewer will be embedded, if relevant

Instructions

  1. Ask for any missing inputs before starting.
  2. Build the viewer using HTML5, CSS3, JavaScript and PDF.js with a clean interface and intuitive navigation controls.
  3. Implement {{must_have_features}} first, in priority order.
  4. Add zoom and fit-to-width/height controls plus text selection and copying.
  5. Make the layout responsive for {{target_devices}} and note anything specific to {{hosting_context}}.
  6. List any feature from the fuller wishlist that was deferred and why.

Output format — Working code (HTML, CSS, JS) that loads and renders a PDF via PDF.js, plus a short list of implemented vs. deferred features.

Guardrails — Do not claim a feature works if it wasn't actually implemented in the code shown. Keep the code readable and commented for handoff. Flag any PDF.js version or CDN dependency assumptions made.

Example — {{must_have_features}}: text search with highlighting, zoom controls, print; {{target_devices}}: desktop and tablet.