prefecthq / memory

Junior Frontend Developer Coding Challenge

Memory

Memory (also known as Concentration) is a card game played with one or more players. Using a standard card deck (including both jokers) the players shuffle the deck and lay all of the cards face down on a surface and two cards are flipped face up over each turn. The object of the game is to turn over pairs of matching cards. Concentration can be played with any number of players or as solitaire. Wikipedia has a good description of the game.

Your challenge is to build Memory in the browser with the requirements below.

Guidelines

Setting Up

1. Clone this repository
2. Change the remote to a private github repository under your username
3. Push code to that remote
4. Develop

Submission

This project should be submitted by adding @stackoverfloweth and @zhen0 as collaborators to your cloned repository on GitHub. Once you've done so, please send an email to [email protected] and [email protected] to confirm your submission.

Recommended IDE

• VSCode
• Volar (vscode extension) is registered as a workspace recommended extension.

Local Development

To start, install the project dependencies.

npm install

Transpiles and hot-reloads for development

npm run dev

Lints and fixes files

This project is setup to use the same ESLint config our frontend developers actually use. https://www.npmjs.com/package/@prefecthq/eslint-config. The workspace settings (assuming you're using vscode) are setup to automatically fix any fixable eslint errors on save.

Resources

• Vue docs
• Game description

Making your work public

The work you do on this project is your own. As such, you can make it publicly available at your discretion (on your GitHub, as part of a portfolio etc.).

If you plan to make this repository public, please do not do so until after your submission has been graded (we'll let you know when that is!). In addition, please remove or replace Prefect in the <title> block of the root html file (found in /public/index.html), the <link> and <meta> blocks between the comments in that same file, as well as the associated logos in that folder. Last, please remove or replace the Prefect logo in the root application file (found in /src/App.vue) and the associated .svg found in the assets folder.

If you haven't modified the index.html file as part of your challenge (you shouldn't need to), you can run the following command from the root of the project directory to automatically remove / replace all of the above:

$ mv public/index-template.html public/index.html && \
  rm public/{*.png,*.xml,*.ico,*.svg,*.webmanifest} && \
  mv src/assets/vue-logo.svg src/assets/logo.svg