Welcome to Lab Belay - a comprehensive laboratory management system designed for scientific research facilities. This documentation will guide you through setting up, understanding, and contributing to the Lab Belay frontend application.

What is Lab Belay?

Lab Belay manages chemical inventory, equipment tracking, safety compliance, and recurring maintenance tasks with a strong focus on automated safety calculations and regulatory compliance.

Key Features

• Chemical Management: Track chemicals with NFPA 704 and GHS safety data
• Equipment Tracking: Monitor equipment with maintenance schedules
• Safety Compliance: Automated safety calculations and regulatory compliance
• Lab Management: Organize labs with QR codes and aggregated safety ratings
• Task Management: Work orders and recurring compliance tasks

Quick Navigation

Choose your path based on what you want to accomplish:

🚀 New to Lab Belay?

• Overview - Understand the architecture and technologies
• Installation - Set up your development environment
• Quick Start - Build your first feature

🏗️ Understanding the Architecture

• Frontend Architecture - Project organization and patterns
• Core Concepts - Domain model and data relationships
• Components Guide - Available UI components

🔧 Development

• Local Development - Development environment setup
• API Integration - Working with backend APIs
• State Management - React Query patterns

🎯 Core Features

• Chemical Management - Chemical inventory system
• Equipment Tracking - Equipment management
• Dashboard & Tasks - Main application interface

Technology Stack

Lab Belay uses modern web technologies:

• Frontend: Next.js 15, React 19, TypeScript, Tailwind CSS
• Backend: FastAPI, Python, PostgreSQL
• Authentication: Clerk
• UI Components: Shadcn/ui
• State Management: React Query
• Deployment: Vercel (frontend), GCP Cloud Run (backend)

Development Commands

# Frontend development (OnBelay/frontend/)
yarn install        # Install dependencies
yarn dev           # Start development server
yarn build         # Production build
yarn lint          # Run ESLint
yarn format        # Format with Prettier

# Backend development (OnBelay/backend/)
uv sync            # Install dependencies
uv run fastapi dev # Start development server
uv run pytest     # Run tests
uv run ruff check  # Lint code

Support & Contributing

• Documentation: Browse the sidebar for detailed guides
• Issues: Report bugs and feature requests on GitHub
• Development: Follow the contributing guide for code contributions

Ready to get started? Begin with the Overview to understand the system architecture, or jump to Installation to set up your development environment.