- Fork the repo: https://github.com/arunoda/next-apollo-demo This is a basic app using Next.js & Apollo GraphQL.
- We would like you to update Next.js, React, Apollo GraphQL to the latest versions.
- Refactor the code as deemed fit. Brownie points if you use some of the latest features of react like Hooks, Suspense Lazy etc.
- More brownie points if you use TypeScript.
- Create a GraphQL Query and Resolver that will generate a dummy list of about 2000 names with their addresses, email and phone numbers. Feel free to use any fake data generator library, btw love https://www.npmjs.com/package/casual
- Create a New Page in Nextjs where you display these names and addresses as a grid of card tiles. The page needs to be responsive.
- Add a type ahead search that allows me the search/ filter the list by typing the first 3-4 characters of a name.
- Add the necessary security features to protect the site from things like XSS, Clickjacking etc.
- Implement Lazyloading / Infinite scrolls so that you load 20 cards each time you click a ‘Load More’ button, which you would need to create.
- Add Unit Tests using Jest and React Testing Library.
- Dockerize the server and client app and use docker-compose so that we can run the app locally using docker-compose.
- Deploy your App on Heroku. And send us a link to the app.
- Install cypress and create a working test.
- Write cypress end to end test for the page you created.
- linter / formatter ( eslint / prettier being a good default choice)