As a user, I want to be able to post about travel locations and provide comments and ratings. As a user, I want to be able to look at other users posts and search travel locations by rating.

Related tags

React Travel-bug
Overview

Travel-bug

Table of Contents


User-Story

As a user I want to be able to look at travel locations and see comments, photos and ratings to plan my next trip.

Description

To collab with teammates to develop a full-stack web application. Travel Bug is a webpage that hosts travel locations posted by users that allows individual users to browse for travel information and like locations to save to their personal login page. It also, lets the user create new location posts for other users to see in the homepage and lets them rate 1-5 stars on their trip/experience going to that location.

Preview

travelbug-preview

Installation

  • Download Travel-bug repo to local file
  • Open files in VS Code
  • Type "npm install" or "npm i" in command line
  • Update .env file to have your mysql username and password
  • Login to mysql "mysql -u root -p", add password
  • Type "CREAT DATABASE travelbug_db;" and "source db/schema.sql;" and "USE travelbug_db;" and then "quit"
  • Type "npm run seed" in command line

Usage

  • Type "npm start" in command line to run the server locally
  • Or visit our webpage

Packages

Contributions

Group collaborators:

Tests

  • If you'd like to test the routes, run the server using Insomnia

License

The MIT License (MIT) Copyright © 2022

Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the “Software”), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:

The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.

THE SOFTWARE IS PROVIDED “AS IS”, WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

Questions

If any questions arise..

Comments
  • Feature/mobile responsive

    Feature/mobile responsive

    Description

    • Made the app more mobile-friendly
    • Couldn't figure out the my travels page spacing in desktop mode
    • got rid of the new tabs... I would end up with so many tabs! I can add them back in
    opened by mimi5930 0
  • Feature/styling

    Feature/styling

    • finally made the cards the equal in height/size
    • made the location titles bolder, bigger, kept the text decoration so the user knows its a link to click on
    • updated the footer to sit at the bottom of the page and mimic the header
    • page is somewhat dynamic but still is not responsive to smaller screens like an iphone
    opened by Metelak 0
  • User Likes

    User Likes

    how are we allowing the user to like different locations?

    the seeded users show their liked locations in their personal dashboards, but what about if you want to like another location on the homepage?

    opened by Metelak 0
  • Deactivate Like button (optional)

    Deactivate Like button (optional)

    Description

    It might be nice to deactivate the like buttons if the user has already liked it. We do currently have some functionality where an alert will appear if you try to like something twice, so this edit is optional.

    enhancement 
    opened by mimi5930 0
  • rating limit on location cards

    rating limit on location cards

    • limit the amount of ratings that can be shown and transport user to page that lets them see all the ratings... kind of like the comments
    • or we can average the ratings on the location cards and then allow user to see list of the ratings for single location
    opened by Metelak 0
Owner
Megan
Megan
A Webapp related to Crypto go and have a look shows every thing you want to know

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Kamal joshi 3 Oct 19, 2021
ReactJS-Travel-Website - This is a travel(adventure) website made with ReactJS.

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Saurav Dhakal 1 Jan 1, 2022
This is a custom recipe app called chefMaster. which contains a lot of interesting such as many apis requests, filter, search , add posts. Property design

In the project directory, you can run: npm start Runs the app in the development mode. Open http://localhost:3000 to view it in the browser. The page

Andrew Smal 0 Nov 9, 2022
A system for sharing tests between students. In RepoProvas anyone can look up old tests for their subjects and teachers or send old tests to help other students!

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Rui Neto 6 May 10, 2022
A simplified Telegraf plugin to provide users with a great interface.

telegraf-pagination A simplified Telegraf plugin to provide users with a great interface. Getting started Prerequisites You need to have telegraf inst

Alisher Ortiqov 8 Nov 21, 2022
A Google Clone which built with ReactJS. You can click the demo and search whatever you want!

Google Clone with ReactJS A small web app that imitate the desktop web version of google site, you can search whatever you want. Google Clone Demo Lin

Özge Coşkun Gürsucu 36 Aug 14, 2022
A web application for a company that provides commercial and scientific space travel services. The application allows users to book rockets and join selected space missions.

Space Travelers' Hub A web application for a company that provides commercial and scientific space travel services. The application allows users to bo

Manel Hammouche 8 Oct 14, 2022
This compress library was made with Brotli and Gzip help, for React users who want to make website more performance and reduce JS bundle code

React-compress This compress library was made with Brotli and Gzip help, for React users who want to make website more performance and reduce JS bundl

Koma Human 30 Jan 6, 2023
CEP is a software platform designed for users that want to learn or rapidly prototype using standard A.I. components.

Cortic Edge-computing Platform (CEP) CEP is a software platform designed for users that want to learn or rapidly prototype using standard A.I. compone

Cortic Technology Corp. 137 Jan 1, 2023
A Facebook Clone which built with reactJS. You can sign in with your Google Account and send realtime posts.

Facebook Clone with ReactJS A Facebook Clone application that you can sign in with your Google Account and send realtime posts. Facebook Clone Demo Li

Mert Çankaya 23 Nov 25, 2022
Create posts for ubccsss.org using the GitHub REST API

content manager for ubccsss.org Create posts for ubccsss.org using the GitHub REST API Installation $ git clone [email protected]:ubccsss/content-manager

UBC Computer Science Student Society 2 Sep 15, 2022
JavaScript data grid with a spreadsheet look & feel. Works for React, Angular, and Vue. Supported by the Handsontable team ⚡

Handsontable is a JavaScript component that combines data grid features with spreadsheet-like UX. It provides data binding, data validation, filtering

Handsontable 17.4k Jan 1, 2023
Look it is a web application developed with React JS and using Sanity

Look-it social media app Look it's a web application that consists in a social media app where users who have registered can share all kinds of photos

Irmin 1 Feb 1, 2022
⚡️ Look for Covid-19 Resources, Get Vaccine Availability Notification, Complete source code for covidrescue.co.in website.

covidrescue.co.in ⚡️ Get real-time, verified leads on Oxygen, Remdesivir, ICU, Beds, Food and more based on your location. Get notifications on Vaccin

Placeholder Tech 15 Jul 10, 2022
A hotel reservation app displays all the existing hotels and details of each hotel, allowing the user to reserve the hotel they want.

Reservify A hotel reservation app displays all the existing hotels and details of each hotel, allowing the user to reserve the hotel they want. Allows

David Vergaray 9 Oct 6, 2022
POST stories. GET features.

User Story Introduction The goal of User Story is to design and present a scalable backend infrastructure that delivers a web interface allowing users

EOS UI/UX Solutions 38 Jan 5, 2023
WPPConnect/mobile is an open source project with the objective of automating whatsapp web using the android or ios mobile browser and being able to perform all the functions of our wa-js project

WPPConnect/mobile is an open source project with the objective of automating whatsapp web using the android or ios mobile browser and being able to perform all the functions of our wa-js project, so it is possible to create a customer service, media sending, intelligence recognition based on artificial phrases and many other things, use your imagination to change and modify this project or collaborate on improvements...

null 11 Dec 28, 2022
Web application that consumes an API to provide an complete experience of an recipes app

Project: Recipes App Project developed studying in Trybe. Technologies and tools used React React Hooks Context API SCRUM / Kanban Project objective T

Ádran Farias Carnavale 0 Jun 14, 2022
Gnome Shell extension to provide a flexible applications dock (WIP).

Flexi Dock (WIP) Gnome Shell extension to provide a flexible applications dock. Installation The easiest way to install this extension is via the offi

Hardpixel 3 Aug 29, 2022