Welcome to
"WorldWise"

Track your travels on an interactive world map! Mark the cities you’ve visited, log your experiences with dates, and share your journey with friends. Never forget where you’ve been or how you’ve explored the world.

  • api
  • css
  • css-modules
  • eslint
  • html5
  • javascript
  • json-server
  • leaflef
  • react
  • react-leaflet
  • react-router
  • spa
  • vite
Created at:
Last update:

WorldWise

App Icon

WorldWise is a single-page application that lets you track your travels on a world map. Mark the cities you�ve visited, record your experiences, and share your journey with friends. Never forget where you�ve been and how you�ve wandered the world.

Live Demo: https://world-wise-production.vercel.app

Features

  • Interactive Map: Powered by Leaflet and React Leaflet for smooth map interactions.
  • City Tracking: Mark any city youâ��ve visited and keep a log of your adventures.
  • Date Selection: Add the dates of your visits with an intuitive date picker.
  • Routing: Navigate seamlessly between pages with React Router.
  • Data Storage: Store and retrieve city data using JSON Server for a simple backend.
  • Responsive Design: Optimized layout for both desktop and mobile use.

Technologies Used

React JavaScript Vite CSS3 HTML5 Leaflet React Router ESLint

Installation

  1. Clone the repository:

    git clone https://github.com/yourusername/worldwise.git
    cd worldwise
  2. Install dependencies:

    npm install
  3. Start the development server:

    npm run dev
  4. Build for production:

    npm run build
  5. Preview the production build:

    npm run preview

Contributing

Contributions are welcome. Open an issue to suggest improvements or submit a pull request with your changes.