In my latest vlog, I talk about how I create Mermaid diagrams to visualize code flow across client, server, and utility components.
Here Is How I Prompt Cursor
Goal is to map the data flow for my app
Model: Claude Sonnet 3.5 20241022
Prompt 1
Review the database connections in my code and let me know if any of the components have 'use client' in that code with this audit.
Prompt 2
Review my @Codebase for where I make sql calls
Prompt 3
are any of those files 'use client' and exposing code on the client side?
Prompt 4 with o1
In Cursor be sure to select o1 model in the dropdown of the chat.
Generate a stack diagram to show what components are server components, client components, and where the SQL and auth code is. I want to see a dataflow to make sure I am not accidentily leaking customer data.
Prompt 5 with Claude.ai
Help me create an artifact so I can see this flowchart from a code review:
paste entire output from o1 here as shown in the screenshot below