Trip Expenses App

Group project created for CodersCamp 2019 (part of Team Warsaw). Check demo at Heroku and source code at Github.

Authors:

Małgosia and her Github
Ania and her Github
Natalia and her Github
Agata and her Github

Project requirements:

React
Redux
database (relational or non-relational), its maintenance & input validation
client/server communication, HTTP request handling
environment variables
authorization & authentication
heroku deployment

Used technologies and libraries:

React
Redux
React Styled Components
MongoDB, mongoose, @hapi/joi
Express.js
dotenv, config
bcryptjs, jsonwebtoken
axios
heroku deployment
react-datepicker
react-select
moment

Main features:

Managing trip expenses:

adding / modifying / deleting trips (name, startdate, description)
adding / modifying / deleting expenses (amount, currency, category, description)
generating trip summary - comparison of spent and left amount according to budget, graph with expenses divided into categories
main features can be used only by logged in users
exchange rates are converted dynamically to main budget currency using external API

Setup for development:

Before getting started

To run project on your local machine for development and testing purposes you need to install the following software:

node.js & npm
MongoDB

Getting started

Clone repository

https://github.com/dobrzyckahanna/TravelPlanner.git

Create your database on MongoDB Atlas and add .env file to your repository (main folder)

.env

NODE_CONFIG_DIR=./server/config
DB_USER=your Atlas database user name (not user name to Mongo account)
DB_PASSWORD=your Atlas database password (not password to Mongo account)
DB_DATABASE_ADDRESS=your Atlas database address
DB_DATABASE_NAME=your Atlas database name
NODE_ENV=development
DEBUG=server:startup,server:database
DEBUG_COLORS=true
DEBUG_FD=1
JWT_PRIVATEKEY=your secret jwt key

Install required project dependencies

cd TravelPlanner
npm run install:app

Run developer server

npm run start:app

To see and test app open on localhost:3000

Credits:

Icons used:
- Icon made by Smashicons from www.flaticon.com
- Icon made by Freepik from www.flaticon.com
background photo by Louis Hansel on https://unsplash.com/
icons from Font Awesome
external exchange rates API: https://api.exchangerate-api.com/v4/latest/

To improve:

keeping user logged in after page refresh
secure Private Route (change the validation method)
redux refactor
improve solution with exchange rates object
add animation to dropdown menu
remove or hash password in login payload
change user status to "loggedIn" after registration

Future features:

adding / modifying custom categories
searching in user trips
sorting user trips
sorting and filtering user expenses

About CodersCamp

This is the 5th edition od the camp. More info about the camp: https://coderscamp.edu.pl/

natkalia / Trip-Expenses-App