Photo by Jakub Kapusnak on Unsplash

Solution

CodeSandbox

Explanation

This is one of those typical interview challenges where you need to finish or implement new features.

Let’s look at the requirements:

  • filter the list by profile name property
  • when user starts typing in the input the list should be filtered immediately
  • the filtering should be case insensitive possibility…

Photo by Jakub Kapusnak on Unsplash

Problem statement

NOTE! This challenge is based on the solution from the previous challenge, if you haven’t completed the previous challenge I highly recommend you to do that before continuing with this challenge.

In this challenge you have a list of profiles. Each item on the list is a doctor profile that…


Photo by Ben Sweet on Unsplash

Solution

CodeSandbox

Explanation

The key to solution lies in the key attribute.

When Vue is updating a list of elements rendered with v-for, by default it uses an “in-place patch” strategy. If the order of the data items has changed, instead of moving the DOM elements to match the order of the…


Photo by Ben Sweet on Unsplash

Problem statement

In this challenge you have a list of items. Each item on the list is a doctor profile that contains basic information of each doctor and a number of likes. …


Photo by Adam Bichler on Unsplash

Solution 1

CodeSandbox

Explanation

The issue was connected to how the events are handled and the difference between the event listeners applied to an HTML elements and a custom Vue.js components.

When we listen for an event on a custom component, the component should explicitly emit that event. There are situations though when…


Photo by Adam Bichler on Unsplash

Problem statement

In this challenge, you created a list of List of wonders of the Ancient World. When user hovers over an item on the list, a tooltip with a beautiful rainbow symbolising that it was a true wonder should appear. …


Photo by Evgeni Tcherkasski on Unsplash

Solution

CodeSandbox

Explanation

In the above code, we replaced a computed property with a watcher.

When using computed properties we cannot control how often the property is recomputed, if the dependency changes, the computed property will recompute immediately. We cannot delay the execution of a computed property.

To accomplish our goal we…


Photo by Evgeni Tcherkasski on Unsplash

Problem statement

You were asked to implement a search input that will filter an existing dataset.

You finished the task and is was working fine, but the requirements changed and we will use the API instead of a fixed list now. …

Mateusz Rybczonek

Frontend Developer

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store