We're both big fans of web development. We started playing around with React recently, and thought that it would be an interesting challenge to build a hack that is front-end heavy. We wanted to learn how to use React along with Flux in the client side so we thought we would build one of the most retro video games!

How it works

React's one-way data-binding and virtual DOM makes re-renders very smooth, so we used it along with Flux to write all of our game logic. On the server side, we use Node.js websockets to hold open connections with each client. When an action occurs at one client, it passes along this event through a websocket to the server, which then broadcasts this change to all other clients, allowing them to change state as necessary.

Challenges I ran into

We were both fairly new to React and very new to Flux (neither of us used it before), so it took a while for us to go through some tutorials/readings to understand the infrastructure of how to set up our game.

Accomplishments that I'm proud of

We learned one of the most exciting and upcoming front-end frameworks and built a game (an exciting challenge that is very different to regular web development)

What I learned

Both of us learned a lot about React, Flux and using sockets with React. We also learned that we should plan out our code architecture before starting to hack (haha)

What's next for Snake

There are still several rough edges (like any hackathon project) so we'd love to clean those up and host it for our friends to play. We'd also love to add a lot more styling to our UI.

Share this project: