Web App · version 1.0

Events Logger

A self-hosted event tracking dashboard. Push events from any app via REST API or CLI, visualize activity with charts, and monitor KPI insight cards. Built with Astro, HTMX, Alpine.js, SQLite, and Drizzle.

AstroHTMXAlpine.jsSQLiteDrizzleChart.jsCommander
View on GitHubDownload ZIPRead the docs

The full source, tests, and documentation live in the public repository. MIT licensed. Issues and pull requests are off: fork it and make it yours.

Join the Flavio Copes newsletter

Join the newsletter to access my complete download library of books and courses. I’ll also email you when I publish new software, and about building products with AI and my courses. You can unsubscribe anytime.

Your email is stored on a secure server in the EU. Every email has an unsubscribe link. Unsubscribing stops future emails; you can keep using the public download library.

Why I built this

I wanted to know what was happening across my apps — signups, deploys, errors, sales — without sending data to a third-party analytics service.

Events Logger is a self-hosted dashboard with a REST API and CLI. Push events from any language, categorize them with tags, track KPIs with insight cards, and keep every record in a local SQLite database.

From any app to one local dashboard

Push an event. See it. Chart it. Track the KPI.

  1. Create a project and copy the API key.
  2. Push events with HTTP or the included CLI.
  3. Watch the live feed, charts, and insight cards.
  4. Load demos or export your data anytime.

Features

Real-time event feed

Push events from any app and see them appear in a chronological stream with search, category filters, favorites, and HTMX auto-refresh.

REST API + CLI

Publish with a simple POST or the included CLI. Code examples cover JavaScript, Python, PHP, Ruby, and Go.

Insight dashboard cards

Upsert KPI cards by title so the same call updates the value — users online, revenue, sessions, or any metric you care about.

Charts & analytics

See event frequency by category over time with Chart.js, then filter by date range or category.

Multi-project support

Create separate projects for different apps. Each project has its own feed, charts, insights, and settings.

Interactive playground

Test event publishing with a built-in form, inspect the raw API call, and copy a language-specific snippet.

Demo scenarios

Four pre-built scenarios with 1800+ events for e-commerce, SaaS, DevOps, and content platforms.

Export & import

Export JSON backups, load demos, or merge data through the CLI without locking yourself into a hosted vendor.

Use cases

Product analytics

Track signups, feature usage, and conversion events without sending product data to a third party.

DevOps monitoring

Log deploys, build results, incidents, and releases from CI and see status in one feed.

E-commerce tracking

Monitor orders, payments, cart events, and support tickets as they happen.

Indie project dashboard

Watch waitlist signups, feedback, and revenue milestones for a side project from one local board.

Team activity log

Push events from internal tools and keep categories and tags organized for later review.

Content platform metrics

Track posts, subscriber growth, newsletter opens, and traffic sources in a custom dashboard.

Tech stack

Application

Astro

SSR pages, API routes, and HTML partials live in one project with the Node adapter.

Live updates

HTMX

Powers feed polling, search, filters, and partial page updates without a SPA framework.

Client interactivity

Alpine.js

Handles sidebar state, playground forms, dropdowns, and notification preferences.

Persistence

SQLite + Drizzle

Single-file storage with a typed schema, auto-create on startup, and simple local backups.

Visualization

Chart.js

Renders activity and category charts on the analytics page only.

CLI

Commander

Creates projects, pushes events, upserts insights, and imports or exports demo data.

API overview

The dashboard exposes a JSON API at your own base URL. Create projects, ingest events, query the live feed, update KPI insight cards, and read chart aggregates without sending product data to a third-party analytics service.

Authentication: Events Logger generates one global API key on first run and shows it on the home page. Send it as a Bearer token for project creation, event ingestion, and insight updates. Read-only endpoints need no key.

curl -X POST http://localhost:4321/api/events \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer ev_your-api-key" \
  -d '{
    "project": "q4q8nb18qc2i",
    "category": "orders",
    "title": "Order Placed",
    "description": "Order #1234 placed",
    "user_id": "user-456",
    "tags": { "amount": "89.99", "currency": "USD" }
  }'
MethodPathAuthPurpose
POST/api/projectsAPI keyCreate a project and return its ID.
GET/api/projectsPublicList every configured project.
POST/api/eventsAPI keyPush an event into a project feed.
GET/api/eventsPublicQuery events by project, category, search, limit, or cursor.
POST/api/insightAPI keyCreate or update a KPI card by project and title.
GET/api/chartsPublicRead event counts grouped by category and day.
POST/api/events/:id/favoriteDashboardToggle an event as a feed favorite.
POST/api/events/:id/deleteDashboardDelete an event from the local database.

CLI

The repository includes a Commander CLI for people, scripts, and coding agents. Server-backed commands talk to the local dashboard; export and load work directly on the SQLite file.

node cli/index.js init --api-key ev_… --name "my-app"

Create a project through the running dashboard.

node cli/index.js push --api-key ev_… --project <id> --category signups --title "User Registered"

Push an event into a project feed.

node cli/index.js insight --api-key ev_… --project <id> --title "Online Users" --value 28

Create or update a KPI insight card.

node cli/index.js load --file demos/all-scenarios.json

Load the four demo scenarios with sample events.

node cli/index.js export --file backup.json

Export projects, events, and insights to JSON.

Screenshots and demos

Events Logger feed showing QuickShop signups, payments, and orders with category filters
Events Logger feed showing QuickShop signups, payments, and orders with category filters. Open the full-size image.
Events Logger charts with daily activity and category distribution for the last 30 days
Events Logger charts with daily activity and category distribution for the last 30 days. Open the full-size image.
Events Logger insight cards tracking online users, sales, and order metrics
Events Logger insight cards tracking online users, sales, and order metrics. Open the full-size image.
Events Logger playground for testing event publishing and copying API snippets
Events Logger playground for testing event publishing and copying API snippets. Open the full-size image.
Events Logger home page listing QuickShop, LaunchPad SaaS, DeployBot, and BlogWave projects
Events Logger home page listing QuickShop, LaunchPad SaaS, DeployBot, and BlogWave projects. Open the full-size image.

What’s included

  • Events Logger version 1.0 with complete Astro + HTMX + Alpine.js source
  • REST API with CRUD for events, insights, and projects
  • CLI tool for pushing events, managing insights, and loading demos
  • Drizzle ORM schema with auto-migration on startup
  • SQLite database with zero-config local setup
  • Four demo scenarios with 1800+ sample events
  • A README with the build story, architecture, decisions, customization, deployment, configuration, and security guides, plus AGENTS.md for coding agents

Documentation

The documentation lives in the repository, in one README: setup and usage, why I built it, how it was built, architecture, configuration, deployment, customization, security, the technical decisions, and the changelog. AGENTS.md gives coding agents the project context and operating rules.

Read the README on GitHub →

Why use this

  • See what is happening across your apps in one self-hosted place
  • Keep analytics data on your machine instead of a third-party SaaS
  • Push events from any language with a single HTTP call or the included CLI
  • Study a real Astro SSR + HTMX + Alpine.js product with API auth and pagination
  • Give an AI coding agent architecture, API docs, and customization guidance
  • Own the complete source with no subscription

Customize it

Use the working source as a foundation. Keep it small, change it for your own workflow, or turn it into a different product.

  1. Grow it into a self-hosted product-analytics suite: funnels, cohorts, retention views, and shareable dashboards per project.
  2. Offer agencies a white-label event inbox so every client launch, deploy, and signup lands in one branded place.
  3. Add Slack, email, or webhook alerts when revenue, errors, or launches cross a threshold you define.
  4. Layer multi-user auth and roles so a small team can own feeds without shipping data to a third-party SaaS.
  5. Turn insight cards into a public status or launch page your customers can bookmark.
  6. Point an AI agent at the architecture docs and rebuild the same idea on Postgres, Next.js, or your preferred stack.

MIT license

The repository includes an MIT LICENSE file. You can use, copy, change, publish, distribute, sublicense, or sell the code, including as part of a commercial product.

Keep the copyright and license notice with copies or substantial portions of the code. Third-party dependencies and assets keep their own licenses.

Keep learning

Bootcamp

Study a complete Astro, HTMX, Alpine.js, API, and database application while learning full-stack development.

Explore Bootcamp →

Join the Flavio Copes newsletter

Join the newsletter to access my complete download library of books and courses. I’ll also email you when I publish new software, and about building products with AI and my courses. You can unsubscribe anytime.

Your email is stored on a secure server in the EU. Every email has an unsubscribe link. Unsubscribing stops future emails; you can keep using the public download library.