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 🙌
-
Clone this repo locally:
$ git clone https://github.com/ferreiro/facebook-hackathon.git
-
Go to the project folder and run:
$ yarn install
-
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.
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.
- 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.
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.
- Twitter: https://www.twitter.com/jgferreiro
- Linkedin: https://www.linkedin.com/in/jgferreiro/
- Instagram: https://www.instagram.com/jgferreiro/