A full stack web app to settle disputes

Posted by : at

Category : Tech


Settld-It App

A full stack web application for settling disputes

It was late one night, I was laying down in my bed with my partner and we had a disagreement. Which was the preferred whipped topping of our family? I fervently argued that Cool Whip was better, while my partner maintained whipped cream is the ultimate dessert topping. We wanted to ask our friends what their preferences were, we could text them all but decided to try to make a web app to settle this dispute. We made a web app that would allow us to create and share simple questions. We would then tally the results and see who was right. We called it Settld-It.

Check out the web app here Settld-it.

The Key Features

  • User generated questions
  • Time limits for questions
  • Shareable button to send link to friends on different platforms
  • Answer questions and count
  • (in beta) - Text me when question closed
  • view all active questions
  • view all closed questions

The Tech Stack

  • Angular
  • Firebase Reatime Database
  • Firebase Hosting
  • Firebase Cloud Functions
  • Firebase Cloud Tasks
  • Twilio API for Text messages

The Process

The Idea

I was laying in bed with my partner and we were discussing the merits of Cool Whip vs Whipped Cream. We wanted to ask our friends what their preferences were, we could text them all but decided to try to make a web app to settle this dispute. We made a web app that would allow us to create and share simple questions. We would then tally the results and see who was right. We called it Settld-It.

The Design

I started rigging up the ui and other things with a cool white board web app I found Excalidraw.

white board drawing white board drawing white board drawing white board drawing

The began the process of actual coding. The front end is developed with Angular and Material Design For the back end I wanted to get more familiar with Firebase. I have used it in the past, but not for a full stack application. I used the realtime database to store the questions and answers. I used the cloud functions to create a task to send a text message to the user when the question is closed. I used the cloud tasks to schedule the task to run at the end of the question. I used the cloud hosting to host the web app. The text messaging aspect is still in beta, as I am working through learning to process of learning and connect Twilio to Firebase. I am using the Twilio API to send the text messages.

Some useful links for the tech. Connect Firebase Realtime NoSQL Cloud Database with Angular Project Angular Firebase Functions Building a web application with Angular and Firebase Angular Udemy Course

page

Conclusion

Through this project I brushed up on some concepts and became much more familar with the Firebase platform. I also learned a lot about Angular and Material Design. I am excited to continue to work on this project and add more features.


About Tim Truty

A researcher with a passion for new tech and connecting people with devices. Technology advances to help people and the world. All things tech interest me as well as 90s pop punk and some hacky sack. All the views expressed here are solely mine and do not represent any organization.

Categories
Useful Links