Added backend and refactored frond-end to support it.

* Removed unecesery home page
* Added PHP Api that provides auth and replaces the json-server for data storage
* Added support for alternate geocode-api
* Added registration  page
This commit is contained in:
2025-05-27 00:42:00 +02:00
parent 25c1b73e32
commit e88269224c
60 changed files with 4438 additions and 8994 deletions

View File

@@ -1,31 +1,64 @@
# travel-tracker
# WorldWise Travel Tracker
WorldWise is a travel tracker app where you can pin your visited cities on the map and also write a short note about it.
The Travel Tracker App is a web application built with React.js that allows users to track and manage their travel plans. Whether you're a frequent traveler or just planning your next vacation, this app provides a simple and intuitive way to organize your trips, keep track of important details, and stay on top of your travel itinerary.
The WorldWise Web-App is built with React.js that allows users to track travel plans.
Whether you're a casual or frequent traveler, this app provides a simple and intuitive way to organize your trips, keep track of important details.
Features
User Authentication: Users can sign up or log in to the app securely. Personal information and travel data are protected.
## Set-up
### One-time and development requirements:
* NodeJS (22 or newer).
* npm (10 or newer).
Add Trips: Easily create new trips by providing basic details such as destination, travel dates, and any notes you want to add.
### Hosting requirements:
* a Web server (for example Nginx or Apache).
* PHP (8.2 or higher with modules PDO,PDO-mysql,curl).
* Mysql (8.0 or higher) or MariaDB (10 or higher).
View Trips: See a list of all your upcoming trips and quickly access their details.
### Steps:
* Clone the repository to the system with npm/nodejs.
* Open the cloned directory.
* Run `npm install`.
* Run `npm run build`.
* Copy the `api` and `dist` folders to the hosting server.
* Create a MySQL database with a corresponding user and import `api/db.sql`.
* Copy example configurations in `api/config/*.php.example` to `api/config/*.php`.
* Update `api/config/db.php` with your database name and credentials.
Edit and Delete Trips: Users can update trip details or delete trips they no longer need.
The application is now available on the address configured by the web server,
an account can be created using the link on the login page.
Getting Started
Follow these steps to set up the Travel Tracker App locally on your machine:
Clone the repository:
Open your web browser and visit http://localhost:3000 to access the Travel Tracker App.
### Extra steps to disable account creation
**Please make sure an account exists before continuing.**
* Set the `AllowUserRegistration` variable in `api/config/auth.php` to `false`
Dependencies
The Travel Tracker App uses the following main dependencies:
### Extra steps for frond-end development:
* Uncomment disabled variables `api/config/headers.php`.
* Update the api url in `vite.config.js` to reflect your environment.
* Run `npm run dev`.
The application is now available on the displayed url
React.js: A popular JavaScript library for building user interfaces.
### Extra steps for use of self-hosted geocode api
**A requirement is that a komoot photon api is already set-up.**
* Update variables `geocodeType`, `geocodeApiurl` and if required `geocodeApikey` in `api/config/geocode.php`.
React Router: Used for handling routing within the app.
CSS Modules : styling has been done using CSS Modules
Thank you for using the Travel Tracker App! Happy travels! 🌍✈️
## Technologies
The WorldWise App uses the following technologies:
* React.js: A popular JavaScript library for building user interfaces.
* React Router: Used for handling routing within the app.
* php : Provides the auth and data api.
* MySQL : Used for data storage.
* Reverse Geocode : by default provided by Big Data Cloud but can be configured to use a self-hosted komoot photon api.
Thank you for using the WorldWise Travel Tracker App!
Happy travels! 🌍✈️