Travelette App

Travel wallet, the app that makes tracking the budget for traveling easy to understand
Explore the docs »

View Demo (comming soon) · Report Bug · Request Feature

About The Project

Travelette is my first full-stack app built using React, Node/Express, Vite, and MySQL.

The app will help people track their transactions/payments when they travel, be able to check how much they spent in their own currency, be able to share different trip transactions with their friends. It should provide various stats about past trips and help people optimize how much they spend when they travel. It will hopefully one day communicate with the user's bank and also (with the help of external APIs) put together a budget for a future trip (calculate flight cost, accommodation, food, gifts, etc).

(back to top)

Built With

• 
• 
• 
• 
• 
• 

(back to top)

Getting Started

To get a local copy up and running follow these simple example steps.

Prerequisites

List things you need to use the software and how to install them.

• npm

    npm install npm@latest -g

• express & vite

    npm i express vite

• MySQL (you have to have brew installed already, this is the command for MAC users)

    brew services start mysql 
    mysqladmin -u root password 'PASSOWORD OF YOUR CHOICE'

*Navigate to mysql and create the database locally so that you can run the migrate script later (this will generate the tables)

mysql -u root -p
create database travelette;

Installation

1. Clone the repo

  git clone https://github.com/github_username/repo_name.git

2. Install NPM packages

  npm install

3. Install client dependencies - This will install client dependencies (React).

  cd client
  npm install

4. Add a .env file to the project folder (root/main) of this repository containing the MySQL authentication information for MySQL user. For example:

DB_HOST=localhost
DB_USER=root
DB_NAME=travelette
DB_PASS=YOUR_MySQL_PASSWORD

5. Database migration (run this in the main/root folder in a new terminal window) This will create all DB tables in your database. DO NO RUN THIS COMMAND UNLESS YOU HAVE CREATE A DB locally (see Prerequisites).

  npm run migrate

6. Navigate to the main and access the MySQL interface in your terminal by running

  mysql -u root -p

7. In your MySQL console, you can run

  use travelette;

8. Check table Transactions (or any other table) to see the structure of the transactions table.

  describe transactions;

9. Start server by going to the root folder and running

  npm start

10. Open a separate terminal window and navigate to the client folder, then run

  npm run dev

Dependencies

• Run npm install in project directory. This will install server-related dependencies such as express.
• cd client and run npm install. This will install client dependencies (React).

Database

• Access the MySQL interface in your terminal by running mysql -u root -p
• Create a new database called travelette: create database travelette
• Add a .env file to the project folder of this repository containing the MySQL authentication information for MySQL user. For example:

  DB_HOST=localhost
  DB_USER=root
  DB_NAME=travelette
  DB_PASS=YOURPASSWORD

• Run npm run migrate in the project folder of this repository, in a new terminal window. This will create all DB tables in your database.
• Navigate to the main and access the MySQL interface in your terminal by running mysql -u root -p
• In your MySQL console, you can run use travelette; and then describe transactions; (or any other table) to see the structure of the transactions table.

Development

• Run npm start in project directory to start the Express server on port 4000
• In another terminal, do cd client and run npm run dev to start the client in development mode with hot reloading in port 5173.

(back to top)

Usage

Travelette is a my first full stack app built using React, Node/Express, Vite and MySQL.

Documentation will be available in the future Documentation

(back to top)

Roadmap

• Add editing option to the transaction
• Add trips table and basic component functionality
• Create login page
  • Nested Feature

See the [open issues][issues-url] for a full list of proposed features (and known issues).

(back to top)

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

1. Fork the Project
2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
3. Commit your Changes (git commit -m 'Add some AmazingFeature')
4. Push to the Branch (git push origin feature/AmazingFeature)
5. Open a Pull Request

(back to top)

License

Distributed under the GNU GENERAL PUBLIC LICENSE. See LICENSE for more information.

(back to top)

Contact

Paula Burghelea - [email protected]

Personal Website - mycupoflatte.com

• 

Project Link

(back to top)

Resources

• MDN docs
• Express docs
• MySQL docs
• React docs