0% found this document useful (0 votes)
28 views1 page

FD Internship Assignment Question

The assignment asks the developer to build a React application that fetches 100 comments from an API, displays the first comment for each post as a "post" that can be filtered by postId on the left, and shows associated comments on the right when a "post" is clicked, with both sides scrollable. The developer must host the project on GitHub and CodeSandbox, and will be evaluated on React component structure, data fetching/rendering, filter implementation, associated comment display, scrollability, code quality, and optional UI design.

Uploaded by

Abhishek Gupta
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
0% found this document useful (0 votes)
28 views1 page

FD Internship Assignment Question

The assignment asks the developer to build a React application that fetches 100 comments from an API, displays the first comment for each post as a "post" that can be filtered by postId on the left, and shows associated comments on the right when a "post" is clicked, with both sides scrollable. The developer must host the project on GitHub and CodeSandbox, and will be evaluated on React component structure, data fetching/rendering, filter implementation, associated comment display, scrollability, code quality, and optional UI design.

Uploaded by

Abhishek Gupta
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/ 1

AulaCube Technologies Private Limited

www.aulacube.com

Assignment Question:
Assignment Title:
Building a React Component with Comment Filtering and Hosting.

Assignment Description:
Your task is creating a React application that fetches 100 comments from a public API, displays the
first comment associated with each post as if it were the post itself on the left side, and allows users to
filter these "posts" by their postId. Clicking on a "post" should display its associated comments on the
right side. Both the left and right sides should be scrollable to accommodate large datasets. Finally,
you will need to upload your project to a GitHub repository and host it on CodeSandbox.

Assignment Tasks:

1. Fetch Comments:
1.1. Retrieve 100 comments from the JSONPlaceholder Comments API.
2. Render Posts:
2.1. Display the first comment for each post as if it were the post itself on the left side.
2.2. Implement a filter that allows users to enter a postId and filter the left side based on this input.
3. Display Comments:
3.1. Clicking on a "post" on the left side should display its associated comments on the right side.
3.2. Ensure that both the left and right sides are scrollable to handle large datasets.
4. GitHub Repository:
4.1. Create a new GitHub repository for your project.
4.2. Push your project code to the GitHub repository.
5. CodeSandbox Hosting:
5.1. Host your project on CodeSandbox.
5.2. Share the CodeSandbox project URL for evaluation.

Evaluation Criteria:
You will be evaluated based on the following criteria:

• Effective React component development: How well you build and structure your React
components.
• Proper fetching and rendering of comments and "posts": Your ability to fetch data and
display it correctly.
• Implementation of the filter feature for "posts": How you allow users to filter posts
by postId. (You can also implement a drop down of available postIds that the user can
choose from).
• Correct display of associated comments on the right side: Ensuring that clicking on a "post"
shows its comments.
• Proper implementation of scrollable sections: Making both the left and right sides
scrollable for large datasets.
• Code readability: The clarity and organization of your code.
• UI Design (bonus): Bonus points for a well-designed user interface.

You might also like