Scribd
Upload
18 views2 pages

Quantic - React - Js Project

The Quantic Technical Assessment requires a project built with Vite or Next.js, using TypeScript and Redux for state management, and Tailwind CSS for styling. It includes features like a data table component that fetches data from a REST API, form handling, and optional user authentication. Emphasis is placed on clear documentation, code organization, and maintaining clean code standards.

Uploaded by

paramktsolution
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
18 views2 pages

Quantic - React - Js Project

The Quantic Technical Assessment requires a project built with Vite or Next.js, using TypeScript and Redux for state management, and Tailwind CSS for styling. It includes features like a data table component that fetches data from a REST API, form handling, and optional user authentication. Emphasis is placed on clear documentation, code organization, and maintaining clean code standards.

Uploaded by

paramktsolution
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 2

Quantic Technical Assessment (React.

JS)
v1.29

Core Requirements

1.​ Vite or Next.js Foundation: The project must be built using either Vite or the Next.js
framework
2.​ TypeScript Integration: All code must be written in TypeScript, ensuring strong typing
and improved code maintainability.
3.​ Redux State Management: Utilize Redux Toolkit for managing application state,
including actions, reducers, and selectors.
4.​ Tailwind CSS Styling: Implement Tailwind CSS for utility-first styling, ensuring a
responsive and customizable design.
5.​ Data Table Component:
○​ Integrate a Shadcn UI data table component or build a custom equivalent.
i.​ Example: https://ui.shadcn.com/examples/tasks
○​ Fetch and display data from a REST API within the data table.
○​ Implement features like sorting, filtering, and pagination.

Additional Requirements

1.​ API Integration:


○​ Fetch data from https://jsonplaceholder.typicode.com/todos
i.​ Documentation is available here: https://jsonplaceholder.typicode.com
○​ Handle API errors gracefully and display appropriate feedback to the user.
○​ Use Redux Rtk and create service file for fetching data,
2.​ Data Fetching and Caching:
○​ Implement efficient data fetching strategies using Next.js's `getStaticProps`,
`getServerSideProps`, or client-side fetching.
○​ Consider using caching mechanisms to improve performance.
3.​ Form Handling:
○​ Include a form to create, update, or delete data.
○​ Implement form validation and error handling using react hook form and zod.
4.​ Authentication and Authorization: (Optional, but highly valued)
○​ Implement user authentication using NextAuth.js or a similar library.
○​ Restrict access to certain features or data based on user roles.

Documentation and Code Quality

1.​ Clear Documentation: Provide clear and concise comments throughout the codebase.
Explain the purpose of components, functions, and key logic.
2.​ Code Organization: Adhere to best practices for code organization, including consistent
naming conventions and separation of concerns.
3.​ Clean Code: Write code that is easy to read, understand, and maintain.

You might also like