React
Langflow is a visual flow-based IDE and runtime for building AI applications by composing LLM chains, agents, RAG pipelines, and tool integrations as directed graphs. It provides a React-based drag-and-drop canvas frontend backed by a Python FastAPI server that executes these flows as computational graphs with 100+ pre-built component integrations (OpenAI, vector stores, document loaders, etc.).
Tech Stack
Key Features
- Visual Flow Graph Editor
- LFX Graph Execution Engine
- 100+ Component Integrations
- Custom Component Framework
- REST API with OpenAI-Compatible Endpoints
- Agentic AI System with MCP
- Service Layer (Auth, Database, Cache, Tracing, Storage)
- Starter Projects & Initial Setup
- Component Index & Versioning
- Comprehensive Testing Infrastructure
Coding Conventions
Standards and patterns used in this codebase
The codebase follows a layered monorepo architecture with clear separation between backend core (langflow-base), graph engine (LFX), and frontend, with mirrored module structures (schema, services, custom) between backend and LFX packages.
Both src/backend/base/langflow/schema and src/lfx/src/lfx/schema exist as parallel schema definitions; services are similarly mirrored.REST API endpoints are organized into versioned directories (v1, v2) under the api module, supporting incremental API evolution.
API routes are split into src/backend/base/langflow/api with v1 and v2 subdirectories.Database models use SQLModel and database migrations are managed via Alembic with dedicated migration validation scripts.
Models live in services/database/models; migrations in langflow/alembic.Components follow a base-class hierarchy: abstract base classes per category (IO, models, agents, tools) in the base module, with 100+ concrete implementations in LFX components. Component metadata is pre-indexed via a build script for fast startup.
Base classes in src/backend/base/langflow/base and src/lfx/src/lfx/base; concrete components in src/lfx/src/lfx/components; index built by scripts/build_component_index.py.Python scripts in the scripts/ directory serve as CI/CD tooling: building component indexes, tracking hash histories for versioning, validating CI filter coverage for changed files, and checking for deprecated imports via pre-commit hooks.
scripts/check_changes_filter.py ensures all changed frontend files are covered by CI glob patterns; scripts/check_deprecated_imports.py is a pre-commit hook scanning for deprecated langchain imports.Documentation uses Docusaurus with Tailwind CSS, Babel, TypeScript type declarations for SCSS/path aliases, and a structured sidebar configuration defining the full navigation hierarchy.
docs/docusaurus.config.js configures theme, plugins, and URL redirects; docs/sidebars.js defines navigation; docs/tailwind.config.js adds Tailwind; docs/index.d.ts provides TS module declarations.Frontend tests use Jest with jsdom environment, TypeScript support, and comprehensive mocking of browser APIs and external dependencies in a centralized setup file.
jest.config.js configures jsdom environment and coverage reporting; jest.setup.js mocks globals and browser APIs.Deprecated import patterns (specifically langchain imports) are actively detected and blocked via automated pre-commit hook scripts that scan Python files.
scripts/check_deprecated_imports.py scans for deprecated langchain import patterns and fails the commit if found.Backend services are organized as discrete, named service modules (auth, database, cache, tracing, storage, telemetry) under a services directory, promoting separation of concerns and independent testability.
Each service (auth, cache, tracing, etc.) is a separate module under src/backend/base/langflow/services/.Component versions are tracked via content hashing with a hash history file maintained across stable and nightly release channels, enabling change detection and compatibility tracking.
scripts/build_hash_history.py builds and maintains hash history across stable and nightly versions.