Scribd
Upload
97 views

Challenge React PDF

The document provides requirements and API documentation for creating a single page TODO application using React or React Native. Key requirements include allowing a user to create, update, delete and filter TODO items by completion status using the given API. The API documentation specifies endpoints for getting, creating, updating, deleting TODO items and resetting the list for a given user. Design files are also provided to reproduce the TODO app design.

Uploaded by

Mauro Luis Sanchez Matamoros
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
97 views

Challenge React PDF

The document provides requirements and API documentation for creating a single page TODO application using React or React Native. Key requirements include allowing a user to create, update, delete and filter TODO items by completion status using the given API. The API documentation specifies endpoints for getting, creating, updating, deleting TODO items and resetting the list for a given user. Design files are also provided to reproduce the TODO app design.

Uploaded by

Mauro Luis Sanchez Matamoros
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/ 4

Challenge

We would like you to create a single page web application using React or ReactNative.

The main goal is to reproduce the given designs for the “well known” TODO app. Outcome if this task
should be a private repository with the solution in place on the main branch.

The provided API should be used.

All the operations should be done using the provided API.

https://www.figma.com/file/pcmMqOtF462x2IlxVUDBaV/PCNT---To-do-list

Requirements

Functional requirements

Create user
● Should create an user using the api provided
● Subsequents page reloads should use the same user and reload all previous
TODOs

Add a new item

● The user should be able to create a new TO DO item.


● A title must be given by the user to create it.

The item will be created as uncompleted, and included in the existing list.

Delete an existing item

● The user should be able delete an existing item from inside the list.
● After deletion, the item won’t be present in the existing list.

Set item completion

● The user should be able to update the completion state of an existing item in the list.

Filter by completion

● The user should be able to filter the existing list by items completion
● Available options are: ALL, COMPLETED, UNCOMPLETED
● When a filter is applied, only matching items will be displayed in the list.

Reset items list

● The user should be able to create a new list in replace of the existing one.
● when a new list is created, the existing one will be dropped, with all it’s items included.

Non functional requirements

Codebase
● App should run in localhost
● Ensure quality by adding unit tests.

Use a state management library (besides the fact it is not really required).

Suggestions

● Git commit history matters.


● Avoid adding too many dependencies whenever possible.
● Choose the tools you are most comfortable with.
API

Main API url


https://api-3sxs63jhua-uc.a.run.app/v1

GET /v1/userId
returns -> string

POST /v1/todo/:userId
body -> {title: string, message: string}
returns -> {
"title": string,
"completed": boolean,
"message": string,
"todoId": string
}

PUT /v1/todo/:userId
body -> {completed: boolean}
returns -> {
"title": string,
"completed": boolean,
"message": string,
"todoId": string
}

DELETE /v1/todo/:userId
body -> {todoId: string}
returns -> {ok: "true"}

DELETE /v1/todo/:userId/reset
returns -> {ok: "true"}

GET /v1/todo/:userId
returns -> [{
"title": string,
"completed": boolean,
"message": string,
"todoId": string
}]
GET /v1/todo/:userId/:completed
returns -> [{
"title": string,
"completed": boolean,
"message": string,
"todoId": string
}]

You might also like