This is a small frontend React application using the https://jsonplaceholder.typicode.com API. This project was bootstrapped with Create React App and Typescript, by running npx create-react-app my-app --template typescript
. Additionally, it uses the following react libraries:
- Axios - Promise based HTTP client for the browser and node.js
- React Router DOM - Enables dynamic routing in a web app
- MUI - Prebuilt UI components used to create the grid system np
Clone or download this repository, then run npm install
and then npm run start
.
The application has 2 pages:
Fetches a list of entries provided by this url: https://jsonplaceholder.typicode.com/users.
The following properties are displayed on the user list page:
- username
- name
- link to website.
When the user clicks on the fetched entry (the card or the table row), the user gets navigated to the entry page.
The page gets displayed when the user has clicked on the entry he/she wants to visit.
Fetches the details from the endpoint https://jsonplaceholder.typicode.com/users/{id}, where the {id} is the entry id that has been selected.
The page displays the following properties:
- name
- username
- address city
- phone
- website
- company name.
When the user clicks on the website that has been displayed he/she is navigated to the website in a new tab.