An open API service indexing awesome lists of open source software.

https://github.com/jakaria030/lingo-bingo

Lingo Bingo is a language learning platform designed to help users enhance their vocabulary and communication skills in the German language.
https://github.com/jakaria030/lingo-bingo

aos-animation context-api firebase react react-router tailwindcss toast-notifications

Last synced: 2 months ago
JSON representation

Lingo Bingo is a language learning platform designed to help users enhance their vocabulary and communication skills in the German language.

Awesome Lists containing this project

README

          

# Lingo Bingo
#### Expand your vocabulary and communication skills with Lingo Bingo.

## Purpose
Lingo Bingo is a language learning platform designed to help users enhance their vocabulary and communication skills in the German language. This platform offers a user-friendly interface, interactive features, and engaging tools to make learning German fun and effective.

## Live URL
[Visit Lingo Bingo Website](https://lingo-bingo-f29de.web.app/)

## Key Features
- **Learn German Vocabulary:** Discover German words along with their meanings in English.
- **Pronunciation Guides:** Improve your pronunciation with sound-based support for every word.
- **Example Sentences:** Understand context with English sentence examples for German words.
- **Alphabet Learning Videos:** Special videos to help users learn the German alphabet easily.
- **Interactive and Engaging:** Combines video, audio, and textual content for a comprehensive learning experience.
- **User-Friendly Design:** Simplified navigation to make language learning enjoyable and effective.

## Technologies Used
This project was built using the following technologies:
- **Frontend:** React, HTML, CSS, JavaScript
- **Styling:** Tailwind CSS, DaisyUI
- **Firebase:** Firebase is used for authentication and hosting.
- **Animations:** AOS(Animate On Scroll)
- **State Manage**: React hooks (useState, useEffect, contextAPI)

## NPM Packages
The following npm packages were used in the project:
- [`react-router-dom`](https://www.npmjs.com/package/react-router-dom): Declarative routing for React apps.
- [`react-dom`](https://www.npmjs.com/package/react-dom): React library for DOM rendering.
- [`react`](https://www.npmjs.com/package/react): A JavaScript library for building user interfaces.
- [`react-icons`](https://www.npmjs.com/package/react-icons): Popular icons as React components.
- [`aos`](https://www.npmjs.com/package/aos): Animate on Scroll Library for animations.
- [`firebase`](https://www.npmjs.com/package/firebase): JavaScript library for Firebase services.
- [`react-intersection-observer`](https://www.npmjs.com/package/react-intersection-observer): React implementation of the Intersection Observer API.
- [`react-countup`](https://www.npmjs.com/package/react-countup): A React component for animated counting.
- [`react-toastify`](https://www.npmjs.com/package/react-toastify): Toast notifications for React.
- [`react-helmet`](https://www.npmjs.com/package/react-helmet): Manage the document head dynamically.

1. Clone the repository:
```bash
git clone https://github.com/Jakaria030/lingo-bingo.git
2. Change the directory
```bash
cd lingo-bingo
3. Install dependencies:
```bash
npm install
4. Run the development server:
```bash
npm run dev