ads6495/assignments

week 04 - day 04 - minesweeper -

Closed this issue · 2 comments

ads6495 commented

Minesweeper

In this assignment, you will communicate with a back-end API server to create the user-interface for a Minesweeper clone. It might help to familiarize yourself with the game if you've never played it.

Objectives

  • Understand how state drives changes to an interface in React
  • Respond to user events in React
  • Understand and use REST APIs
  • Use React lifecycle methods
  • Understand and interpret API documentation
  • Use fetch or axios to perform POST request or

Requirements

Read over the documentation for the API we'll be using:

https://minesweeper-api.herokuapp.com/

You will need to interpret the response and render a graphical user interface. The API results include an array of arrays (two-dimensional array), these represent rows and columns. These are probably best translated into table rows (<tr>) and table data (<td>) cells.

Here's an example implementation of this assignment:

Explorer Mode

  • Create a new game when the page loads, and render it on the screen, this look as close to gif as possible.
  • Style the cells appropriately.
  • Left clicking a cell performs the check action
  • Right/secondary clicking a cell performs the flag action
  • When the game status changed to won or lost, show a victory or failure message.

Adventure Mode

  • Before creating the game, prompt the user to choose: Easy, Medium, or Hard mode.
  • Have fun with the styling, make it your own

Epic Mode

  • Render your victory/failure message as it's own "screen".
  • On that screen add a button to restart or play again.
  • Store the current game id in localStorage, and render the same game, rather than creating a new one every time (until the player presses the restart button).
  • Add sound effects.

Additional Resources

ads6495 commented

after a long 2 days, 2 restarts and help from fellow classmates, we did it. Definitely could use more practice this week with react syntax and axios.