Following is a set of exercises that we would like you to complete (e.g provide code examples). As there are plenty of different ways to approach each exercise it is important to understand that we are not looking for a specific answer; there is no right or wrong. Each exercise will merely serve as the foundation for a discussion where we can learn about your thought process and pick your brain regarding specific decisions that you made implementation-wise. Please review each exercise and get in touch with us if you have any questions or concerns, preferably prior to submitting your solutions.
Last but not least, some guidelines.
- You should fork the main repository and create a separate branch (named accordingly) to each of the exercises.
- You should implement all exercises (except number 5 and 6) in vanilla javascript without the help of any third party libraries.
- For exercise 5 & 6, you may use create-react-app unless you prefer doing all the heavy lifting yourself
With that said; good luck!
Given the array (see line 3 in script.js) which consists of objects holding information regarding some amazing companies, we need your help to wrap the name and location of each company in a LI and attach it to the unordered list (#list) that we've already set up for you. Go!
Neat, that worked out well. Splendid! But... Being the curious cats we are, we would also like to know when someone clicks on a specific company in the list. Help! A console.log will do just fine, but you can get all fancy too if you happen to wear that hat.
We all know that requirements change over time - and the time for great change is now. Imagine that the array of companies has increased in size/length and suddenly contains some 100000 elements. Ouch, that's plenty! Given this rather drastic change, are there any (one is good, two is great, three or more is awesome) specific optimization strategies that you can employ to your implementation from exercise 2 to better fit the current conditions? Hint; think of optimization in terms of code readability and memory usage rather than focusing on optimizing for speed.
This time around we need to implement a feature which allows us to filter the displayed list of companies based on the company's location. The requirement is that a user somehow should be allowed to select multiple locations to be filtered. How would you deal with this?
For this exercise, you can assume that the array of companies only contains the initial elements
Framework time! How would you reimplement exercise 4 in React?
Framework time, redux! How would you reimplement exercise 4 using React and Redux (for state manegement)?