Scribd
Upload
29 views

01UDFOV/01TXYOV - W A I: EB Pplications

This document provides instructions for restructuring a web-based task manager application to use React. Students are asked to rebuild the front-end using React components and JSX. The task list data should be stored in an array locally rather than retrieved from a server. The components should generate the task lists and sidebar dynamically, but user interactions like filtering and adding tasks do not need to be implemented. Hints include using prior lab specifications and the example React project from lectures.

Uploaded by

paci93
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
29 views

01UDFOV/01TXYOV - W A I: EB Pplications

This document provides instructions for restructuring a web-based task manager application to use React. Students are asked to rebuild the front-end using React components and JSX. The task list data should be stored in an array locally rather than retrieved from a server. The components should generate the task lists and sidebar dynamically, but user interactions like filtering and adding tasks do not need to be implemented. Hints include using prior lab specifications and the example React project from lectures.

Uploaded by

paci93
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

01UDFOV/01TXYOV – WEB APPLICATIONS I

GETTING STARTED WITH REACT


During this lab, you will start re-structuring your web-based task manager to exploit the React framework
and its component-based approach.

EXERCISE
Starting from the specification of the web application you developed in the previous labs, re-create the
front-end of the task manager in React.

In particular, you should build the entire front-end in components and by using JSX. In doing so, think
deeply about which classes you want to use, and which props each class needs.

For this lab, the task list should be in an array (in the client) and not retrieved from any server. In other
words, forget for a moment about fetch and the REST server. The various components will generate
dynamically the task lists and the sidebar content, only.

Beware: you do not have to implement any user actions; filters are not expected to work, neither the
button for adding new tasks, etc.

Hints:

1. You can use the specifications reported in Lab 2 and in the first exercise of Lab 3.
2. For handling dates and times, you can exploit moment.js.
3. You can use the project developed during the lectures as an example or to get inspiration:
https://github.com/polito-WA1-2020/react-scores

You might also like