Tools
Tools: Building an AI Code Analyzer with Google AI Studio (And Finishing It in Cursor)
2026-02-11
0 views
admin
What I Built ## My Experience ## The Prompt: Education Track: Build Apps with Google AI Studio This post is my submission for DEV Education Track: Build Apps with Google AI Studio. Archlyze is a browser-only SPA that uses Google Gemini to analyze source code (Rust, Python, JS/TS, Go, and more): it extracts components and dependencies, flags issues with severity, suggests fixes and unit tests, and generates flowcharts/UML/data-flow diagrams via gemini. We started from a detailed prompt in AI Studio (refined with Perplexity and Gemini), then finished and extended the app in Cursor with folder import, .gitignore parsing, session history, model selection, and Markdown export. ! I ran out of free tier credits, so don't have a screenshot with images yet, will upload to the github when i have. apparently it can take from moments to a few weeks to get billing on your google api. https://archlyze.vercel.app/ Starting in AI Studio. We began by drafting the concept and prompt with different models (Perplexity and Gemini), then took it into Google AI Studio to build the first version. We hit a recurring issue early on: React and tooling versions. The generated app kept failing to run or build, and we had to iterate many times (10+ attempts) before we got a working setup. Evolving the idea. Once the base was stable, we shifted from Rust-only to multi-language support and added a lot of features: folder import, .gitignore-aware filtering, session history, dependency detection, issue severity, auto-fix, unit test generation, and diagram types. Doing this in Cursor (with the same codebase) felt natural: AI Studio gave us the initial structure and Gemini integration; Cursor helped us refactor, extend, and keep the code consistent. Structured output and “thinking” models. The biggest technical takeaway was relying on a strict JSON schema for analysis. Without explicit required fields and clear descriptions in the responseSchema, Gemini 2.5 sometimes returned minimal or inconsistent JSON. Once we defined the schema properly, the analysis results became reliable enough to drive the UI (components, issues, dependencies). I also learned that Gemini 2.5’s “thinking” phase means longer response times, so we added scaled timeouts (e.g. 60s for small files, 180s for large ones) and loading states so the app doesn’t feel broken while the model is reasoning. Surprises. (1) How much the app could do without a backend, API key in the browser, direct calls to Gemini, and LocalStorage for settings and theme made the architecture simple. (2) Image generation (`gemini-2.5-flash- Overall, the track was a solid way to go from “idea + prompt” to a real SPA: AI Studio for fast prototyping and Gemini integration, then Cursor to harden and extend it into something we’d actually use. Repo:
https://github.com/OlaProeis/Archlyze Try it:
https://archlyze.vercel.app/ Templates let you quickly answer FAQs or store snippets for re-use. Are you sure you want to hide this comment? It will become hidden in your post, but will still be visible via the comment's permalink. Hide child comments as well For further actions, you may consider blocking this person and/or reporting abuse CODE_BLOCK:
Build 'RustFlow Analyzer'—a web app for comprehensive Rust file analysis. Users upload a .rs file (max 500 lines) or paste code. Gemini 1.5 Pro performs deep analysis: extract all functions, structs, traits, impls; map dependencies and call relationships; identify ownership patterns, error handling, and common anti-patterns (unnecessary clones, unwrap() abuse, missing lifetimes). Display results in three panels: Code View: Original code with syntax highlighting (Monaco editor), clickable line numbers to jump to explanations Analysis Panel: Collapsible sections for each major code block (functions/structs) with plain-English explanations, detected issues marked with warning/error badges, and best-practice suggestions Visual Panel: Use Imagen to generate architecture diagrams—function call graphs (boxes + arrows showing invocation flow), struct relationship diagrams (ownership/borrowing visualized with solid/dashed lines), and module dependency trees. Include toggle buttons for diagram types (flowchart, UML, data flow). Style: professional developer docs aesthetic, Rust brand colors (orange #CE422B, dark gray), clean minimalist lines. Features: file upload (.rs), smart truncation warning if >500 lines, 'Regenerate Diagram' button for each section, export full report as HTML with embedded images, dark/light theme, example files (basic HTTP server, CLI parser, async tokio app). Add 'Share Analysis' to generate unique URL with results cached. Loading states with progress indicators, error handling for invalid Rust syntax or oversized files. Deploy-ready SPA with responsive mobile layout Enter fullscreen mode Exit fullscreen mode CODE_BLOCK:
Build 'RustFlow Analyzer'—a web app for comprehensive Rust file analysis. Users upload a .rs file (max 500 lines) or paste code. Gemini 1.5 Pro performs deep analysis: extract all functions, structs, traits, impls; map dependencies and call relationships; identify ownership patterns, error handling, and common anti-patterns (unnecessary clones, unwrap() abuse, missing lifetimes). Display results in three panels: Code View: Original code with syntax highlighting (Monaco editor), clickable line numbers to jump to explanations Analysis Panel: Collapsible sections for each major code block (functions/structs) with plain-English explanations, detected issues marked with warning/error badges, and best-practice suggestions Visual Panel: Use Imagen to generate architecture diagrams—function call graphs (boxes + arrows showing invocation flow), struct relationship diagrams (ownership/borrowing visualized with solid/dashed lines), and module dependency trees. Include toggle buttons for diagram types (flowchart, UML, data flow). Style: professional developer docs aesthetic, Rust brand colors (orange #CE422B, dark gray), clean minimalist lines. Features: file upload (.rs), smart truncation warning if >500 lines, 'Regenerate Diagram' button for each section, export full report as HTML with embedded images, dark/light theme, example files (basic HTTP server, CLI parser, async tokio app). Add 'Share Analysis' to generate unique URL with results cached. Loading states with progress indicators, error handling for invalid Rust syntax or oversized files. Deploy-ready SPA with responsive mobile layout CODE_BLOCK:
Build 'RustFlow Analyzer'—a web app for comprehensive Rust file analysis. Users upload a .rs file (max 500 lines) or paste code. Gemini 1.5 Pro performs deep analysis: extract all functions, structs, traits, impls; map dependencies and call relationships; identify ownership patterns, error handling, and common anti-patterns (unnecessary clones, unwrap() abuse, missing lifetimes). Display results in three panels: Code View: Original code with syntax highlighting (Monaco editor), clickable line numbers to jump to explanations Analysis Panel: Collapsible sections for each major code block (functions/structs) with plain-English explanations, detected issues marked with warning/error badges, and best-practice suggestions Visual Panel: Use Imagen to generate architecture diagrams—function call graphs (boxes + arrows showing invocation flow), struct relationship diagrams (ownership/borrowing visualized with solid/dashed lines), and module dependency trees. Include toggle buttons for diagram types (flowchart, UML, data flow). Style: professional developer docs aesthetic, Rust brand colors (orange #CE422B, dark gray), clean minimalist lines. Features: file upload (.rs), smart truncation warning if >500 lines, 'Regenerate Diagram' button for each section, export full report as HTML with embedded images, dark/light theme, example files (basic HTTP server, CLI parser, async tokio app). Add 'Share Analysis' to generate unique URL with results cached. Loading states with progress indicators, error handling for invalid Rust syntax or oversized files. Deploy-ready SPA with responsive mobile layout
how-totutorialguidedev.toaimlserverpythongitgithub