Skip to content

What I've been shipping lately

4min read1views
PersonalPersonalBuild LogShipping

Lately I have been trying to ship smaller things more often instead of waiting until a project feels "finished." This post is a simple running note: what went out, what changed behind the scenes, what is still rough, and what I want to improve next.

It is less of a polished launch post and more of a snapshot. A place to document momentum while the work is still fresh.

What shipped

  • [ @remcostoeten/analytics ]
    There was no real reason for this, besides me wanting to roll my own service and learn some more back-end. It's a privacy-first, event-sourced analytics engine built on Bun, Hono (Vercel Edge), and Neon/Postgres. It leverages JSONB for a schema-less event stream that supports advanced forensics (Browser/OS parsing) out of the box.

    • Possibilities: Track Web Vitals (LCP, CLS, INP), E-commerce revenue, A/B test variants, and full user funnels without migrations.
    • Usage:
      import { Analytics, trackEvent, useAnalytics } from '@remcostoeten/analytics'; // 1. Initialize globally with robust user segmentationexport default function RootLayout({ children }) {  return (    <Analytics       ingestUrl="https://ingest.remcostoeten.nl"      options={{         trackWebVitals: { lcp: true, fid: true, cls: true },        sessionReplay: 'sampled', // Record 10% of sessions for performance        anonymizeIp: true       }}     >      {children}    </Analytics>  );} // 2. Rich e-commerce tracking integrated into feature componentsfunction CheckoutButton({ cart }) {  const { identify, track } = useAnalytics();   const handleCheckout = () => {    // Tie subsequent events to a specific user identity securely    identify('USR_8921', { trait: 'premium_tier', LTV: 450 });     // Fire a complex schema-less event with full type-safety payload    track('checkout_initiated', {       cartValue: cart.total,       currency: 'EUR',      items: cart.items.map(i => i.sku),      appliedDiscount: 'SUMMER_SALES_26',      abTestVariant: 'checkout_v2_red_btn'    });  };   return <button onClick={handleCheckout}>Checkout</button>;}
    • GitHub: remcostoeten/analytics
    • Live Demo: analytics.remcostoeten.nl
  • [ @remcostoeten/use-shortcut ]
    I built this because existing shortcut libraries felt clunky. I wanted a "human-readable" API that felt like writing a sentence, with perfect TypeScript autocompletion for every key and modifier.

    • Tech Talk: A zero-dependency React hook built with a fluent/chainable builder pattern. It handles event listener cleanup automatically and supports advanced modifier combinations without manual string parsing.
    • Possibilities: Support for command combos (Ctrl/Cmd + K), sequential key presses (G then H), global/scoped listeners, and automatic documentation generation via description tags.
    • Usage:
      import { useShortcut, ScopeProvider } from '@remcostoeten/use-shortcut'; function AdvancedCommandPalette() {  const searchRef = useRef<HTMLInputElement>(null);   // Builder pattern enables complex sequencing and scope locking  useShortcut()    .sequence('g', 't') // Wait for 'g' THEN 't' (Go To)    .or()    .cmd().shift().key('p') // Or use standard modifier combo    .scope(searchRef) // Only trigger if this element doesn't have focus    .preventDefault()    .debounce(150) // Prevent rapid firing bounds    .action((event, meta) => {      console.log(`Triggered via: ${meta.triggerType}`);      searchRef.current?.focus();    })    .description('Navigate to specific project view')    .build();   return <input ref={searchRef} placeholder="Search..." />;}
    • GitHub: remcostoeten/use-shortcut
    • Live Demo: use-shortcut.vercel.app
  • [ oauth-app-automator ]
    I hate creating OAuth applications when using social providers. Thus I automated the process with a Python program. Authenticate once and from there you're able to create, (bulk) delete apps and test credentials. Write secret and client ID to clipboard, or straight in your environment variable.

    • Tech Talk: Python-based automation that scripts the actual browser interactions (via Selenium/Playwright) to fetch credentials directly from provider portals (GitHub/Google).
    • Possibilities: Bulk creation of developer apps, automatic .env file updates, and a clean interactive CLI/TUI for managing credentials.
    • GitHub: remcostoeten/oauth-app-automator
  • [ Kuizer ]
    Maintaining large TypeScript projects often leads to "dead code rot." I needed a fast, reliable way to prune the tree without manual auditing—so I built Kuizer to handle the heavy lifting.

    • Tech Talk: A high-performance CLI built with Bun. It analyzes the TypeScript import graph to detect unreachable files and unused exports by deep-diving into the AST.
    • Possibilities: Browse findings in an interactive terminal UI (TUI), categorize unused exports (types vs components), and safe snapshot-based rollbacks for every automated fix.
    • Usage:
      # Run a deep AST dependency graph analysis to find dead code# -i: Interactive TUI mode for reviewing findings# --fix: Automatically treeshake and safely remove unused code# --snapshot: Create a rollback snapshot before mutating files# --exclude: Glob array pattern for files to ignore during analysiskuizer analyze \  --interactive \  --fix \  --snapshot ./.kuizer-backups/ \  --exclude "**/*.test.ts" "src/legacy-api/**" \  --threshold "medium"
    • GitHub: remcostoeten/kuizer
React:

Comments

Sign in to join the conversation

Loading sign-in options...