skills.rest
OpenSourceAGI
OpenSourceAGIOFFICIAL
Explore all skills by this author →
GitHub

project-overview

Maps the LobeHub monorepo architecture, directory layout, and tech stack for code navigation.

74|11|Updated Jul 4, 2024
Search Tags:#architecture#onboarding#next.js#code navigation#monorepo#trpc#lobehub
One-click install
npx skills add https://github.com/OpenSourceAGI/qwksearch-research-agent --skill project-overview-opensourceagi
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: project-overview
Source: https://github.com/OpenSourceAGI/qwksearch-research-agent/tree/main/apps/qwk-in-lobe/.agents/skills/project-overview
Command: npx skills add https://github.com/OpenSourceAGI/qwksearch-research-agent --skill project-overview-opensourceagi

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Navigating a large monorepo like LobeHub is difficult without knowing where code layers live. This Skill provides a curated architecture map so you can quickly locate apps, packages, stores, routers, and database layers without scanning the entire tree. ## Core Features & Use Cases - Architecture Map: Tables mapping each layer (UI, stores, tRPC routers, DB schemas) to its exact directory location. - Tech Stack Reference: Lists the full stack including Next.js 16, React 19, zustand, tRPC, Drizzle ORM, and Vitest. - Data Flow & Cloud Relationship: Documents the React UI to PostgreSQL data flow and how the private cloud repo overrides open-source stubs. - Use Case: When onboarding to the LobeHub repository or locating where a tRPC router, zustand store, or Drizzle schema lives, consult this map instead of searching the whole repo. ## Quick Start Ask the agent to explain where a specific layer of the LobeHub codebase lives, such as where tRPC routers or database schemas are located.

Frequently Asked Questions about project-overview

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I find where code lives in the LobeHub monorepo?▼

Use the architecture map table that maps each layer to its location: UI components in src/components and src/features, zustand stores in src/store, tRPC routers in apps/server/src/routers, and DB schemas in packages/database/src/schemas.

What tech stack does LobeHub use?▼

LobeHub uses Next.js 16 with React 19, TypeScript, zustand for state, tRPC for type-safe APIs, Drizzle ORM with Neon PostgreSQL, antd-style for CSS-in-JS, and Vitest for testing. Exact versions are in the root package.json.

How is the LobeHub monorepo structured?▼

It uses a flat layout with apps/ (cli, desktop, server), packages/ (around 80 @lobechat workspace packages), and src/ (routes, spa, features, store, services) all at the repo root, with no git submodules.

What are the business stubs in src/business and packages/business?▼

They are open-source placeholder implementations that the private cloud repo overrides with real implementations. When working in the open-source repo alone, these stubs are the source of truth and the cloud layer can be ignored.

Does the LobeHub repo include the mobile app?▼

No. The React Native mobile app lives in a separate repository and has already launched. This monorepo contains the web app and the Electron desktop app under apps/desktop.

Related Skills

Explore More Software Engineering Skills→
glacyglacy

nx-workspace

Inspect Nx workspace projects, configurations, targets, and dependencies.

Community
Intermediate
devturcodevturco

add-feature

Add fullstack features with Zod 4, Drizzle, tRPC, and TanStack Router.

Community
Advanced
thinking-machines-labthinking-machines-lab
4.0k

contributing

Provides a guide for setting up, coding, and contributing to tinker-cookbook.

Official
Intermediate
aimskraimskr

code-explorer

Trace code execution paths and map architecture using LSP tooling.

Official
Advanced