• 

  Home page; view groups w/ next hangout; view users; view all upcoming hangouts; edit group name and create new hangout

• 

  create a hangout by using our search system paired with a map api

• 

  select date and time with interactive interfaces

• 

  commit to hangouts

• 

  see who else is coming, decommit if you can't attend a hangout so everyone is aware

Inspiration

Social media is an amazing way to connect people together, but it's still hard to plan a hangout. In our case, we can never decide and commit to a place and when we do, the plans we make get flooded in our group chat and everything is ambiguous and things rarely work out. So, we decided to create a simple, dynamic web app that allows users to get together in groups and plan hangouts while also finalizing who is able to come.

What it does

Plannet lets you sign in using your Google account and from there you can create a group or join an existing one using a unique code. You can create a hangout, where you will be prompted to enter a date and a time, along with a place to meet using a maps API. Everyone in your group can commit (and decommit, if they want) to a hangout, so everyone is on the same page as to where and when the group is going to hangout.

How I built it

The pages are initialized in HTML and CSS, with jQuery powering the client-side functionality. Our server is written in node.js and it interacts with a GraphQL database. Our server and client both handle routing with Express.js

Challenges I ran into

We wanted this app to be easy to use and efficient, so making dynamic webpage functionality was a challenge. Every button had to create a package to send to the server to perform its function, and also parse the response from the server to update the page accordingly. This involved a lot of planning and fleshing out, so we had to take a step aside from hammering out code and take time to communicate our ideas to each other so that the connection between server and client would be as smooth as possible

Accomplishments that I'm proud of

The central functionality of our application, joining groups and committing to hangouts, was very intricate in terms of implementation. The server had to handle doubly linked relationships (users have a list of groups while groups have a list of users, etc), and the client had to dynamically generate or remove info cards on these users and groups. However, with effective server to client communication we eventually got this structure to work seamlessly. This was mostly made possible by our communication and teamwork more than it was by our programming skills.

What I learned

Teamwork is really useful! Everyone in our team had varying skill sets, so it was a worthwhile investment of time to sort out our roles and convey our ideas to each other clearly. Making a web app with so many features could not have possibly been a one man job in such a short window of time, so taking the time to maximize the efficiency of our four person team really paid off in the end.

What's next for Plannet

There's so many more quality of life functions that we can implement to fulfill our vision of effective hangout planning, such as choice voting on places to go and email notifications preceding the hangout time. Really we are just looking for any new ways to make this app ideal for planning hangouts as easily as possible.

Built With

• html
• javascript