What I built
DevicePolice is a small tool that helps you curve your habit of spending too much time on your device. As a result of COVID-19 and the quarantine, more people are staying at home and consequently spending more time on their device. However, staying at home doesn't mean you have to give up all activities. There are plenty of things that you can do in the comfort of your own home.
How it works
- A user sign ups for an account using their phone number.
- They get transported to a dashboard or pieces of one at least 😰
- They set a timer. How many hours, minutes, or seconds they want
- Request is sent to Node and Express server.
- The server starts a timer independent of what state the client is in => you can close the browser or refresh the page and the timer is still running.
- When the timer is over, you get a text message to your phone reminding you to get off your device! It also includes a recommendation for something else you can do 😄
Note: there is also a feature to delete your account if you no longer want to use it. We don't keep any of your information (phone number, etc...) after you delete your account 👍
Demo Link
Check it out!
Device Police
Link to Code
frontend
If you just want to try it out locally:
git clone https://github.com/htnguy/device-police-frontend.git
git clone https://github.com/htnguy/device-police-backend
How I built it
Backend
- NodeJS - server runtime for JS
- Express - web framework
- Mongoose - ODM that makes working with MongoDB feel like heaven
- MongoDB - database for storing users, verification tokens, etc...
- Twilio Node Helper - The whole point of this hackathon => Makes interacting with Twilio SMS API much easier.
- JSONWebTokens - authentication
- Bored API - getting a random activity that you can do instead of being on your device.
Frontend
- React - the wonderful UI library that we all know and love.
- Gatsby - Awesome static site generator
- Axios - making API Request from client
Deployments
Backend - Heroku (it is free and super easy to deploy your node app)
Frontend - Netlify - great hosting for Gatsby and React app.
Both of these have continuous integration with Github => push new changes => redeploy app 😄
Walls that I bumped into
- Coming up with an idea - This part was the most difficult aspect about this project. I was so conscious of what other people have done, so that this project doesn't seem redundant.
- Authentication - this app does not store any emails or other credentials besides your phone number and a password, So coming up with a reliable and secure way of authenticating a user was one of the top priorities.
Top comments (6)
How did you handle deploying all this?
I'm interested into building something as well!
The deployment was pretty simple. Node server on Heroku and front end with gatsby on Netlify.
I definitely should checkout heroku some day! 😁
I am used to AWS but I feel like it's overkill for a side project!
Agree
Hi guys, you can check out our platform Microtica (microtica.com), it sounds like it would be a perfect solution for what you're looking for. It's based on AWS, but abstracts the overkill of cloud setup and microservice deployments with Kubernetes. Try out our free package and let us know if we can help you in anyway :)
Thanks for recommendation. I will consider it for future projects