Being high school students, we know that cramming everything to the last minute is a problem, especially when we are on other sites such as YouTube and Netflix. We wanted to create something to help us and other people tackle this challenge so that they can study efficiently and can do better in school.

What it does

When a user goes to the website, they enter the URLs of sites they deem as distracting. These sites are then blacklisted. There is an API running in the background which monitors the sites the users are on and then if they go on a site that they entered into the blacklist, they will get a notification telling them to be productive and to get off the site.

How we built it

We used HTML to make the front end client webpage. We used CSS to make the website look nice using styles. We got the users to input sites/keywords/software they deemed distracting and the inputs were sent in our express server. Then we used our API to our express server and then processed this data to use it to track when the user is not productive. We used js to transfer data from front-end to back-end. We used node.js to create the server and keep them running in the back.

Challenges we ran into

Because it was our first time using HTML, we had trouble creating the website and formatting it nicely. We also had trouble connecting to our API and making it track the user's site visits. We also had problems making the notification pop up when the user visited a blacklisted site. We had trouble applying the syntaxes of each language because we came with little experience with java only.

Accomplishments that we're proud of

We are happy that we were able to make the project work. We are happy that we learned a lot in this Hackathon that could help us in the future.

What we learned

We learned that for next Hackathons, we should strengthen our knowledge of HTML and js because they are used a lot. We also learned to plan earlier and to not leave things to do overnight because we were all very tired. Most importantly, we learned to work together and syntaxes of various languages that would help us in the future.

What's next for Distraction Extraction

We would like to make the overall appearance of the notification and the web page look more appealing.

Built With

Share this project: