Welcome to ajaib-web-engineering-test 👋

This project is about Ajaib Web engineering test, a simple project to fetch fake API to show user table data with functionality of search, filter, sort, reset fiilter, pagination. This project have unit test with minimal test.

Tech stack :

• ReactJS & NextJS
• Ant Design
• React Query
• Axios
• Typescript
• CSR (Client Side Rendering)
• Jest
• Testing library react
• mswjs (mock network request to API)
• State management using React Query, Query Params

Pages :

• Login Page (input any email & password) it will save into cookies
• Dashboard Page (this is the list of data from fake api)

Folder Structure : Based on feature domain drive, every pages will have feature folder and from feature folder will have separate logic, separate view, separate model etc.

Better Web Perfomance using React Query, it will cache the response of API, so if the network request hit the same endpoint and still have the cache, it will show the cache data from react query and will refresh the data if the cache became stall.

Demo URL

https://ajaib-web-engineering-test.vercel.app/dashboard Login with any email & password ex : email : [email protected] pass : test

Install

yarn install

Usage

create .env file
copy from env.local.example to .env file
yarn run dev

Run tests

yarn run test

Author

👤 Ikhlas Risandy

• Website: https://www.ikhlas-risandy.my.id/
• Twitter: @ikhlassandy
• Github: @kucira
• LinkedIn: @https://www.linkedin.com/in/ikhlas-risandy-a8b4a552/

Show your support

Give a ⭐️ if this project helped you!

---

This README was generated with ❤️ by readme-md-generator