Leadline Architecture Design
A practical front-end architecture — layers, modules, patterns, and shared vocabulary for Leadline applications
Leadline Architecture Design (LAD) is a set of architectural practices for modern front-end codebases: maintainable structure without requiring deep software-architecture expertise. It was inspired by Feature-Sliced Design and is adapted for how we build at Leadline.
LAD is documented as a beta methodology; patterns and terminology may evolve.
Start here
Overview
What LAD is, which problems it solves, and core values (pragmatism, graduality, shared language).
Quick start
Layers (root, features, services, shared), modifications, module structure, and dependency rules.
Naming conventions
Case styles for components, files, hooks, props, handlers, and boolean state in React and TypeScript.
Commit conventions
Conventional Commits — structured subjects, scopes, and links to the official specification.
Deep dive
Core concepts — abstraction, Miller's wallet, and dedicated topics on abstractness, reliability, readability, reusability.
Patterns
Design patterns, React-oriented guidance, and common anti-patterns.
Terms
Glossary entries used across LAD documentation.
Design system
@leadline-inc/design-system — Ant Design foundation and atomic-design organization.
Architecture hub
Short map of LAD in the wider system and links to deeper pages.
Related areas (other doc tabs)
- Back-end API overview — HTTP APIs and integration boundaries.
- Security — including SSDLC and Authentication.
- Observability — including Logging and Monitoring stack.