DamianHr / ng-recruitment

Created with StackBlitz ⚡️

iREP

Welcome to the igus Recruitment Entry Project, the iREP is a small project which will help us evaluate your skills and abilities.

Before we start

Setup

First let's make sure that we are working in good conditions. You can fork this project from its Github repository or work on the online IDE StackBlitz ⚡️.

Working with an external IDE

1. Clone the iREP repo : https://github.com/DamianHr/github-phvsk3-grpbff.git
2. Install the project
3. Run the application
4. Explore the app

Challenge #1 - We want flags!

Using the different info inside the project, modify the app to display a new column containing the flag of each country. Make sure that all the acceptance criteria are met.

Acceptance criteria:

• The new column is on the very left of the table (mat-table in countries/countries.component.html)
• The header of the new column is labeled Flag
• The flag has the following styles:
  • a width of 25px
  • a continuous black border of 1px
• No additional queries are used to achieve this task
• Examples about the current API response can be found here

Challenge #2 - We want filters!

Inside the file src/app/countries/countries.component.ts, finish to implement the function filter(), then use this function to organize the data in the country table. Make sure that all the acceptance criteria are met.

Acceptance criteria:

• Do not change the signature of the filter() function
• The filter() function is only returning data matching the following rules:
  • The population of the country is higher or equal to 20M people
  • The name of the country starts with one of the letters ['b', 'g', 'l']
• The filter() function passes the tests present in src/app/countries/countries.component.spec.ts
• The filter() function is applied to getData() to see the filtered data in the app
• You are allowed to use Mozilla's Javascript doc

Challenge #3 - We want order!

Inside the file src/app/countries/countries.component.ts, finish to implement the functions sort() using the TDD approach, then use this function to organize the data in the country table. Make sure that all the acceptance criteria are met.

Acceptance criteria:

• Do not change the signature of the sort() function
• The sort() function is written using the TDD approach
• The sort() function passes the tests present in src/app/countries/countries.component.spec.ts
• The tests of the sort() function cover all the branches of the function
• The sort() function is applied to getData() to see the sorted data in the app
• You are allowed to use Mozilla's Javascript doc

Good luck ! :)