🌎 Bucket Buddiez! 😄

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! ✈️

Please try out the deployed app in Heroku, found here.

Authors

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...

Use MySQL Workbench to create a database called bucketBuddiezDB:

The raw SQL query is CREATE DATABASE bucketBuddiezDB;.

Inside the config folder, open up the config.json file:

In the development object, add your MySQL localhost password.

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

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.

Sign Up Page (`/signup` route)

Here, users will create an account with their name, email, and password

Login Page (`/login` route)

Here, users will login to their account with their email and password

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.

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.

Conversely, if our `sequelize-js` query finds no other users related with said place, a different message appears.

![no buddy](/screenshots/no buddies.png)

madhvi21 / bucketbuddiez Goto Github PK

bucketbuddiez's Introduction

🌎 Bucket Buddiez! 😄

Overview

Authors

Functionality

Cloning down the repo

Screenshots

Home Page (/index route)

Here, users can either signup for login to the app.

Sign Up Page (/signup route)

Here, users will create an account with their name, email, and password

Login Page (/login route)

Here, users will login to their account with their email and password

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.

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.

Conversely, if our sequelize-js query finds no other users related with said place, a different message appears.

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

Countries (/view/countries route)

Clicking the (+) button triggers an AJAX call to the /:action/country/:userId/:countryId endpoint.

States (/view/states route)

Clicking the (+) button triggers an AJAX call to the /:action/state/:userId/:stateId endpoint.

Cities (/view/cities route)

Clicking the (+) button triggers an AJAX call to the /:action/city/:userId/:cityId endpoint.

bucketbuddiez's People

Contributors

Recommend Projects

Recommend Topics

Recommend Org

Home Page (`/index` route)

Sign Up Page (`/signup` route)

Login Page (`/login` route)

Bucketlist Page (`/view/bucketlist` route)

Using a session in `Passport-js` and `Handlebars-js` templating, this page is unique to each user.

Clicking a (-) icon removes locations from the bucketlist using an `AJAX` call to our `API` endpoints.

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

Conversely, if our `sequelize-js` query finds no other users related with said place, a different message appears.

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

Countries (`/view/countries` route)

Clicking the (+) button triggers an `AJAX` call to the `/:action/country/:userId/:countryId` endpoint.

States (`/view/states` route)

Clicking the (+) button triggers an `AJAX` call to the `/:action/state/:userId/:stateId` endpoint.

Cities (`/view/cities` route)

Clicking the (+) button triggers an `AJAX` call to the `/:action/city/:userId/:cityId` endpoint.