TeleApp is a full-stack observability and analytics application designed to collect, store, and visualize telemetry data from distributed systems. Built with TypeScript, React, TailwindCSS, and ClickHouse, it provides a modern interface for exploring performance metrics and traces. The project also integrates Vercel's AI chatbot as a built-in assistant.
-
📈 Telemetry Visualization
OpenTelemetry data is collected, sent via Docker to ClickHouse, and rendered using React Flow Renderer and chart libraries. -
🧠 AI Chatbot Integration
Integrated with Vercel’s Chatbot (ai SDK) for intelligent assistant features inside the app. -
⚡ High Performance Backend
Data is ingested and queried using ClickHouse, a fast columnar OLAP DB. -
🎨 Modern Frontend Stack
- React 18 + TypeScript for scalable UI development
- TailwindCSS for modern styling
- Headless UI + Heroicons for accessibility & UI components
| Layer | Technology |
|---|---|
| Frontend | React 18, TypeScript, TailwindCSS |
| Backend | OpenTelemetry, ClickHouse (via Docker) |
| Charts/UI | React Flow Renderer, Heroicons |
| AI Chatbot | Vercel ai SDK |
| Validation | Zod |
| Hosting | Vercel (Next.js 14) |
# Clone the repository
git clone https://github.com/yourusername/teleapp.git
cd teleapp
# Install dependencies
npm install
# Run the development server on port 4000
npm run dev