Our biggest recommendations are to:
With those recommendations in mind, here are some technical resources and strategies to optimize your hacking!
(Disclaimer: this document is opinionated. Our goal is to provide a way to get hacking quickly. It's based on technologies the writers have experience with and can vouch for, as well as technology stacks that are known to do well in hackathon environments. The best hack is the working hack, use the technology that makes the most sense for your project and your team.)
(Disclaimer: this is about true web-apps where lots of interaction javascript is necessary. If you just need to display some data: this is likely too much)
In a hackathon environment our recommendation is to build a web-app as a client-side (in the browser) experience using a popular frontend framework like React or Vue. Your web-app is code that can be served by Github Pages or Netlify, and it will call your server directly to fetch data once it's loaded in the browser. We recommend this because by doing this you can separate any server-side work you're doing from the website and then join up the two pieces of your hack at the end by wiring up the network requests. It's likely easier to mock the API requests in your FE app and then flesh it out later than to try and actively coordinate on the same code.
If this architecture sounds right based on the needs of your hack, we recommend using React because of Create React App. CRA takes care of all the painful pieces of using a javascript framework by abstracting over the entire toolchain and letting you focus on actually writing code (perfect for a hackathon!). React has a few other options for deploying React code listed on their docs here.
There are more options that let you achieve technology advantages like server side rendering (SSR), but in a hackathon setting the configuration complexity likely is not worth it.
Create a New React App - React
If you don't need the power of a web-app, you can render templates into the html and css (and add small amounts of js) using a server. What server you use depends entirely on you, pretty much every web server has tutorials about serving your website from it. Scroll down to the servers section and check it out. (You could also serve your website from a cloud function but it'll likely load slowly)
(Disclaimer: Hackathons aren't the best way to learn native mobile development from scratch. There's a lot of setup involved to get things running, and debugging can be painful. If you want to build for mobile we recommend building responsive web apps.)
React Native · A framework for building native apps using React