Solvative

Technologies Used

Frontend: ReactJS, TypeScript.

Functionalities

Static Counter

Static Counter on Table

Country Flags

Dynamic Country Flags from Flags API

Using Flags API as the mentioned https://www.countryflagsapi.com/ is not working.

Search

Use keyboard shortcut ctrl + / or cmd + / to instantly start searching. Press Enter or Return to Search. OR wait 500ms for search to kick in automatically.

Debounce

A way that API calls are not made on every keystroke. Uses useDebounce a custom hook made my me, 'https://www.npmjs.com/package/@kushagra-aa/hooks-usedebounce'

Pagination

Pagination Updates depending on search result.

Custom Page Size

An Option to user to let user view as many items as user want on a page instead of default pageSize.

The max pageSize is capped to 10 due to restrictions from the API

No Data Found

Shows a NoDataFound element if the data in table is empty.

Responsive

All views are fully responsive up to 300px width.

Run Locally

Clone the repository:

git clone https://github.com/kushagra-aa/solvative.git

Navigate to the project directory:
```
cd solvative
```
Make a .env file and paste the values:
```
VITE_BASE_URL = 
VITE_RAPID_API_KEY = 
VITE_RAPID_API_HOST = 
```
You need to have the following environment variables, if you don't have them you get then from HERE(RapidAPI)
Install dependencies
```
yarn
```
OR
```
npm i
```
Run Frontend
```
yarn dev
```
OR
```
npm run dev
```