LinguaApp 🌍

LinguaApp is an interactive, AI-powered language learning application built with React Native and Expo. Inspired by popular language-learning platforms, LinguaApp offers bite-sized lessons, quizzes, and real-time AI feedback to help you master a new language.

🚀 Features

• Interactive Lessons: Learn vocabulary and phrases across categories like Basics, Greetings, and Numbers.
• AI-Powered Quizzes: Dynamically generate new, personalized quiz questions using Google Gemini (gemini-2.0-flash).
• Smart Answer Evaluation: Get instant, contextual feedback on open-ended answers evaluated by Groq (Llama 3.1 8B).
• Gamified Learning: Track your progress with visual indicators like progress bars and heart/lives tracking.
• Modern UI: A sleek, responsive, and cross-platform user interface powered by NativeWind (Tailwind CSS for React Native).
• Local Progress Tracking: Your learning progress is securely saved on your device using AsyncStorage.

🛠️ Tech Stack

• Framework: React Native & Expo
• Language: TypeScript
• Navigation: React Navigation (Bottom Tabs & Native Stack)
• Styling: NativeWind (Tailwind CSS)
• AI Services:
  • Google Gemini API for dynamic content generation.
  • Groq API for fast, intelligent answer checking.
• Icons: Lucide React Native
• Storage: AsyncStorage

⚙️ Prerequisites

Before you begin, ensure you have the following installed:

• Node.js (v18 or higher recommended)
• npm, yarn, or pnpm
• Expo CLI
• Expo Go app on your physical device (iOS/Android), or an Android Emulator / iOS Simulator.

🔑 Environment Variables

To run the AI features, you will need to provide API keys.

1. Create a .env file in the root directory based on .env.example (or simply create a new .env file).
2. Add your API keys:

EXPO_PUBLIC_GEMINI_API_KEY=your_gemini_api_key_here
EXPO_PUBLIC_GROQ_API_KEY=your_groq_api_key_here

🚀 Installation & Setup

1. Clone the repository (if you haven't already):

   git clone https://github.com/haseebjaved4212/Language-Lessons.git
   cd LinguaApp

2. Install dependencies:

   npm install

3. Start the Expo development server:

   npm start
   # or
   npx expo start

4. Run the App:

   • Press a to open in an Android Emulator.
   • Press i to open in an iOS Simulator.
   • Scan the QR code with the Expo Go app on your physical device.

📂 Project Structure

LinguaApp/
├── assets/             # Images, fonts, and other static assets
├── src/
│   ├── components/     # Reusable UI components (HeartBar, ProgressBar, QuestionCard)
│   ├── screens/        # Main application screens (Home, Learn, Profile, Quiz)
│   ├── services/       # API integration services (Gemini, Groq)
│   └── utils/          # Helper functions, dummy data (lessons.ts), and storage
├── App.tsx             # Entry point and Navigation config
├── global.css          # Global Tailwind/NativeWind styles
├── tailwind.config.js  # Tailwind CSS configuration
└── babel.config.js     # Babel configuration

📝 License

This project is open-source and available under the standard open-source licenses. (Check LICENSE file for details).