phiHero/showcase-podcasts-voice-search

Work in Progress

🎧 Search podcasts with voice, powered by Typesense

This is a demo that showcase Typesense's Voice Query feature.

Tech Stack

• Typesense
• React + Vite
• Typescript
• Tailwind + shadcn/ui

The dataset contains metadata of 96K podcasts (after being filtered) and is from Listen Notes.

This demo uses extendable-media-recorder to record WAV audio and hark for silence detection.

Project Structure

├── scripts/
│   ├── data/
│   │   └── podcasts-1000-samples.jsonl
│   └── indexTypesense.ts # script that index data from podcasts-1000-samples.jsonl into typesense server
└── src/
    ├── components/
    │   └── UI components...
    ├── hooks/
    │   └── useSearch.tsx
    ├── lib/
    │   └── typesense.ts # typesense client config
    └── App.tsx # podcasts search

Development

To run this project locally, make sure you have docker and nodejs, install dependencies and start the dev server:

Start typesense server

npm run start:typesense # or: docker compose up

Index data into typesense

npm run index:typesense

Start the dev server

npm run dev

Open http://localhost:5173 to see the app ✌️

Environment

Set env variables in .env file to point the app to the Typesense Cluster

VITE_TYPESENSE_SEARCH_ONLY_API_KEY=xxx
VITE_TYPESENSE_URL=https://xxxxxxx.typesense.net:443

Only for indexing:

TYPESENSE_ADMIN_API_KEY=xyz
FORCE_REINDEX=false