Go | Devpost

Home Page

Inspiration

Everyone in college has had the experience of someone coming up to them with a survey that they need filled out. Maybe you were that person- whether it be for your business class or a club. Even professors need to gather data from students for their research. It's not easy to get 30, 40, or in some cases 100+ people to do your survey! Some students resort to faking data, taking away from the integrity of their work, and worse, sometimes impacting real actions or events on campus based on that data. Professors too have their own problems with collecting survey data, often forcing unwilling students to complete these surveys as part of their grade or through the mandatory MRE program. We intend to fix this.

What it does

Our website, Survayyy, smoothes out the problems with taking and administering surveys in college. The solution? Make people want to complete surveys. Here's how it works:

People with surveys they need data from upload these surveys to the website in our Create A Survey section.
These get added to our database of surveys, which is displayed in the Do A Survey section.
Other users, who want to do surveys, can browse through this section and choose which they want to do.
But who wants to do surveys? That's why you get a small kickback for doing each survey, a few cents, which incentivizes users to actually complete them.
This is funded with ads for local businesses, possibly along with Google Adsense. This process is a win-win for the community- spreading the word about these businesses while benefiting students.

How we built it

Survayyy was built using React + Vite with TypeScript. Vite gave us access to a fast development server and a quick setup time, while TypeScript proved to be a good choice over JavaScript in that we were able to manage our types to a closer degree.

Challenges we ran into

After working with various databases for quite a bit of time, we realized MongoDB wouldn’t function the way we wanted it to due to the way we had formatted our vite/react project. As a result, we resorted to other options such as firebase and LocalStorage which worked well. Additionally, we were coding with typescript, and most of the youtube tutorials which we relied on to help us were in javascript which led to many type errors. To address this, we furthered our knowledge in typescript to understand why these warnings/errors were happening and also used AI to help us. Lastly, we also had quite a few errors in our CSS due to resolution changes affecting the way our webpage displayed on different screens. We fixed this for the most part by changing any pixel values in the css to relative values such as vh and rem.

Accomplishments that we're proud of

Seeing as neither of our main coding languages are typescript/javascript, for us to create a webpage with functional frontend and backend was already a huge accomplishment. For our first hackathon, we feel as though our motivation persisted throughout and we are proud of the way we kept on track for nearly 18 hours straight with very few breaks. Lastly, we are very proud of the CSS animation for when you switch to the next survey and both the frontend and backend that went into it.

What we learned

-Complex CSS animations - How to use O-auth systems - How to create multiple webpages in one react project - How to connect node.js backend to MongoDB - Better understanding of typescript and react