{"slug": "show-dev-i-built-a-3d-circuit-simulator-in-three-js", "title": "Show Dev: I built a 3D circuit simulator in Three.js", "summary": "A developer has built a browser-based 3D circuit simulator using Three.js, React 19, TypeScript, and Vite, with an Express backend on Render and Firebase for authentication and data storage. The tool supports DC steady-state simulation and includes an AI helper panel powered by Gemini 2.5 Pro, but lacks full transient and AC analysis found in SPICE-based tools.", "body_md": "**Post Body:**\n\nPut together a browser-based 3D circuit simulator over the last few weeks: [https://luvaai.in](https://luvaai.in)\n\nThe idea was to make something zero-install where you can just open a tab, drop components on a breadboard in 3D, wire them up, and run a quick simulation without signing up or dealing with desktop software like Multisim or LTspice.\n\n**How it's built**\n\nThe frontend is **React 19, TypeScript, and Vite, with Three.js** handling the 3D canvas and raycasting for component placement. State is managed with Zustand (Redux was overkill for this).\n\nOn the backend, it's Express hosted on Render proxying Gemini 2.5 Pro for an AI helper panel that checks circuit state, plus Firebase for Google auth and saving designs to Firestore. I also wrote a build-time pre-renderer in scripts/prerender.tsx so the /learn tutorial pages generate static HTML for crawlers instead of rendering blank SPA shells.\n\n**What it can and can't do**\n\nIt doesn't comes NEAR SPICE level simulation.\n\nThe simulation handles DC steady-state math — Ohm's law, series/parallel networks, Kirchhoff's voltage law, and basic component behavior including capacitors and inductors.\n\nWhere it falls short compared to something like LTspice or ngspice is full transient and AC frequency-domain analysis. The component library is also still growing since modeling and rigging custom 3D connection points in Three.js takes a while solo, and touch controls on mobile are rough for wiring.\n\nLive at [https://luvaai.in](https://luvaai.in) if anyone wants to check out the 3D interaction or run some circuits. Feedback on the Three.js performance or wire routing UX is welcome", "url": "https://wpnews.pro/news/show-dev-i-built-a-3d-circuit-simulator-in-three-js", "canonical_source": "https://dev.to/pankaj_gupta_0a01a1f6ba71/show-dev-i-built-a-3d-circuit-simulator-in-threejs-1nj", "published_at": "2026-08-26 03:10:45+00:00", "updated_at": "2026-08-26 03:43:08.600903+00:00", "lang": "en", "topics": ["developer-tools"], "entities": ["Three.js", "React", "TypeScript", "Vite", "Express", "Render", "Firebase", "Gemini 2.5 Pro"], "alternates": {"html": "https://wpnews.pro/news/show-dev-i-built-a-3d-circuit-simulator-in-three-js", "markdown": "https://wpnews.pro/news/show-dev-i-built-a-3d-circuit-simulator-in-three-js.md", "text": "https://wpnews.pro/news/show-dev-i-built-a-3d-circuit-simulator-in-three-js.txt", "jsonld": "https://wpnews.pro/news/show-dev-i-built-a-3d-circuit-simulator-in-three-js.jsonld"}}