1 of 20

Hackathon 101

README: [Link]

2 of 20

Overview

  • What is HOTH?
  • General HOTH Information
  • Forming a Team and Idea
  • Plan your Project & Technology Stack & Version Control
  • Make a Demo
  • Tips

README: https://tinyurl.com/hack101-readme

README: [Link]

3 of 20

What is HOTH?

  • Beginner Friendly Hackathon
  • Supportive mentorship
  • Explore and experiment
  • Learn new skills
  • Meet cool people and have fun!

README: https://tinyurl.com/hack101-readme

README: [Link]

4 of 20

What is HOTH?

  • HOTH is a 12-Hour event where people collaborate to create technology-based projects in a limited time

​

README: https://tinyurl.com/hack101-readme

README: [Link]

5 of 20

Overview

​

  • What is HOTH?
  • General HOTH Information
  • Forming a Team and Idea
  • Plan your Project & Technology Stack & Version Control
  • Make a Demo
  • Tips

README: https://tinyurl.com/hack101-readme

README: [Link]

6 of 20

General HOTH Information?

https://hoth.uclaacm.com/

README: https://tinyurl.com/hack101-readme

README: [Link]

7 of 20

Overview

​

  • What is HOTH?
  • General HOTH Information
  • Forming a Team and Idea
  • Plan your Project & Technology Stack & Version Control
  • Make a Demo
  • Tips

README: https://tinyurl.com/hack101-readme

README: [Link]

8 of 20

Forming a Team

  • If you already have a team you’re good to go!
  • If you don’t have a team join our Discord where you can talk to people and find teammates
    • Join the Discord: https://discord.gg/gwaaFS2fah
    • Don’t be afraid to reach out to people you know if you have a cool idea you want to build

README: https://tinyurl.com/hack101-readme

README: [Link]

9 of 20

Forming an Idea

  • Check the HOTH website for the themes we announce
    • Align your project idea to one of these tracks
  • You can also check out past projects that have won HOTH for inspiration
  • Practical, useful, innovating, achievable, cool
    • Many times you WILL need to pivot your idea while hacking

README: https://tinyurl.com/hack101-readme

README: [Link]

10 of 20

Overview

​

  • What is HOTH?
  • General HOTH Information
  • Forming a Team and Idea
  • Plan your Project & Technology Stack & Version Control
  • Make a Demo
  • Tips

README: https://tinyurl.com/hack101-readme

README: [Link]

11 of 20

Plan your Project

  • You want to have a solid plan before you start building your idea
  • Some key considerations
    • Technologies
    • Divide up the work
    • Is this achievable, if not rethink your approach or idea
    • Start small and work up

README: https://tinyurl.com/hack101-readme

README: [Link]

12 of 20

Technology Stack - Project Type

  • Website:
    • Some popular choices for frontend
      • React, Angular, [HTML, CSS, JavaScript]
    • Some popular choices for backend
      • If you don’t have time to learn a backend tech stack -> Firebase
      • Flask (Python) -> Simple
      • Node + Express
    • If you have no experience then HTML, CSS, + a little JS is the way to go
    • For frameworks React + Vite is the way to go check out the react workshop!
  • Mobile App:
    • Swift (Mac)
    • React Native
  • Game Dev
    • Can use game engines such as Unity (Beginner Friendly)
    • C#
  • Workshops: https://github.com/uclaacm/hothXII-workshops
    • Game dev, react, [HTML, CSS, JS]

README: https://tinyurl.com/hack101-readme

README: [Link]

13 of 20

Technology Stack - Databases

  • Do you have data to store. If so, how are you going to store it?
  • Relational
    • DB entries correspond to a row and column in table
    • Popular choices: PostgreSQL, MySQL, SQLite (local)
  • Non-Relational
    • Data is stored as documents
    • Popular choices: MongoDB (Beginner Friendly), Cassandra, Amazon DynamoDB
  • Or if you chose the route to simply have Firebase as your backend you can store information using Firebase
  • Databases workshop

README: https://tinyurl.com/hack101-readme

README: [Link]

14 of 20

Technology Stack - APIs

  • Used for integrating third party functionality into your applications
  • Example: I am making a personal music visualizer and I need my listening history data
    • Spotify API
  • Popular Choices
    • OpenAI API for GPT-4o and more models
    • Google APIs
      • Maps, Places, Gemini
    • X (Twitter) API
  • Workshop: web api

README: https://tinyurl.com/hack101-readme

README: [Link]

15 of 20

Version Control

  • You ideally want a way to collaborate with your teammates effectively on your project
    • Assign features
    • Merge changes
    • Keep track of incremental development
  • Git & Github
    • Check out our workshop on git

README: https://tinyurl.com/hack101-readme

README: [Link]

16 of 20

Overview

​

  • What is HOTH?
  • General HOTH Information
  • Forming a Team and Idea
  • Plan your Project & Technology Stack & Version Control
  • Make a Demo
  • Tips

README: https://tinyurl.com/hack101-readme

README: [Link]

17 of 20

Make a Demo

  • For HOTH a video demo is required to be reviewed by the judges
  • Presentation is key
  • Make your final product is marketable!
  • What to include?
    • Your process
    • Brief Technical details
    • Scalability?
    • Future prospects
  • Don’t worry about small mistakes!

README: https://tinyurl.com/hack101-readme

README: [Link]

18 of 20

Overview

​

  • What is HOTH?
  • General HOTH Information
  • Forming a Team and Idea
  • Plan your Project & Technology Stack & Version Control
  • Make a Demo
  • Tips

README: https://tinyurl.com/hack101-readme

README: [Link]

19 of 20

Tips

  • Don’t be afraid to ask for help!
    • Mentors
    • Team Members
    • Use online resources effectively
    • Discord
    • Workshops
  • Panels during hackathon
  • Other workshops we have in Hack archive
  • Don’t let setbacks frustrate you and HAVE FUN!

README: https://tinyurl.com/hack101-readme

README: [Link]

20 of 20

HAVE A GOOD TIME AT HOTH!

README: [Link]