Piano Recording Task

This repository contains the instruction and codebase for an interview task at flowkey.

If anything here is unclear or any questions come to your mind, don’t hesitate to contact us - we’re here to help you!

Task Instruction

Please copy this codebase to your Github/Gitlab account using Github Importer / Gitlab Importer or by cloning it (don't create a fork!). Then add a Pull Request implementing the following functionality:

Enable the user of the app to record a sequence of keys played on the Piano UI as a "Song" and replay it.

Implementation requirements

• Focus on clean, readable code and simplicity
• Use the graphql-server to store and retrieve songs (here the docs for client-side Queries & Mutations)

Product requirements

• Provide a button to start/stop recording a sequence of keys played on the Piano UI
• Define a song title when storing a song on stop recording
• Show a list of stored songs with title
• Enable replaying stored songs with a small play button next to the title (with correct timing of replayed keys!)

Here a very simple example of what the UI could look like:

IMPORTANT: It does not have to look like this, that's just an example!

Provided Codebase

The codebase consists of:

• a minimal React piano-app based on the react-piano package
• a graphql-server based on Apollo

Basic infos and how to run instructions for both parts can be found in the according READMEs in each directory.