https://github.com/mahajabin-tokon/pha9-vocabulary-learning

A responsive platform for learning German vocabulary with structured lessons, interactive tutorials, pronunciation, usage examples, user authentication, profile management, and dynamic content updates for an engaging and immersive language learning experience.
https://github.com/mahajabin-tokon/pha9-vocabulary-learning

countup daisyui firebase react react-router-dom tailwindcss vite

Last synced: 10 days ago
JSON representation

A responsive platform for learning German vocabulary with structured lessons, interactive tutorials, pronunciation, usage examples, user authentication, profile management, and dynamic content updates for an engaging and immersive language learning experience.

• Host: GitHub
• URL: https://github.com/mahajabin-tokon/pha9-vocabulary-learning
• Owner: Mahajabin-Tokon
• Created: 2025-01-23T22:48:14.000Z (14 days ago)
• Default Branch: main
• Last Pushed: 2025-01-24T22:53:22.000Z (13 days ago)
• Last Synced: 2025-01-24T23:26:14.195Z (13 days ago)
• Topics: countup, daisyui, firebase, react, react-router-dom, tailwindcss, vite
• Language: JavaScript
• Homepage: https://german-vocab-learning.netlify.app/
• Size: 736 KB
• Stars: 0
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
# German Vocabulary Learning Platform

# Live URL:

https://german-vocab-learning.netlify.app/

## Description

The German Vocabulary Learning Platform is a modern, responsive web application designed to make learning German vocabulary engaging and interactive. The platform offers structured lessons, interactive tutorials, vocabulary pronunciation, and contextual usage examples, ensuring an immersive learning experience for users. It also features user authentication, profile management, and dynamic content updates, making it a comprehensive tool for language learners.

## Packages Used

- **React**: Core library for building the user interface.

- **React Router DOM**: For managing routing and navigation across pages.

- **Firebase**: For authentication and real-time database services.

- **Tailwind CSS**: For responsive and modern styling.

- **DaisyUI**: Component library for creating accessible UI elements.

- **Vite**: Build tool for fast development and optimized builds.

- **Animate.css**: For adding animations to the UI.

- **CountUp.js**: To display animated counters for success metrics.

## Key Features

1. **User Authentication**:

   - Supports email/password login, registration, and Google OAuth.

   - Password reset functionality with email reference.

2. **Interactive Learning Modules**:

   - Browse through structured lessons with contextual vocabulary examples.

   - Listen to pronunciation and learn the usage of words in different contexts.

   - Integrated modal for displaying detailed information about each word.

3. **Responsive and Accessible UI**:

   - Fully responsive design ensuring compatibility across devices.

   - Accessible navigation with clear, user-friendly components.

4. **Dynamic Content and Notifications**:

   - Real-time updates for lessons and vocabulary through Firebase.

   - Dynamic animations and counters for user engagement.

5. **Tutorials Section**:

   - Embedded YouTube videos for additional learning resources.

   - Easy navigation between lessons and tutorials.

6. **Profile Management**:

   - Update user profile, including name and photo.

   - Personalized greetings for logged-in users.

7. **Feedback and Success Metrics**:

   - Feedback from users displayed with ratings.

   - Animated counters showcasing key metrics like user count, lesson count, and vocabulary count.

8. **Pricing Plans**:

   - Options for monthly and yearly subscription plans with clear cost savings.

9. **Error Handling**:

   - Custom error pages for invalid or missing routes.

## Future Enhancements

1. **Gamification Features**:

   - Add progress tracking, badges, and rewards to motivate users to complete lessons and tutorials.

2. **Speech Recognition**:

   - Enable users to practice pronunciation and receive feedback using speech recognition technology.

3. **Advanced Vocabulary Search**:

   - Implement a search feature to allow users to find words, phrases, or lessons based on their difficulty level or part of speech.