Skip to content

This is a fully responsive React app with Vite to allow the users select the places they've travelled to on the map using API calls.

Notifications You must be signed in to change notification settings

MatinT-SA/travex

Repository files navigation

TRAVEX

travex

Table of Contents

Description

Travex is an interactive travel planning web app, fully responsive, built with React + Vite. It allows users to select and mark places they have traveled to using API calls. The app integrates various tools and libraries to provide a seamless and intuitive experience.

Features

  • 🌍 Interactive Map – Explore and mark locations using Leaflet & React Leaflet
  • 📅 Date Selection – Pick travel dates effortlessly with React Datepicker
  • 🔔 Real-Time Notifications – Enhanced UX using React Toastify
  • 🔗 Seamless Navigation – Smooth transitions powered by React Router DOM
  • 📱 Mobile-Friendly UI – Sleek Hamburger React Menu for a great mobile experience
  • State Management – Utilizes React Context & Reducer for scalability

Technologies Used

  • React (Frontend UI)
  • Vite (Fast build tool for React apps)
  • Leaflet & React-Leaflet (Map integration)
  • React-Datepicker (Date selection)
  • React-Toastify (Notifications)
  • React-Router-DOM (Client-side routing)

Installation & Setup

Prerequisites

Ensure you have Node.js and npm installed on your system.

Steps

  1. Clone the repository:
    git clone https://github.com/MatinT-SA/travex.git
    cd travex
  2. Install dependencies:
    npm install
  3. Start the development server:
    npm run dev
  4. Open http://localhost:5173 in your browser.

Usage

  • Log in via the simulated login system (powered by JSON-server).
  • Search, select, and mark locations on the map.
  • View and manage your saved locations with date selection.

Live Demo

🔗 Travex Live Demo

Contributing

Contributions are welcome! If you'd like to contribute:

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

Note: If the API does not load, please connect to a VPN as some services may be restricted in certain regions.

Enjoy using Travex and happy traveling! 🌎✈️

About

This is a fully responsive React app with Vite to allow the users select the places they've travelled to on the map using API calls.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published