TravelReel

• 

  Home Page

• 

  Saved Reels

• 

  Profile

• 

  Interactive Map with Legend

Inspiration

Our inspiration to do a travel journal comes from our mutual love of travel. All of the pictures included in the user's profile were taken by our team members on our travels, except for one. In implementing a design, we were inspired by a combination of the social media platforms including Yelp, Instagram, and VSCO. We wanted to combine the transparency of online reviews with social media in order to provide users with the best traveling experiences. The reviews of other friends and influencers can be saved and used to plan future trips and users can share their trips.

What it does

TravelReel stores information about travel history of locations visited in the format of a online journal or blog. It is created to be a social media platform.

How we built it

TravelReel was built using HTML, CSS, and JavaScript. Our team worked collaboratively using GitHub by creating individual branches and then submitting pull requests to merge branches with main. This web application involved the design of a single HTML homepage, which through the use of on click functions navigated away from the homepage to a different HTML file. All of these external HTML files navigate back to the homepage.

Challenges we ran into

Going into this hackathon the majority of the team had never used HTML, CSS, and JavaScript, our first challenge was learning the basic syntax of these languages. We came in with a intense idea that we wanted to build. While working, we run into many challenges with GitHub. However, through trial and error developed a truly an effective work flow.

Accomplishments that we're proud of

We are proud of our ability to work well together as a team through GitHub, a collaborative platform we were inexperienced with and learned to use effectively in VS Code. We watched several tutorials and got help from our fellow hackers who were more experienced with GitHub to learn how to properly perform pull requests, create branches off of main, push to the main branch, and resolve merge conflicts.

Being able to modify open-source code that is the interactive map in order for it to fill in the places we have visited and want to, is an accomplishment that demonstrates what we learned about HTML within a short time. We originally worked on building the map for a couple of hours before completely scraping the idea and doing something else. However, since we started over with something simpler, we were able to learn HTML and by 3 in the morning, we were fully able implemented the map the way we wanted to.

What we learned

Emily and I experienced our first hackathon, and we learned the foundations of multiple new languages including HTML, CSS, and JavaScript. Also, I have some limited experience with Git Hub while the rest of my team even had less experience with Git Hub, but we were all able to expand our knowledge and learn how to make branches and work as a team on one project and be able to seamlessly integrate all of our code together. - Tiffany

What's next for TravelReel

To further development on this project, we would expand the scope of locations to include all around the globe, not only within the United States. We began this process by including Japan into our user profile. We would also work with user input data to create the interactive map and profiles. This would then connect to the internet to allow friends and families to share their profiles and reviews. This could also work for influencers to help followers from anywhere in the world travel more efficiently. We set this future implementation up within our project by creating html pages for user profile, saved reels, and a space to create a new reel. These would be altered to affect the rest of the program based on the user input.

Built With

• canva
• css
• github
• html
• javascript
• vscode