explaingit

lingliren731108-arch/leonai

16TypeScriptAudience · developerComplexity · 4/5Setup · moderate

TLDR

Leon AI is a self-hosted browser workspace where you and other users can write, edit, and run code with a real-time AI assistant powered by Claude.

Mindmap

mindmap
  root((leonai))
    What it does
      Browser code editor
      Real-time AI chat
      Live HTML preview
      Integrated terminal
    Tech Stack
      React frontend
      Python FastAPI
      WebSockets
      Anthropic Claude API
    Use Cases
      Personal coding workspace
      Multi-user dev environment
      AI-assisted prototyping
    Audience
      Solo developers
      Small teams
      Vibe coders
Click or tap to explore — scroll the page freely

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

Things people build with this

USE CASE 1

Run your own private AI coding assistant in the browser without relying on third-party cloud IDEs.

USE CASE 2

Give multiple teammates isolated workspaces on a single server so each person has their own sandboxed files.

USE CASE 3

Attach Word docs or images to a chat message and let the AI use them as context when generating code.

USE CASE 4

Use the live preview panel to instantly see how an HTML page looks at desktop, tablet, and mobile sizes.

Tech stack

TypeScriptReactPythonFastAPIWebSocketsAnthropic Claude APINode.js

Getting it running

Difficulty · moderate Time to first run · 30min

Requires Node.js, Python 3.8+, and an Anthropic API key placed in a config file before running the startup script.

No license information was mentioned in the explanation.

In plain English

Leon AI is a self-hosted development platform that wraps an AI assistant into a browser-based workspace where multiple users can write, edit, and run code with AI help. It combines a React frontend with a Python FastAPI backend, connected over WebSockets so AI responses stream in real time rather than appearing all at once after a delay. The browser interface includes a file explorer, a code editor with syntax highlighting and keyboard shortcuts for saving, a live preview panel that can render HTML pages at desktop, tablet, and mobile viewport sizes, an integrated terminal, and a chat panel where you can ask the AI to write or modify code. You can attach documents including Word files, PowerPoint presentations, and images to your chat messages, and the backend parses those files to extract text and feed it as context to the AI. Each user gets their own isolated directory on the server. File reads, writes, directory listings, and terminal commands are all restricted to that user's folder so one user cannot access another's files. The terminal blocks a set of destructive commands to reduce risk on the host system. The backend connects to the Anthropic Claude API to handle the AI assistant. When you send a message, the backend compiles your current workspace context, sends it to Claude, and streams the response back. Claude can also invoke tools: reading and writing workspace files, listing directories, creating folders, and running terminal commands inside your sandbox. An admin dashboard lets a user with admin privileges create and manage accounts. Setup requires Node.js, Python 3.8 or newer, and an Anthropic API key placed in a configuration file. A single startup script launches both the frontend and backend servers at the same time. The project also ships with prompt template files for generating product charters and requirement documents through the AI chat.

Copy-paste prompts

Prompt 1
I'm setting up Leon AI on a Linux server. Walk me through installing Node.js, Python 3.8+, getting an Anthropic API key, and running the startup script so the browser workspace is live.
Prompt 2
In the Leon AI React frontend, how does the chat panel stream AI responses in real time over WebSockets? Show me the relevant code pattern.
Prompt 3
I want to add a new tool that Leon AI's Claude backend can call, for example, searching files by content. Explain how to register a new tool in the FastAPI backend and have Claude invoke it.
Prompt 4
How does Leon AI restrict each user to their own directory so one user cannot read another's files? Walk me through the server-side sandboxing logic.
Open on GitHub → Explain another repo

← lingliren731108-arch on gitmyhub — every repo by this author, as a profile.

Verify against the repo before relying on details.