Step 02 of 10 2-3 weeks· advanced
Step 2: Reshape Architecture for Multi-User Web
Redesign the app for the web before migrating any code. The most important phase — get this wrong and you ship a desktop app rendered in a browser.
Recommended prompts
Use one of these to do the work in your IDE
Open the template to read it in full. Click Copy prompt to grab it (with your stack values pre-filled where they apply) — then paste into Claude Code, Cursor, or wherever you build.
Recommended skills
Drop these into Claude Code for this phase
Skills auto-trigger on the right kind of request. Install once; they apply to every prompt that fits.
Recommended MCP configs
Wire these tools into Claude Code first
MCP servers give Claude Code direct access to external systems (Jira, browsers, databases). Configure once.
When you're done
Verify these in your own work before moving on
This is a checklist for you to mentally tick off in your repo and IDE — the site doesn't track it, you do.
- Target architecture documented
- 5-10 ADRs covering: concurrency, state, auth, multi-tenancy, files, printing, real-time, responsive
- UX redesign approach decided (1:1 port vs ground-up redesign vs hybrid)
- Component library / design system chosen (shadcn for React, PrimeNG for Angular, etc.)
- Performance targets set (load time, interaction latency)
Common pitfalls
What goes wrong at this step
- 1:1 port mentality — porting WinForms patterns directly produces a bad web app
- No UX redesign — desktop UX (modals everywhere, dense data grids) doesn't translate
- Skipping the multi-tenant question — adding multi-tenancy later is much harder than designing it in
- Ignoring mobile — even if "users will use desktop," tablet and phone use cases emerge