Frontend Developer - Website Builder

As a Frontend Developer at Konigle you will be developing various website design components that can be used to build functional and beautiful websites using the Konigle website builder. The key objective of this assignment is to test your core technical skills for HTML, CSS and vanilla Javascript (no frameworks), and ability to think creatively.

Here is a task that could take up to 3-4 hours of your time to complete.

The assignment

Your task is to design the navigation component present on https://miro.com/ with the following changes

1. The first navigation group only opens upon button click instead of hover.
2. The signup button opens a signup modal / popup

Reference :

Screen.Recording.2023-12-11.at.10.51.26.AM.mov

Tasks

1. Design the responsive navigation bar component using plain HTML, CSS, Javascript (if necessary). Implement transitions as present on the example.
2. You are required to trigger a popup upon clicking the Signup button. You don’t have to design this popup. However, the popup itself is provided by another library and you are required to find a way to communicate with it in order to open it.
3. Come up with a JSON data structure for storing the data that is required by this navigation component.

Bonus

1. Propose and develop a different design of this navigation(contents, links remain same). State what type of websites can use this new design.
2. Use Tailwind CSS for styling the component.

Deliverables

1. A github repo containing the functional component
2. Instructions to how we can preview the component
3. A short video of working component.