👨‍🎤 Jorge Ferreiros's hackathon starter kit

When we won a hackathon organized by Facebook, I spent the night before setting up a good dev environment, so we could focus on building features, rather than wasting time setting up the local dev.

I got some messages from people asking me if I use any template for hackathons, so I decided to extract the template from our Hackathon project, so everybody interested can fork and use it 🙌

1. How to install and develop locally?

1. Clone this repo locally:

   $ git clone https://github.com/ferreiro/facebook-hackathon.git

2. Go to the project folder and run:

   $ yarn install

3. Now in order to develop locally you simply need to run:

   $ yarn dev

   This will create two servers, one of the backend servers and the other one a dev server for the react application.

2. Hot reload

In development, all your frontend assets and the app will be automatically rebuilt on changes while updating the browser.

Note: If you do changes to the backend, you will need to manually refresh the website. Sorry guys didn't have time to do this (and it's late now)! haha.

3. Tech stack

• React: It's a JavaScript library for building user interfaces created by Facebook.
• Webpack: It's an open-source JavaScript module bundler. It is primarily built for JavaScript, but it can transform front-end assets like HTML, CSS, and images if the corresponding plugins are included.
• Express: It's a web application framework for Node.js. It is designed for building web applications and APIs.

4. Architecture: Yarn Workspaces

Yarn workspaces let you organize your project codebase using a monolithic repository (monorepo). I used it to built this project. If you wanna learn more, I wrote an article about Yarn Workspaces for Smashing magazine.

My social networks

• Twitter: https://www.twitter.com/jgferreiro
• Linkedin: https://www.linkedin.com/in/jgferreiro/
• Instagram: https://www.instagram.com/jgferreiro/