Trip Tips

A Full-Stack Web Application

Created as Project 2 during UPenn Coding Bootcamp. The challenge was to create a full-stack web application that utilizes the MVC paradigm and our own server-side API, AJAX calls to get, pull and push data, Node.js for back-end, Express.js for routing, MySQL for saving data, and HTML, CSS and Bulma for a polished user interface.

User Story

• AS A traveler,
• I WANT to be able to create and share trip itineraries, including my suggestions for people visiting cities,
• SO THAT they can organize a trip and obtain user recommendations from other travelers and locals.

Overview

Trip Tips is an application that assists the user in creating, viewing, and reviewing user-generated trip itineraries including itineraries for the most visited cities in the US. If the city the user is searching for is unavailable, the user can create their own itinerary for that city. The user is able to email this itinerary to themselves. The user will also save the itinerary for other travelers to view, and functionality allowing users to add reviews to existing itineraries on the page, creating a social aspect to the application. It utilizes a clean, easy-to-use interface that makes planning for a trip clean and organized.

Utilizing the App

• Experience the deployed app on Heroku: Here
• View the original repository: Here
• User is routed to "Login" page, where the user can "Login" or click to "Sign Up"
• After the user signs up, they can view exisiting itineraries on the main page. If the user has used this itinerary the user can input a review for that particular city to "Post a Review" to our page so other users can view.
• The user can also "Create Your Own" where they are routed to a page where they can create their own itinerary, and "Save" it to our database where it will be added to our main page, or "Email"
• The user can also input dates, and a city to "Search for Events" so they have suggestions of activites during their trip.
• When the user is complete, they can "Sign Out" to be directed back to the "Login" page.

Demonstrations

Log In or Sign Up:

Create your Own Itinerary & Search for Events:

Tech used

• HTML
• CSS
• Bulma
• Javascript
• jQuery
• Eventful API
• Node.js
• MySQL
• Sequelize
• NPM packages
  • express
  • animate.css
  • mysql2
  • passport
  • passport-local
  • sequelize
  • sequelize cli
  • nodemailer
  • express-handlebars

Contributers

• Sean Cummings - Full-Stack Development - Sean Cummings
• Didier Delphin - Full-Stack Development - Didier Delphin
• Alyssa Cucunato - Full-Stack Development - Alyssa Cucunato
• Dioris Diaz - Full-Stack Development - Dioris Diaz