.
├── public
├── src
│   ├── components
│   ├── pages
│   └── styles
└── whisper-server
    ├── main.py
    ├── requirements.txt
    └── README.md

9 directories, 3 fileses, 3 files

Thistle is a transcription service I'm building for Cedarville's startup competition! I'm also using it as an opportunity to become more familar with web components and full stack applications.

I'm just running this locally for now but getting started is super straightforward.

bun install
bun devv

Your server will be running at http://localhost:3000 with hot module reloading. Just edit any .ts, .html, or .css file and watch it update in the browser.

Thistle requires a separate Whisper transcription server for audio processing. Set it up in the whisper-server/ directory:

cd whisper-server
./run.shh

Or manually:

cd whisper-server
pip install -r requirements.txt
python main.pypy

The Whisper server will run on http://localhost:8000. Make sure it's running before using transcription features.

Copy .env.example to .env and configure:

cp .env.example .env

# Edit .env to set WHISPER_SERVICE_URL=http://localhost:8000

The tech stack is pretty minimal on purpose. Lit components (~8-10KB gzipped) for things that need reactivity, vanilla JS for simple stuff, and CSS variables for theming. The goal is to keep the total JS bundle as small as possible.

The development flow is really nice in my opinion. The server imports HTML files as route handlers. Those HTML files import TypeScript components using " tabindex="0" role="button">