# Prepare to interview

## Installing

1. Clone this repo and use this command:
```
npm install
```
2. Run server with `npm run dev`

> Please, don't watch files. This is example

## Tasks

1. Install React + TypeScript
```
npm create vite@latest
```

2. Install Axios
```
npm install axios
```

3. Create component `<Block />` with 2 props - title and children. It can be useful in the future
```tsx
<Block title="Title">
  <div>This is description</div>
</Block>
```

4. Create interface about Post using [this data](https://jsonplaceholder.typicode.com/posts):
```json
[
  {
    "userId": 1,
    "id": 1,
    "title": "sunt aut facere repellat provident occaecati excepturi optio reprehenderit",
    "body": "quia et suscipit\nsuscipit recusandae consequuntur expedita et cum\nreprehenderit molestiae ut ut quas totam\nnostrum rerum est autem sunt rem eveniet architecto"
  },
  {
    "userId": 1,
    "id": 2,
    "title": "qui est esse",
    "body": "est rerum tempore vitae\nsequi sint nihil reprehenderit dolor beatae ea dolores neque\nfugiat blanditiis voluptate porro vel nihil molestiae ut reiciendis\nqui aperiam non debitis possimus qui neque nisi nulla"
  },
]
```

5. Create `<PostList />` element where we have one prop `posts`. In the PostList you need to iterate `<PostItem />`. If we don't have posts, we need to show text `Not Found` or smth similar.

> Place it in `<App />`

5. In the `<App />` you need to fetch data from api endpoint using axios and place all posts to `<PostList />`
> https://jsonplaceholder.typicode.com/posts

6. Create `<PostListControl />` with button refresh. This button need to refresh this list from api.

> Place it in the `<App />`
>> In `<PostListControl />` you need to place 2 props: refresh and setRefresh

7. Add search field for `<PostListControl` and we need to filter these posts.

> Use `arr.filter` in the `<App />`