Coding Projects
Overview
Task Define
Develop a one-page application that retrieves a list of users from an API (mocked fetch) and displays them in a table. The table should have sortable columns for name, email, birthdate, and age (calculated from birthdate). Additionally, implement pagination to display a limited number of users per page. Make sure the table design is responsive. Include filters to search and filter users by name, email, or age.

Requirements:
  • Use Vue with TypeScript for building the application.
  • Use Vue Hooks for managing state and side effects.
  • Mock the fetch function to retrieve user data.
  • Display user data in a table with sortable columns (ascending and descending).
  • Implement pagination to display a limited number of users per page (e.g., 10 users per page).
  • Create an aesthetically pleasing UI design for the users' page (we recommend using PrimeVue as external UI library).

I found an API that includes names, emails, and birthdates. To implement it, I used PrimeVue for the UI library and Moment.js for age calculation. The complete code can be found in my GitHub repository. https://github.com/Lavasanii/GridCal
Name
Email
Age
Birthdate
max mustermannmax_mustermann@example.com341990-09-01
Jane Smithjane@example.com391985-05-15
John mustermannJohn_mustermann@example.com142010-12-15
Jason nicolasJason_nicolasn@example.com202004-12-15
Sophia Millersophia.miller@example.com331992-04-20
Liam Johnsonliam.johnson@example.com371987-11-10
Olivia Brownolivia.brown@example.com232001-07-05
Noah Davisnoah.davis@example.com102015-02-18
Emma Wilsonemma.wilson@example.com481976-09-30
William Taylorwilliam.taylor@example.com261998-12-25