Skip to content

👨‍🎤✨Hackathon Starter Kit with a React app and a Express.js backend using yarn workspaces. It includes Webpack configured to hot-reload assets

License

Notifications You must be signed in to change notification settings

ferreiro/hackathon-starter-kit

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

38 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

👨‍🎤 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

About

👨‍🎤✨Hackathon Starter Kit with a React app and a Express.js backend using yarn workspaces. It includes Webpack configured to hot-reload assets

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published