Tech Stack

Overview

Layer	Technology	Why
Extension	Chrome Manifest V3	Latest extension standard
Frontend	React + TypeScript	Component-based, type-safe
Styling	Tailwind CSS	Utility-first, fast prototyping
Backend	Firebase	No server needed, real-time sync
Build	Vite	Fast builds, great DX
Dictionary	Free Dictionary API	Free, no API key needed

Project Structure

VocabPal-Learning/
├── shared/           # Shared types and utilities
│   └── src/
│       ├── types/    # TypeScript interfaces
│       └── services/ # Firebase services
├── extension/        # Chrome extension (Sprint 2)
├── web/              # Web app (Sprint 3)
└── docs/             # Documentation

Key Dependencies

Shared Package

• firebase - Firebase SDK
• typescript - Type safety

Extension (planned)

• react - UI components
• vite - Build tool

Web App (planned)

• react - UI components
• react-router - Client routing
• tailwindcss - Styling