Skip to content

WorldWise is a React-based Single Page Application designed to help users track their travel history. With CSS modules for styling and React Router for routing, this app provides a seamless and intuitive experience for managing your visited cities and countries.

Notifications You must be signed in to change notification settings

AaliyanAsif/WorldWise

Repository files navigation

WorldWise - Travel History Tracker

WorldWise is a React-based Single Page Application designed to help users track their travel history. With CSS modules for styling and React Router for routing, this app provides a seamless and intuitive experience for managing your visited cities and countries.

Features

  • Dummy Authentication:

    • Log in to access your travel history.
  • Interactive World Map:

    • Display a world map upon logging in.
  • City/Country Tracking:

    • Add cities to your list by clicking on the map.
    • Automatically fetches the city name and allows users to add travel date and notes.
  • Sidebar List:

    • View the list of cities and countries visited in the sidebar.
  • Marker on Map:

    • Added cities are marked on the map for easy visualization.
  • City Details:

    • Click on a city to view details, including name, travel date, notes, and a link to Wikipedia.
  • Remove Cities:

    • Easily remove cities from the list with a click on the X icon.
  • Use Your Position:

    • Utilize the "Use Your Position" button to center the map on your approximate location.

Technologies Used

  • React.js: Building the interactive and dynamic user interface.
  • CSS Modules: Styling components for a clean and modular design.
  • React Router: Handling navigation within the single-page application.

Getting Started

  1. Clone the repository: git clone [repository URL]
  2. Navigate to the project directory: cd worldwise
  3. Install dependencies: npm install
  4. Start the development server: npm run dev
  5. Run the server: npm run server

Now, you can access your WorldWise Travel History Tracker by following these steps. Explore the app, track your travel history, and enjoy the seamless experience it provides!

Contributing

  1. Fork the repository.
  2. Create a new branch: git checkout -b feature-name
  3. Make your changes and commit them: git commit -m 'Add feature'
  4. Push to the branch: git push origin feature-name
  5. Create a pull request.

About

WorldWise is a React-based Single Page Application designed to help users track their travel history. With CSS modules for styling and React Router for routing, this app provides a seamless and intuitive experience for managing your visited cities and countries.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published