Flashcards

Mobile flashcard application built with React Native and TypeScript.

The application helps users learn vocabulary using customizable flashcard decks and AI-generated word collections.

---

Features

• Create and manage custom flashcard decks
• Add, edit, and delete vocabulary cards
• Study mode with interactive flashcards
• Search decks and words
• AI-powered deck generation with Google Gemini
• Multi-screen mobile interface
• Modular component-based architecture
• TypeScript-based codebase

---

Tech Stack

• React Native
• TypeScript
• Google Gemini API
• React Native CLI
• Custom navigation system
• Local storage architecture

---

Project Structure

src/
├── assets/
├── components/
├── navigation/
├── screens/
├── storage/
└── types/

---

Screenshots

---

Getting Started

Installation

npm install

Start Metro

npm start

Run on iOS

npm run ios

Run on Android

npm run android

---

Usage Examples

Creating a Custom Deck

1. Tap "New Deck" on home screen
2. Enter deck name and description
3. Add vocabulary cards manually with word and translation

Generating AI Deck

1. Select "AI Generator" from menu
2. Choose native and target languages (e.g., English → Turkish)
3. Pick a topic (e.g., "Travel phrases", "Business vocabulary")
4. Set word count (1-100 words)
5. Generate and review the deck
6. Edit or save to your collection

Studying Cards

1. Select a deck from your collection
2. Tap "Study" to begin
3. Flip cards to reveal translations
4. Swipe to navigate between cards

---

Future Improvements

• User progress statistics
• Spaced repetition system
• Audio pronunciation support
• Cloud synchronization
• Export/import deck functionality

---

Repository Notes

This project was developed as a mobile application portfolio project focused on:

• React Native development
• TypeScript architecture
• mobile UI/UX
• reusable component design
• AI integration workflows

---

Contributors

• Magomed Umkhanov — @umkhanov
• Edem Makhsudov - @makhsudov
• Abderrahmane Mohamedna — @abderahman23