Code Monkey home page Code Monkey logo

smg's Introduction

Sequence memory game

The player has to pick the correct items in the order shown

Introduction

Welcome to the Letgo Fullstack technical test!

For this test we want to see your skills and knowledge by developing a small and fun game: Sequence memory game.

We expect from you clean and well structured code.

The Game

Each round adds one random item to the end of the sequence. When the sequence is finished the player has to click on the items in the order shown to pass to the next round.

Example

We have 4 items, lets say: Dog, Cat, Horse and Frog:

  • the first round Cat is highlighted and the user should click on Cat to pass to the next round.
  • for the second round Cat is highlighted and then Dog, so the user should click on Cat and then Dog.
  • for the third round Cat is highlighted, then Dog and then Cat again (because it is random, so items can be repeated), so the user should click on Cat, then Dog and then Cat again to pass to the next round.

This is a video of another example about this game but with colors: youtube video

Requirements

You should use this project to develop your solution and use React with Redux (they are added in package.json file along with redux-thunk, react-dom, and react-redux)

For us is important that the candidates have strong styling knowledge so we expect from you an attractive and responsive solution (no ui frameworks like bootstrap, material-ui...)

You can use your favourite style library/preprocessor such a less, stylus, sass or any CSS-in-JS...we use styled-components. Bear in mind that depending on the tool you choose you may need to add some configuration to the webpack.config.js file.

The items should be fetched from a public API like https://pokeapi.co/. You can find many of them in the following repository: Public APIs list.

The API chosen should allow you to fetch a specific number of items. For example, with the pokeapi you can call https://pokeapi.co/api/v2/pokemon?limit=9 which returns the first 9 pokemon. The number of items is up to you, but should be more than 3. You can use your favourite library for fetching data. We use axios.

Javascript standard style is also installed and it will be run each time you commit something. We want to see how you adapt your code by working with a different style guide.

Bonus

  • Data from multiple APIs and combining them (For example, combine pokemon API with Marvel API to show pokemons and Marvel characters)
  • Animations
  • Sounds
  • Server side rendering
  • Unit tests

Additional features are very welcome :)

How to deliver

Compress your solution (without the /node_modules and /build folders) and send us the zip file

How to run the project

  • Install the dependencies by running yarn install
  • Launch dev server by running yarn start
  • To create the production bundle just run yarn build

If for your final solution we need to run something else (like yarn test for unit testing for example) please add it here :)

smg's People

Contributors

calmsz avatar

Watchers

 avatar James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.