Live result overlay for live.tuloslista API streams.
- Real-time competition results display
- Clean overlay interface for streaming
- Built with Next.js and modern React
- Type-safe API with tRPC
- Styled with Tailwind CSS
- Node.js (v18 or later)
- pnpm package manager
Clone the repository and install dependencies
git clone <repository-url>
cd livetila
pnpm installCreate a .env file from the example
cp .env.example .envStart the development server with hot reload
pnpm devOpen http://localhost:3000 to view the app.
Create an optimized production build
pnpm buildPreview the production build locally
pnpm preview| Command | Description |
|---|---|
pnpm dev |
Start development server with turbo mode |
pnpm build |
Build for production |
pnpm start |
Start production server |
pnpm preview |
Build and start production server locally |
pnpm check |
Run Biome linter |
pnpm check:write |
Run Biome linter with auto-fix |
pnpm typecheck |
Run TypeScript type checking |
- Framework: Next.js 16 with App Router
- Language: TypeScript
- Styling: Tailwind CSS 4
- UI Components: shadcn/ui, Base UI
- Data fetching: tRPC with TanStack Query
- Animations: Motion, Auto Animate
- Linting: Biome
- Icons: Lucide React
.
├── src/
│ ├── app/ # Next.js app router pages
│ │ ├── (app)/ # Main application routes
│ │ ├── (overlay)/ # Overlay-specific routes
│ │ └── api/ # API routes
│ ├── @/ # Component aliases
│ ├── server/ # Server-side utilities
│ ├── trpc/ # tRPC configuration
│ ├── types/ # TypeScript types
│ └── styles/ # Global styles
├── public/ # Static assets
└── ...config files
TBD