Explore

Flux - Diagram Assignment
Flux - Diagram Assignment

👋 Intro

Thank you for taking the time to do this assignment! We know your time is valuable, so rest assured that we’ll be reviewing the exercise thoroughly. The exercise is also directly relevant to the work you would be doing at Flux, so it will also allow us to speed up the interview process!

⏳ Time Estimate:

About 4 hours

🔍 Problem description:

Build a simple diagramming application to allow users to create shapes and connect them in a hierarchical order. Child shapes should be able to inherit certain attributes, like the label of the parent or each child has a different gradient of the parent color. For example, ideally, child labels would change in real-time as the parent label gets edited.

Local storage should be used to preserve the created diagram when refreshing the page. We would also love to have any documentation you feel is relevant.

🎉 Bonus:

Feel free to implement or add any features you like, like letting users draw free hand shapes, or other things.

This sketch is only an example and you are free to implement it in any way you feel it is right to the user. Use your creativity.

⁠

👀 What we like to see from you:

How you shape the UI and user experience. Build it the way you would publish it as a simple app for users on a webpage

The understanding of reacting architecture and life cycle

Addressing how you would add syncing in real time via two clients

Planning for corner cases that come from certain user patterns

The code quality. Since we tightly work together we need clean and expandable code. Hint: Writing self-documenting code is a huge plus

🪄 Deliverables:

A git repository hosted on a service of your choice (example Gitlab, Github, etc.) that we can check clone to build and run your app on a local environment

Any documentation or things you would like us to see

If you added tests, feel free to include them as well

Want to print your doc?
This is not the way.

Try clicking the ⋯ next to your doc name or using a keyboard shortcut (

CtrlP

) instead.