A game where the object of the game is to connect four game tiles in a row, with each player alternating turns dropping a gamepiece into one of seven columns. A win can be four continguous tiles stacked vertically, horizontally, or diagonally. The architecture is designed to allow for matrices of different sizes and require a variable number of tokens "in a row" for a victory, but the defaults for all of them are a classic 7x6 matrix aiming for 4 in a row.
The motivation for this project was to create an application to utilized basic HTML, CSS, JavaScript, and Web API skills. Having a landing page allowed us to practice with different layouts and frameworks, introduce ourselves as nascent programmers, and demonstrate our coding capabilities, especially in JavaScript.
On the surface, a simple game of four-in-a-row seems like an easy exercise. However, there are still some interesting logical challenges required to make the game successful, especially around the Win Conditions. This game allowed us to practice the logic and syntax that we had learned in the program thus far.
-
Commit Often. And push your changes! There is little to be gained by working independently on a file (or multiple files) with the aim to have a grand reveal and big "ta-da!" On the contrary, it can create frustration and duplicate work and even delay progress on functions that require integration across multiple files.
-
Google is your friend. With a basic understanding of the syntax and use of your respective languages, you can start to utilize code provided by others on Google to get an example of what you might be trying to achieve. You don't need to have an encyclopedic memory of all of the methods to be able to recall and use them!
-
Communication is KEY. It's important to communicate with your team what you're currently working on in the project. Often what happens is more than one teammate may be working on the same HTML, CSS, or Javascript file, and only one teammate's code will be used. Communication helps to delegate tasks efficiently and ensures that all teammates are working on different aspects of the project.
-
Make sure your MVPs are complete. Sometimes as programmers, we get excited about adding cool features to projects that would make the project pop out more. In order to add those cool features, you have to make sure that you have a working product first. Without a working product, features are useless.
-
Learning #5. And a short description of the Learning.
If your README is long, add a table of contents to make it easy for users to find what they need.
What are the steps required to install your project? Provide a step-by-step description of how to get the development environment running.
When you're ready to play, simply press the "Play Now" button on the homescreen, where you will be taken to the empty gameboard.
Upon initial gameplay, the system will prompt your for the players' names, so that it can address each of you by name and help you understand whose turn it is.
This code was written by the following individuals:
- Ryan Gayle
- Stuart Gross
- Jonathan Hummer
- Sheikh Iftekhar
Major props to Google, and w2 Schools, and Stack Overflow for support.
Additional Support from our instructors and teaching assistants at Columbia University:
- Rich Hosek
- Max Ohsawa
- Jeremy
MIT License
-
This project features cool animations such as the pieces dropping into the Array of Sunshine gameboard. The pieces bouncing once it hits the bottom of the board or on top of another piece added realism to the game.
-
Animations added to the homepage such as game pieces flying across the screen and growing text added a bit of flare that should excite visitors to play the game.