HacknFair

Inspiration

The idea for HacknFair(called zfair at first) was born out of my own experience of missing out on a physical science fair. I realized there was a need for an online platform that could bring the excitement and engagement of science fairs to everyone, regardless of their location. Initially, the focus was solely on science fairs, but after some insightful feedback from Wayne Sutton, I started to see the potential for HacknFair to also serve as a platform for hackathons. This dual-purpose approach sparked the concept of "HacknFair," a platform that caters to both budding scientists and tech enthusiasts.

What it does

HacknFair is an online platform that allows users to create and participate in science fairs or hackathons. Event organizers can set up fairs, receive and evaluate submissions, and ultimately select winners. Participants can submit their projects, receive feedback, and engage with the community through upvotes, downvotes, and comments. The platform empowers both judges and the community to be involved in the selection process, with judges making the final decision on winners.

How I built it

HacknFair was built using Convex, which provided the backend infrastructure for my application. I started by designing the core features: creating fairs, submitting proposals, and enabling voting. As the project evolved, I integrated rich text formatting powered by BlockNote, added a secure commenting system, and developed a robust authorization mechanism to ensure only authorized users could edit or delete content. I also implemented a loader component to enhance the user experience while data is being fetched. The landing page for unauthenticated users was the latest addition, providing a welcoming entry point for new visitors.

Challenges I ran into

The journey wasn't without its challenges. The biggest hurdle was learning to manage both frontend and backend development simultaneously. Ensuring security, especially with the commenting and voting systems, required careful planning and testing. Another challenge was making the user interface both functional and visually appealing, which involved iterating on the design multiple times. Integrating rich text formatting also presented its own set of challenges, but it was worth the effort to provide a better user experience.

Accomplishments that I am proud of

I am proud of several key accomplishments:

• Comprehensive Feature Set: HacknFair is packed with features, including rich text editing, upvoting/downvoting, and a seamless submission process.
• User Experience: The platform's UI/UX was carefully designed to be intuitive, making it easy for users to navigate and participate in fairs.
• Versatility: What started as a science fair platform has the potential to be used for hackathons as well, showcasing the flexibility of the system.

What I learned

Building HacknFair has been an incredible learning journey. As a frontend developer with limited backend experience, diving into full-stack development pushed me out of my comfort zone. I learned how to integrate various functionalities, from implementing secure authentication to creating dynamic user interfaces. The process taught me the importance of balancing aesthetics with functionality and how to build a user-friendly experience from the ground up.

What's next for HacknFair

HacknFair is on a mission to transform how virtual science fairs and hackathons are conducted. My immediate focus is on enhancing the judging experience with an advanced dashboard and customizable evaluation criteria, ensuring the best projects are recognized.

However, my vision extends beyond just fairs and hackathons. I see immense potential in the educational sector, where HacknFair can empower schools and universities to host academic competitions. This platform will encourage students to showcase their skills and creativity, fostering innovation and collaboration among the next generation of thinkers and problem-solvers.

I believe HacknFair can become the go-to platform for educational competitions, bridging the gap between talent and opportunity.

Built With

• convex
• next.js
• tailwindcss
• typescript