Recently at school during the pandemic, I've had to struggle with constantly switching between different apps and websites on my device throughout the day. When I realized that I would have a chance to fix this problem during an upcoming hackathon, I immediately thought of this. At first we thought that school websites already did this, but upon further investigation, we realized that school websites were clunky, old fashioned, and did not have enough functions to justify using much .

What it does

Stulife is an all-in-one student website meant to provide everything students need during their school day. It provides the weather, a calendar, daily news, a dictionary, and an organized note-taking app.

How we built it

We used Visual Studio Code's live sharing extension so that everyone could work on the same files together. Stulife was built using HTML5, CSS3, JavaScript, node.js, multiple free widgets, as well as Merriam-webster dictionary and openweather map's API.

Challenges we ran into

Throughout the Hackathon, we had a couple of rough patches when we were unable to figure out how to properly code some functions. An example of this is the embedded map in our website, as well as a failed attempt to create a login function on the website.

Accomplishments that we're proud of

Although we had a couple of issues during the Hackathon, we were very happy to find clever solutions to creating the note-taking app, weather searching app, the dictionary, as well as the embedded school calendar.

What we learned

Since the majority of our website used HTML5 and CSS3, we got a chance to have more hands-on experience at making our own project, and figuring out issues with our code ourselves. Our less experienced members had a chance to learn HTML and participate in the process of creating the website.

What's next for Stulife

We plan to keep on adding new features to the website such as a login page, as well as the ability for the calendar to sync to the student's school accounts and display their classes. Once we are able to get that working, there are many other possibilities such as linking the notes made on the notes web app to the student's classes for even more organized learning.

Share this project: