4 Hackathon Project Ideas for Beginners

Fiona Whittington
Published in
3 min readJan 14, 2021


If you’re reading this post it’s likely because you’re about to attend your first or second hackathon and you’re not sure what you want to make.

I hope this list helps showcase all the projects that you can make in just 36 hours of hacking.

Photo from TechTogether New York.

1. Make a Website with HTML, CSS, and Javascript

Websites are the most popular types of hackathon projects among beginner hackers. This is because they are quick and easy to make once you learn the basics of HTML/CSS.

The fun thing about making a website is that they can range in their design and function. Once you learn the basics, there is so much you can add to your website that will help you further your design, project management, and coding skill-sets. For example, once you learn the fundamentals of HTML/CSS you can then learn to add interactive elements to your site with Javascript. The opportunities for learning, growth, and opportunity are endless in the field of web development.

Lastly, most mentors will know the ins and outs of web development. Therefore, you don’t have to worry about getting stuck. Any good hackathon will have mentors available to help you whenever you feel like you need it.

🔗 Top 10 Project-Based Tutorials for Learning HTML/CSS/Javascript

2. Make a Data Visualization with Python

There are many open-source datasets available online that you could use in your hackathon project. Kaggle is a great resource to find and use these datasets.

One idea for a hackathon project is to use a dataset to create an artistic data visualization. For a more technical route, you could use Python to analyze a dataset for meaningful insights.

🔗 Kaggle is the world’s largest data science community with powerful tools and resources to help you achieve your data science goals.

3. Make an Interactive Prototype with Figma

Yes, you can submit a prototype for a hackathon project. Yes, not all hackathons are about learning to code.

If you want to focus on creating a hack that has a brilliant design then consider creating an interactive prototype using Figma for your hackathon project. If you go this route, I would focus on making sure your prototype is interactive to help the judges understand how your project would work if functional.

🔗 Build better products as a team. Design, prototype, and gather feedback all in one place with Figma.

4. Make a Simple Game or Tool in Javascript

There are many different projects you can make with Javascript. For example, you can make a calculator, to-do list application, and automatic URL-shortener (see link below for tutorials).

If you already know how to use HTML/CSS try pushing yourself to create a project with Javascript. It might be harder, but it will be worth it (especially when you can show it off to your friends).

🔗 Top 10 Project-Based Tutorials for Learning Javascript

Interested in attending a hackathon and getting access to more articles like this one? Subscribe to TechTogether’s bi-weekly newsletter. 💡



Fiona Whittington

A marketer with a passion for startups, technology, and education.