There are two ways to participate in our coding challenge -
- By cloning this repo and using the Github Flow
- By downloading the entire project directory as a compressed folder
We would like you to follow the Github flow to participate in the coding challenge if you are familiar with Git and its ecosystem. However, in case you are not familiar with Git, please feel free to download the project directory and then complete the Challenge
- Clone this repository
- Follow the Github Flow
- Complete the requirements listed in the Challenge
- Open a pull request!
- Download this project direactory as a compressed folder (
frontend-challenge.zip
) - Complete the requirements listed in the Challenge
- Email the compressed folder to [email protected] or to the person with whom you have been interacting!
- Run npm install
- Run
npm start
to run server - Open
http://localhost:3001/
in browser, if you seeHere you go!
text in the browser that means server is successfully running - Please find
index.html
in thepublic
folder - Now you can start your coding!
Here are the list of api end points necessary for this challenge.
Your challenge is to design a web page which shows trends percent contribution in the form of pie chart as shown below: You have to write html, css for this web page. If you face any problems please contact us.
Make this API call to get the list of countries to show them in dropdown.
Make this API call to get the list of trends of selected country.
Interactions
You can select country either from anyone or both the dropdowns.If you select a single country,then you have to show trends for that country else if you select countries from both the dropdowns, then show common trends of those countries.
The trends have to be displayed in the bottom-lef of the page as shown in the image
-
Calculate wieght of each trend as follows
- Assign weights 1 - 26 to alphabets from A-Z
- For all the special characters like #, $, -,... weight is 0
- For all the digits, the "value" is the "weight" like for 1 its 1, for 2 its 2 and so on.
- After assigning weights, calculate the weight of trend by adding wieghts of each character
-
Add the weight of all trends
-
Calculat percentage contribution for each trend
Display this percentage contribution of all the trends in a piechart as shown in image.on hover highlight that part of the chart.