Skip to content

README.md

Latest commit

 

History

History
213 lines (172 loc) · 7.51 KB

README.md

File metadata and controls

213 lines (172 loc) · 7.51 KB

Fluentry

React Native Expo TypeScript Supabase

Master any language, naturally. A premium language learning mobile application built with Expo and React Native, featuring adaptive spaced repetition algorithms and comprehensive progress tracking.

✨ Key Features

🌍 Language Support

  • 8 Supported Languages: Spanish, French, German, Japanese, Korean, Italian, Portuguese, Chinese
  • Progressive Curriculum: 10 levels per language with 200 curated words each
  • Cultural Relevance: Contextually appropriate vocabulary selection

🧠 Adaptive Learning System

  • Spaced Repetition (SRS): Brain-optimized timing for maximum vocabulary retention
  • Difficulty Rating: User-rated word difficulty personalizes learning paths
  • Smart Review Algorithm: Optimal word presentation based on performance

🎯 Learning Tools

  • Interactive Flashcards: Visual learning with pronunciation guides
  • Speech Recognition: Real-time feedback on spoken responses
  • Audio Pronunciation: Native speaker audio for accurate pronunciation
  • Visual Mnemonics: Contextual images and memory aids

📊 Progress Tracking

  • Gamified Experience: XP levels and achievement system
  • Streak Tracking: Daily activity maintenance with visual heatmaps
  • Mastery Metrics: Real-time familiarity tracking and retention analytics
  • Weekly Reports: Comprehensive learning insights and patterns

🎨 User Experience

  • Premium UI Design: Glassmorphism effects with smooth animations
  • Offline Capability: Core features work without internet connection
  • Haptic Feedback: Tactile responses for interactive elements
  • Dark/Light Themes: Adaptive theming based on device preferences

🛠️ Technology Stack

Frontend Framework

  • Expo SDK 54 / React Native 0.81
  • TypeScript with strict type checking
  • Expo Router for file-based navigation

State Management & Data

  • Zustand for global state management
  • Supabase (PostgreSQL) with Row Level Security
  • Supabase Auth for secure user authentication
  • Real-time Sync for cross-device progress synchronization

AI & Multimedia

  • Expo Speech Recognition API for pronunciation feedback
  • Expo Speech API for text-to-speech pronunciation guides
  • Custom SRS Algorithm implementation

Development Tools

  • React Native Reanimated for smooth animations
  • ESLint & Prettier for code quality
  • pnpm for efficient package management
  • Expo Application Services (EAS) for builds and deployment

🚀 Getting Started

Prerequisites

  • Node.js 18+
  • pnpm
  • Expo CLI
  • iOS Simulator / Android Emulator (optional)

Installation

  1. Clone the repository:

    git clone https://github.com/umairhex/fluentry.git
cd fluentry

  2. Install dependencies:

    pnpm install

  3. Environment Setup: Create a .env file with your Supabase credentials:

    EXPO_PUBLIC_SUPABASE_URL=your-supabase-project-url
EXPO_PUBLIC_SUPABASE_ANON_KEY=your-supabase-anon-key

  4. Start the development server:

    pnpm start

Database Setup

  1. Create a new Supabase project at database.new
  2. Run the SQL migrations in database/001_initial.sql
  3. Enable Row Level Security policies for data protection

📂 Project Structure

fluentry/
├── app/                    # Main application screens and routing
│   ├── _layout.tsx        # Root layout component
│   ├── index.tsx          # Home/dashboard screen
│   ├── (auth)/            # Authentication screens
│   ├── (onboarding)/      # Onboarding flow
│   └── (tabs)/            # Main tab navigation
├── components/            # Reusable UI components
│   ├── ui/               # Base UI components
│   ├── auth/             # Authentication components
│   ├── dashboard/        # Dashboard widgets
│   ├── learn/            # Learning interface components
│   ├── quiz/             # Quiz and assessment components
│   ├── settings/         # Settings and preferences
│   └── stats/            # Statistics and analytics
├── constants/            # Design system and configuration
│   ├── Colors.ts         # Color palette
│   └── Layout.ts         # Layout constants
├── data/                 # Static data and mocks
│   ├── quiz.mocks.ts     # Quiz data for development
│   └── languages/        # Language-specific data
├── database/             # Database schema and migrations
│   └── 001_initial.sql   # Initial database setup
├── hooks/                # Custom React hooks
│   ├── useActivityQueries.ts
│   ├── useDashboardData.ts
│   ├── useStatsData.ts
│   └── useProgressSync.ts
├── lib/                  # Utility libraries and services
│   ├── supabase.ts       # Supabase client configuration
│   ├── supabaseApi.ts    # API service functions
│   ├── queryClient.ts    # React Query configuration
│   └── speechRecognition.ts # Speech recognition utilities
├── store/                # Global state management
│   ├── authStore.ts      # Authentication state
│   ├── preferencesStore.ts # User preferences
│   └── progressStore.ts  # Learning progress
└── types/                # TypeScript type definitions
    └── database.types.ts # Generated database types

🚀 Deployment

Development Builds

# Create development build
eas build --platform ios --profile development
eas build --platform android --profile development

Production Builds

# Build for app stores
eas build --platform ios --profile production
eas build --platform android --profile production

# Submit to app stores
eas submit --platform ios
eas submit --platform android

Over-the-Air Updates

# Publish updates
eas update --branch production

📊 Data Architecture

User Authentication Flow

  1. Email/password registration and login
  2. Automatic profile creation with default preferences
  3. Secure session management with Supabase Auth

Learning Session Flow

  1. Language and level selection
  2. SRS algorithm determines review queue
  3. Interactive flashcard sessions with progress tracking
  4. Real-time synchronization across devices

Progress Synchronization

  • Local-first approach with offline capability
  • Background sync when online
  • Conflict resolution for concurrent modifications
  • Real-time updates via Supabase subscriptions

🤝 Contributing

  1. Fork the repository
  2. Create a feature branch (git checkout -b feature/amazing-feature)
  3. Commit your changes (git commit -m 'Add amazing feature')
  4. Push to the branch (git push origin feature/amazing-feature)
  5. Open a Pull Request

📄 License

This project is proprietary and part of a personal development portfolio.

📞 Contact

Umair Khan

Built with ❤️ for natural language acquisition