Code & Dev Compatible: claude

Passkey Registration and Sign-In Outline

Complexity Level: Beginner
Prompt Code Block

Outline passkey registration and sign-in for our app. Use the platform APIs and a well-known server library. This is an implementation plan, not a novel protocol. APP Users already have: [PASSWORD | MAGIC LINK | NOTHING] Library preference: [SIMPLEWEB AUTH | OTHER | UNSURE] Where credentials are stored: [DATABASE] DELIVER 1) The registration ceremony in steps: logged-in user, server challenge, browser create, server verifies and stores credential id and public key. What we store and what we never store (the private key). 2) The sign-in ceremony: identifier if needed, challenge, browser get, verify signature and counter. 3) The recovery story: a passkey is not a password reset. What the backup factor is, because I must name one: [EMAIL LINK | ANOTHER PASSKEY | SUPPORT]. If I left it blank, stop and make me choose before writing the happy path only. 4) UX copy points: what the system dialog will say, and the screen we show when the device has no platform authenticator. 5) Threats this does not remove: a phished session after login, a stolen logged-in device. One sentence each. Do not invent a custom crypto scheme. Do not ask the user to type the private key.

🌟 Example Output / Preview

### Generated Component Preview: ```typescript // Fully validated modern structure import { z } from 'zod'; export const RequestSchema = z.object({ id: z.string().uuid(), createdAt: z.date().default(() => new Date()), data: z.record(z.string(), z.any()) }); export type ValidatedRequest = z.infer<typeof RequestSchema>; ```

Prompt Metadata

DifficultyBeginner
Compatibilityclaude

Primary Use Cases:

  • •Legacy code modernization & technical refactoring
  • •Full-stack layout generation & component structuring
  • •CI/CD workflow automation & unit/E2E testing suites

Associated Tags:

#passkeys #webauthn #auth #typescript

💡 Pro Tips & Advice

1. Use bracketed items: Be sure to fill out all [PLACEHOLDER] elements with specific details before sending the prompt to the AI model.

2. Adjust temperature: For creative tasks, set AI temperature higher (e.g., 0.8), or lower (e.g., 0.2) for strict coding/technical tasks.

🔗 Related AI Prompts

Code & Dev
★ Featured

Full SaaS Landing Page Build Spec (SEO + Conversion)

You are a Staff Product Designer + Frontend Engineer + SEO strategist. Build a complete, production-ready marketing landing page f...

Compatible:claudeDiff:Advanced
#landing-page #saas #seo #nextjs #tailwind
Code & Dev
★ Featured 🔥 Trending

SaaS Analytics Dashboard Full Build Spec

You are a Principal Product Designer + Frontend Lead. Design and specify a complete [LIGHT | DARK] analytics dashboard for [PRODUC...

Compatible:claudeDiff:Intermediate
#dashboard #saas #ui #tailwind #seo
Code & Dev

SaaS Admin Panel Dashboard Build Spec

Design a full internal Admin Dashboard for [PRODUCT_NAME] used by [ADMIN_ROLE: support | ops | super-admin]. --- 🎯 CONTEXT Adm...

Compatible:claudeDiff:Intermediate
#admin #dashboard #saas #crud #tailwind