Skip to content

chris-butterworth/nc-final-project

Repository files navigation

NC-Anagrams: The Game you never knew you needed!

Quick Links



The NC Anagram Game is now live & ready to be played! 🥳 🚀

  • Click the link above to go and start your single or multiplayer game
  • Got friends you want to play with? Send them a link & get them to join your room!
  • Don't forget to sign ini f you want your scores to be counted & submitted to the Leader Board!



🧐 Why a game?

This game was created as the final project piece of five budding engineers at the end of a 13 week software engineering bootcamp run by Northcoders. It is a project that took 3 days to spike & plan & 8 days to build.

We thought that a game would be an interesting way to explore some new technology & put our skills to the test. Our course has not just been about learning languages & frameworks, it's about problem solving & being comfortable with learning new technologies as we go.

Our MVP was to build a single player broweser based game utilising web sockets, beginning the structure of a micro-services game by having multiple servers (Flask & Express) rendered using React & Material UI. We think that we've done a pretty good job & have surpassed our MVP goals. We hope you have fun playing!

👨‍💻 Getting Started

If you're here you'll want to know how to get going:

  • Clone this repo

  • Run the React app + the express server in 2 seperate terminals.

Terminal 1

cd server
npm i
npm start

Terminal 2

cd client
npm i
npm run dev

The server requires a .env.development file with the following vars declared

API_USERNAME=
API_PASSWORD=
API_URL=

🛠️ Tech Stack

React  Material UI  Socket.Io  HTML  CSS  JavaScript  Firebase  PostGres Flask

We used Flask and PSQL for our back end, as we wanted to challenge ourselves by exploring Python based alternatives to express. Our express server acts as a conduit between the client and the backend API. Using socket.io to handle all gameplay, player and room logic. The auth token firebase provides also made sending authentication and user details from the react app to the flask server a simple process allowing for streamlined user authentication. We used React and MUI on the front end for their easily stackable components, which was well suited to our short time frame, and allowed for high levels of customisation.

⚠️ Contributors

This game was created by:

Charlotte Cody

LinkedIn GitHub

Chris Butterworth

LinkedIn GitHub

Lex Smith
LinkedIn GitHub

Phil Gallagher
LinkedIn GitHub

Simon Walgenbach
LinkedIn GitHub


🌟 Spread the word!

If you want to say well done and/or support any of us in our engineering adventures

  • Add a GitHub Star to the project!
  • Connet with us on socials & let us know what you think

Thanks so much for your interest in our game, like all engineers, we're for hire, so drop us a line if you've got any intersting projects that you'd like some keen and agile minds to look at!