Skip to content

ReactJS 🌍 Learn Lingo connects users with global language tutors. Features include tutor search, favorites, detailed profiles, and responsive design. Built with React, Firebase, and SCSS for an optimal user experience. πŸš€

Notifications You must be signed in to change notification settings

gudzsv/learn-lingo

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

48 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

Learn Lingo

🌟 Project Overview

Learn Lingo is a cutting-edge web application designed to connect users with language tutors from around the globe. Whether you're embarking on your first language journey or perfecting your fluency, this platform offers a seamless way to find the perfect tutor tailored to your goals.

Key Features

  • 🌍 Comprehensive Tutor Search: Effortlessly filter tutors by Languages, Skill Level, and Price to find your ideal match.
  • ❀️ Favorites Management: Save and revisit your favorite tutors with ease (login required).
  • πŸ“„ Detailed Tutor Profiles: Dive into detailed tutor ratings, authentic reviews, and language proficiency levels.
  • πŸ“± Responsive Design: Enjoy a polished and consistent user experience across all devices, from desktops to mobile phones.

πŸ›  Tech Stack

Learn Lingo leverages modern web technologies to deliver an optimal user experience:

Frontend:

  • βš› React (v18.3.1): Building intuitive and dynamic user interfaces.
  • 🚦 React Router (v6.28.0): Enabling smooth, client-side routing.
  • πŸ›  Redux Toolkit: Managing application state efficiently.
  • πŸ—ƒ Redux Persist: Ensuring state persistence across sessions.

Backend and Services:

  • πŸ”₯ Firebase: Powering authentication and real-time database services.

Styling:

  • 🎨 SCSS: Creating modular and reusable styles.
  • πŸ–Œ Modern Normalize: Achieving consistent cross-browser rendering.

Utilities:

  • 🧩 clsx: Simplifying conditional class management.
  • πŸ” react-helmet-async: Managing SEO-friendly meta tags.
  • ⏳ react-loader-spinner: Indicating loading states with stylish spinners.
  • βœ… Yup: Streamlining schema-based form validation.
  • πŸ“ React Hook Form: Simplifying form management and validation.

πŸš€ Quick Start

Follow these steps to set up and run the project locally:

  1. Clone the repository:

    git clone https://github.com/gudzsv/learn-lingo.git
  2. Navigate to the project directory:

    cd learn-lingo
  3. Install dependencies:

    npm install
  4. Start the development server:

    npm run dev
  5. Access the application: Open your browser and navigate to http://localhost:5173.

πŸ“Έ Screenshots

Home Page

homepage

Teachers

teachers

Favorites Page

favorites

πŸ‘¨β€πŸ’» Author

Developed by: Serhii Hudzenko

Feel free to reach out with questions, suggestions, or collaboration opportunities!

About

ReactJS 🌍 Learn Lingo connects users with global language tutors. Features include tutor search, favorites, detailed profiles, and responsive design. Built with React, Firebase, and SCSS for an optimal user experience. πŸš€

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published