Skip to content

Leon180/flashapp

Repository files navigation

Flashcard App 🚀

A premium, AI-powered flashcard application that helps you master new vocabulary. It integrates with Google Sheets for storage and uses external APIs for definitions, translations, and audio.


✨ Features

  • Google Sheets Integration: Your data lives in your own Google Sheet.
  • Smart Enrichment: Automatically fetches English definitions, Chinese translations (Traditional), and Pronunciation Audio.
  • Real-Time Migration: "Migrate Data" button fixes missing data (like Audio) with a live progress log.
  • SRS-Ready: Random recall mode and email reminders.
  • Premium UI: Glassmorphism design with responsive animations.

🛠️ Setup Guide (Step-by-Step)

1. Prerequisites

  • Go 1.22+: Download Go
  • Google Cloud Platform Project: You need a Service Account to access Google Sheets.

2. Configure Credentials (credentials.json)

  1. Go to the Google Cloud Console.
  2. Create a new project (e.g., "Flashcard App").
  3. Enable the Google Sheets API.
  4. Create a Service Account:
    • Go to "IAM & Admin" > "Service Accounts".
    • Click "Create Service Account".
    • Grant it "Owner" or "Editor" role (optional, but ensures access).
  5. Create a Key:
    • Click on your new Service Account > "Keys" > "Add Key" > "Create new key" > JSON.
    • Download the file and rename it to credentials.json.
    • Move it to this project's root folder (flashcard-app/credentials.json).

⚠️ Security Note: Never commit credentials.json to Git. This project has a .gitignore to prevent this.

3. Setup Google Sheet

  1. Create a new Google Sheet at sheets.google.com.
  2. Share the sheet with your Service Account email (found inside credentials.json, usually looks like ...-compute@developer.gserviceaccount.com). Give it Editor access.
  3. Get the Spreadsheet ID:
    • Look at the URL: https://docs.google.com/spreadsheets/d/YOUR_SPREADSHEET_ID/edit...
    • Copy the long string between /d/ and /edit.
  4. Create a file named spreed_id (no extension) in the project root.
  5. Paste the ID inside spreed_id.

🏃‍♂️ How to Run

Option 1: Using Makefile (Recommended)

This automatically builds the app and runs it using the ID from your spreed_id file.

make run

Option 2: Manual Run

go run cmd/main.go -spreadsheet YOUR_ID_HERE

Once running, open your browser to: http://localhost:8080


📂 Project Structure

  • cmd/main.go: Entry point. Sets up server and dependencies.
  • internal/: Core logic (private to this app).
    • server/: HTTP API handlers (/api/cards, /api/migrate).
    • service/: Business logic (Validation, Enrichment, Migration flow).
    • storage/: Database layer (Google Sheets implementation).
    • enricher/: External API integration (Dictionary API, Translation).
    • email/: Email sending logic.
  • static/: Frontend files.
    • index.html: Main UI.
    • style.css: Styling.
    • flashcard-bundle.js: Main frontend logic (bundled).

🧪 Testing

The project includes a robust test suite for the core service logic.

# Run tests
go test -v ./internal/service

# Check code coverage
go test -cover ./internal/service

📚 Learnings

What I Learned

  • Context Cancellation: Used select { case <-ctx.Done(): ... } in long-running migration loops to prevent zombie processes and ensure graceful shutdowns.
  • Dependency Injection: Decoupled CardService from GoogleSheetsStore and SMTPSender using interfaces, enabling easy testing with mocks.
  • SSE for Real-Time Logs: Implemented Server-Sent Events to stream migration progress to the frontend without polling.
  • Google Sheets as DB: Leveraged Sheets for easy data editing while managing its higher latency and API constraints.

Key Concepts

  • Concurrency: Preventing race conditions and managing goroutine lifecycles.
  • Architecture: Service-Repository pattern for clean separation of concerns.
  • Frontend-Backend Sync: Using EventSource for state synchronization during long operations.

Challenges Faced

  • API Rate Limits: Google Sheets API has strict quotas; added delays to avoid hitting limits during bulk updates.
  • Frontend State: Managing multi-category filter state required careful logic to handle "OR" filtering correctly.

About

simple flash card for english

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages