Our inspiration is rooted (pun intended) in the engaging blogs people make on the internet about their passions! In this case, we took the theme of gardening and made it into a fun educational website to help people who want to garden learn the basics.
Gardening 101 covers multiple aspects such as tools needed, avoiding pests, how to grow your plants efficiently, and even a detailed calendar of when you can plant seeds for different vegetables. In addition to these informational pages, we made a Test Your Knowledge page that has a quiz on the things that were covered on the website!
We used the online IDE called Glitch to create our website using HTML, CSS, and even Javascript for the quiz page! From being in our Intro to Digital Tech class in 9th grade, we learned how to use HTML and CSS and we applied this for the hackathon. Our team figured out how to make a quiz for the first time with Javascript using variables and functions and it turned out great :)
One major problem we encountered was positioning images and text. We realized that setting a relative position for the elements would not be efficient at all and would make the elements move all around our project, so we decided to use absolute positioning with specific pixel distances. It was a bit tedious and it felt like we were placing a picture frame on a wall and saying "mmm a little more to the right- wait no, too far!", however, we managed and got it to what we wanted.
We are extremely proud of how we learned bits of Javascript last minute to make a quiz and how we made a whole website from scratch using our scattered knowledge of HTML and CSS in only 2 days! Another thing to mention is that we remembered the importance of giving credit to pictures and captioning them with the license info. We knew that this project would be seen by others and we had to make sure to establish that the pictures weren't ours.
The experience for this hackathon was great and we learned that teamwork was an essential part of putting this website together. From dividing up the work into different topics to reading each other's code and seeing mistakes that the other person couldn't see, we all realized that teamwork truly does make the dream work.
We all loved the hackathon process and using our whole day to code a fun project together by calling through Discord. One thing that we will do from now on is to learn more code so we can do a different type of project next time and enrich ourselves in coding. Since this was our first hackathon, we all didn't know as much as others, but hopefully, we can get better and learn more! We also will make sure to coordinate with each other better and make sure all of us know when to work. Communicating with each other for team projects is necessary!
Log in or sign up for Devpost to join the conversation.