Loom Video Link

Google Drive Link

The task is to create a Header Bar for the app. The various functionalities to develop under this story are: -

&nbsp;

The Header should have a Logo Image (can be found under assets folder) and a Logo Text

&nbsp;

Appropriate styling should be done using CSS.

&nbsp;

The background color to use for the Header Bar is - #606469

Relevel Trello Clone App

Create a Header Bar

The task is to create a card (For Ex - Card with title as &ldquo;Ticket1&rdquo;). The various functionalities to develop under this story are: -

&nbsp;

Each Card should show the details of 2 fields - Title and Description.

&nbsp;

Each card should have a cardId props passed to it representing a randomly generated unique ID to identify the card.

&nbsp;

Multiple cards should be placed vertically as shown in the Readme file.

&nbsp;

Appropriate styling should be done using the CSS files.

&nbsp;

The color of the card should be - #ffe4c4

Create a card&nbsp;

The task is to implement the functionality of Add Card Button. When the user click on Add Card button it should create a new card and add it to the existing card list.&nbsp; The various functionalities to develop under this story are: -

&nbsp;

Create an Add Button in the Header as shown in the image.

&nbsp;

Design a pop-up form as shown in the image. Pop-up form should open when we click on Add Button

&nbsp;

Pop-up form should also have a Close (X) icon to close the form if clicked.

&nbsp;

Clicking on Save Button will save and close the pop-up form and create a Card with an unique ID and add it to the Card List.

&nbsp;

npm &ldquo;shortid&rdquo; package already added in package.json to be used to generate random ID&rsquo;s for each card.

&nbsp;

Clicking on Close Button will close the form.

&nbsp;

The values entered should be validated before creating a card.&nbsp;

&nbsp;

Null or Empty values are not allowed.&nbsp;

&nbsp;

Title should not be more than 30 characters.

&nbsp;

Description should not be more than 150 characters.

&nbsp;

Validation errors should be notified on the form and only when all the validations are passed the Save Button will be enabled.

&nbsp;

Appropriate styling should be done using the CSS files.

Implement the Functionality

The candidate's knowledge on Frontend Development was tested on 3 basic areas:

The candidate's knowledge on Code Quality was tested on 3 basic areas:

The candidate's knowledge on Code Maintenance was tested on 3 basic areas:

The candidate's knowledge on Data Structures and Algorithms was tested on 1 basic areas:

The candidate's knowledge on Programming Fundamentals was tested on 5 basic areas:

The candidate's knowledge on Communication was tested on 2 basic areas:

Rohan Kumar singh

791

RELEVEL SCORE