Project 2: Beat That!
Last updated
Last updated
Create a version of the Beat That dice game, where players create the largest number they can by concatenating random dice roll digits. Read the rules for Beat That .
Have a look a some past student's project to visualise the game - and for inspiration :)
Fork and Clone the .
There are 2 players and players take turns.
When a player clicks Submit, the game rolls 2 dice and shows the dice rolls, for example 3 and 6.
The player picks the order of the dice they want. For example, if they wanted the number 63, they would specify that the 2nd dice goes first. You can choose how the player specifies dice order.
After both players have rolled and chosen dice order, the player with the higher combined number wins.
Player 1 rolls 2 dice with dice rolls 3 for Dice 1 and 6 for Dice 2.
Player 1 can pick either Dice 1 or Dice 2 as the first numeral of the combined number.
Player 1 picked Dice 2 as the 1st numeral and Dice 1 as the 2nd, thus generating the combined number 63. Player 2 then rolls 2 dice and tries to generate a number greater than 63.
If you get stuck, or are unsure on how to start, Bryan will walk you through how to go from breaking down the problem to completion of the Base version of Beat That!
Having fun making your game look good? Feel free to explore more HTML and CSS on your own! Here are some resources:
Try implementing some, or a combination of, the following feature groups. Feel free to include any other additional features you think of.
Score
Keep score for each player. The score is the running sum of all numbers that player has generated so far. This means there is no permanent winner, only a temporary leader.
Leaderboard
When outputting game results in the output box, also output a leaderboard that lists the 2 players and their scores in decreasing order.
Please leave your name and section number _in the title_ of the pull request.
Please fill in the questionnaire in the pull request comments when you submit.
Please only refer to the reference solution after you have attempted the project. Note that there are many ways to implement the project and the reference solution is only 1 way.
Your game is working as intended, now it's time to make it look good! We'll edit index.html to personalise our game. If needed, review on how to edit HTML.
At line 29 of index.html, try changing background-color: pink;
to background-color: lightblue;
or any of your choice!
Add 1 or more after line 64 with instructions on how to play Beat That! It can look something like this:
FreeCodeCamp's and basic
W3School's CSS and .
the commits in your local repo to GitHub.
to submit your assignment.
(includes Score, Leaderboard, and Lowest Combined Number Mode)