https://github.com/svetlanam/price-loan-calculator

This app is an example of my ReactJS code for the job interviews. It is loan pricing calculator, where when you change the values, you see different outputs.
https://github.com/svetlanam/price-loan-calculator

daisyui job-interview nextjs react tailwindcss typescript

Last synced: about 1 month ago
JSON representation

This app is an example of my ReactJS code for the job interviews. It is loan pricing calculator, where when you change the values, you see different outputs.

• Host: GitHub
• URL: https://github.com/svetlanam/price-loan-calculator
• Owner: SvetlanaM
• Created: 2022-06-28T11:23:11.000Z (over 2 years ago)
• Default Branch: main
• Last Pushed: 2022-11-20T12:25:27.000Z (about 2 years ago)
• Last Synced: 2023-08-05T10:51:56.422Z (over 1 year ago)
• Topics: daisyui, job-interview, nextjs, react, tailwindcss, typescript
• Language: TypeScript
• Homepage: https://jigglypuff.netlify.app/
• Size: 281 KB
• Stars: 0
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        
This app is an example of my ReactJS code for the job interviews. It is loan pricing calculator, where when you change the values, you see different outputs.

## Technologies

I built this project in these technologies:

1. TypeScript

2. NextJS

3. Tailwind CSS

4. ReactQuery

Interesting information about this implementation:

1. First initial data are loaded with NextJS GetStaticProps

2. When user create some 2 slider combination which is the same, data are cached and there are no additional request. It works even, when you are offline.

3. Default error screen

4. Network component for handling loading, error and data state

5. I used useRef instead of useState for getting values from the input sliders

6. Custom reducers instead of useState

7. Universal useFetch function for getting the data

8. Optimalisation - prevent additional API calls, when user moves with the slider.