Multilingual Flashcard Learning App

A modern, interactive flashcard application for language learning, built with React and TypeScript.

🌟 Features

Core Functionality

• Custom Flashcard Creation
  • Add terms and translations
  • Support for multiple languages
  • Optional examples and comments
  • Source and target language selection

Learning Tools

• Interactive Quiz Mode
  • Dynamic quiz generation
  • Language-specific filtering
  • Progress tracking
  • Adaptive difficulty

Progress Tracking

• Learning Progress
  • Track correct/incorrect answers
  • Cards marked as "learned" after 10 correct answers
  • Visual progress indicators
  • Manual learned status toggle

User Interface

• Modern Design
  • Clean, intuitive interface
  • Responsive layout
  • Card flip animations
  • Progress visualization

🚀 Technologies Used

• Frontend Framework: React with TypeScript
• State Management: Redux Toolkit
• UI Components: Material-UI
• Animations: Framer Motion
• Form Handling: React Hook Form
• Storage: Browser's localStorage
• Build Tool: Create React App

📝 Getting Started

1. Clone the repository:

git clone https://github.com/ElRobaMichis/flashcards.git

2. Install dependencies:

cd flashcards
npm install

3. Start the development server:

npm start

4. Open http://localhost:3000 in your browser.

💡 Usage

1. Adding Flashcards

   • Click "Add Flashcard" tab
   • Select source and target languages
   • Enter term and translation
   • Add optional examples/comments

2. Studying

   • Browse cards in the main view
   • Click cards to flip and reveal translations
   • Mark cards as learned/unlearned
   • Track your progress

3. Quiz Mode

   • Select source language
   • Answer questions to test knowledge
   • See immediate feedback
   • Track learning progress

🔧 Local Development

# Install dependencies
npm install

# Run development server
npm start

# Build for production
npm run build

# Run tests
npm test

📱 Responsive Design

The app is fully responsive and works on:

• Desktop computers
• Tablets
• Mobile phones

🔒 Privacy

• All data is stored locally in your browser
• No external servers or databases
• Your flashcards remain private

👤 Author

Agustin Medrano

📄 License

This project is licensed under the MIT License - see the LICENSE file for details.