Skip to content

README.md

Latest commit

 

History

History
88 lines (64 loc) · 2.25 KB

README.md

File metadata and controls

88 lines (64 loc) · 2.25 KB
Raw

Interview Copilot Frontend

Electron desktop application with React + TypeScript for real-time interview assistance.

Features

  • Transparent Overlay: Always-on-top window with adjustable transparency
  • System Audio Capture: Captures interviewer's voice from system audio
  • Screen Capture: Take screenshots of coding problems
  • Real-time Transcription: Live display of transcribed questions
  • AI Response Display: Streaming AI answers with syntax highlighting
  • Global Shortcuts: Control the app without switching focus

Tech Stack

  • Electron: Desktop app framework
  • React: UI library
  • TypeScript: Type-safe development
  • Vite: Fast build tool
  • Zustand: State management
  • Socket.IO: WebSocket client

Scripts

# Development
npm run dev              # Run in dev mode

# Building
npm run build           # Build the app
npm run build:electron  # Build distributable

# Code quality
npm run lint            # Run ESLint
npm run format          # Format code with Prettier

Project Structure

frontend/
├── electron/           # Electron main process
│   ├── main.ts        # Main entry point
│   └── preload.ts     # Preload script
├── src/
│   ├── components/    # React components
│   ├── services/      # Business logic
│   ├── hooks/         # Custom React hooks
│   ├── store/         # Zustand state management
│   ├── App.tsx        # Main App component
│   └── main.tsx       # React entry point
├── index.html         # HTML template
└── package.json       # Dependencies

Global Shortcuts

  • Ctrl+Shift+L - Toggle listening
  • Ctrl+Shift+S - Capture screen
  • Ctrl+Shift+H - Hide/Show window

Development

The app runs in development mode with hot-reload:

  1. Vite dev server on port 5173
  2. Electron loads from localhost
  3. Changes reflect immediately

Audio Capture

The app uses getDisplayMedia API to capture system audio. When starting audio capture:

  1. Select the tab/window/screen to share
  2. IMPORTANT: Check "Share system audio" checkbox
  3. Grant permissions

Building

To create a distributable:

npm run build
npm run build:electron

Output in release/ folder.