TechTogether
Published in

TechTogether

4 Hackathon Project Ideas for Beginners

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. 💡

--

--

--

TechTogether, the nation’s largest initiative to address the gender inequities in the hackathon community, supports over 10,000 hackers. TechTogether is credited in part with increasing the gender diversity of the hackathon community by 18% from 2019 to 2020.

Recommended from Medium

Getting Started With Your First three.js Project: Part Two — The Build

An Introduction to Vue.js

What is React.js Framework & Should You Use It for Your Project?

Beginner tutorial for NodeJS, express and MongoDB

JSONP → SOME → XSS

What Happens When a Shitty Coder Builds Your Backend

Array Methods Which Every JS developer Must Master

10 JavaScript Array methods to simplify your code.

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Fiona Whittington

Fiona Whittington

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

More from Medium

Lets grow more internship

My Internship Experience

Internship with LetsGrowMore

LGMVIP — WEB DEVELOPMENT INTERNSHIP EXPERIENCE