Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/tomtom828/bucketbuddiez

A Node & MySQL web app where users can connect with others who share their travel aspirations.
https://github.com/tomtom828/bucketbuddiez

handlebars mysql passportjs sequelize

Last synced: 9 days ago
JSON representation

A Node & MySQL web app where users can connect with others who share their travel aspirations.

Awesome Lists containing this project

README

        

# :earth_americas: Bucket Buddiez! :smile:

## Overview
A web app that allows users to input places they would like to travel to, and then match with other users who also want to go there!

Log in or create an account, and then click on places you want to travel to in your lifetime. Clicking on these locations will add them to your bucket list. When viewing your bucket list, click on a location to see if you have any mutual friends who also want to go there. If you do, then start arranging some travel plans! :airplane:

Please try out the deployed app in Heroku, found [here](https://bucket-buddiez.herokuapp.com/).

## Authors
[Tom Thompson](https://github.com/tomtom28/)

[Avani Ghetia](https://github.com/avani19/)

[Mario Aburto](https://github.com/marioaburto10/)

[Masud Chowdhury](https://github.com/masudhchowdhury/)

## Functionality
On the Front End, the app uses `Materialize`, `jQuery`, `AJAX`, and the HTML is rendered using `Handlebars`.

On the Back End, the app uses `Node.js` and `MySQL`. The Node Packages used in the app are `Sequelize` for database queries, `Express` for serving and routing, `Passport` for User Authenication, and `bcrypt-nodejs` for hashing user passwords.

For persistent data, the app uses 4 MySQL tables to store the `Users` and the places where they want to visit (`Cities`, `States`, and `Countries`). All users are then linked to the places they want to visit in the `City-Like`, `State-Likes`, and `Country-Likes` tables, which are generated by the Sequelize ORM.

## Cloning down the repo
If you wish to clone the app down to your local machine...

1. Use MySQL Workbench to create a database called `bucketBuddiezDB`:
* The raw SQL query is `CREATE DATABASE bucketBuddiezDB;`.
2. Inside the `config` folder, open up the `config.json` file:
* In the `development` object, add your MySQL localhost `password`.
3. In your terminal, `cd` into the project folder and run:
* `npm install` to download all node.js dependencies
* `npm run setupDB` to migrate/seed the database
4. Finally, you can run the programming using:
* `node server.js` in the terminal to start the node server
* And navigating to `localhost:3000` in your browser.

## Screenshots

### Home Page (`/index` route)
##### Here, users can either signup for login to the app.
![hompepage](/screenshots/index.png)

### Sign Up Page (`/signup` route)
##### Here, users will create an account with their name, email, and password
![sign up](/screenshots/signup.png)

### Login Page (`/login` route)
##### Here, users will login to their account with their email and password
![login](/screenshots/login.png)

### Bucketlist Page (`/view/bucketlist` route)
##### After a sucessful login, the user is redirected to their bucketlist.
##### Using a session in `Passport-js` and `Handlebars-js` templating, this page is unique to each user.
##### If locations were added to the users accounts, they will be seen here.
##### Clicking a (-) icon removes locations from the bucketlist using an `AJAX` call to our `API` endpoints.
##### From this page, the user can also Log Out of their account and end the session.
![bucketlist](/screenshots/bucklist.png)

### Note that clicking "Find Travel Buddy" on the Bucketlist Page opens a `materialize` modal.

##### If there are other users who also wish to travel to the location, their email addresses and names will be shown.
![buddy](/screenshots/buddies.png)

##### Conversely, if our `sequelize-js` query finds no other users related with said place, a different message appears.
![no buddy](/screenshots/no buddies.png)

### Add to the bucketlist by clicking navbar links for each of the `Handlebars-js` rendered pages:

#### Countries (`/view/countries` route)
![countries](/screenshots/countries.png)
##### Clicking the (+) button triggers an `AJAX` call to the `/:action/country/:userId/:countryId` endpoint.

#### States (`/view/states` route)
![states](/screenshots/states.png)
##### Clicking the (+) button triggers an `AJAX` call to the `/:action/state/:userId/:stateId` endpoint.

#### Cities (`/view/cities` route)
![states](/screenshots/cities.png)
##### Clicking the (+) button triggers an `AJAX` call to the `/:action/city/:userId/:cityId` endpoint.