Scribd
Upload
30 views

Assignment - Session 1 - React Fundamentals

This document outlines an assignment to build a travel management web application using React. The application should allow customers to be created, edited, and deleted. It should support regular and corporate customers with different discount rules. The state of the application should persist when reopening the browser. Deliverables include HTML, CSS, and JavaScript files to implement the required features and meet non-functional requirements like using local storage and not using jQuery.

Uploaded by

nitinvohra_capricorn
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
30 views

Assignment - Session 1 - React Fundamentals

This document outlines an assignment to build a travel management web application using React. The application should allow customers to be created, edited, and deleted. It should support regular and corporate customers with different discount rules. The state of the application should persist when reopening the browser. Deliverables include HTML, CSS, and JavaScript files to implement the required features and meet non-functional requirements like using local storage and not using jQuery.

Uploaded by

nitinvohra_capricorn
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

REACT

NATIVE WORKSHOP: REACT FUNDAMENTALS


Assignment: React Fundamentals


Objective:
Duration Develop a Travel Management web application using HTML5 and React. The travel
management application should be focused on two types of customers Regular and
(8 hours) Corporate. Following are the key functional features:

Requirements:

Customer should be having attributes name, age, type, description, mobile


number and distance travelled.
Customer can avail discounts as per the following:
Regular customer: If this is a loyal customer then flat 5% discount is
applicable otherwise normal charges.
Corporate customer: If number of employees are more than 10
then flat 15% discount is applicable otherwise 10%.
A travel agent can perform following operations:
Create a customer Regular or Corporate.
Delete a customer.
Edit a customer.
Show details of a customer.
Clicking on Add New button should display an Add Customer form. Once
travel agent saves the required information, Add Client form should be
disappeared.
Clicking on Delete button should display a Delete Customer confirmation
pop-up and on accepting the confirmation, customer record should be
removed from the system.

Clicking on Details button should display the customer details in Add


Customer form (Add Customer label should get changed to Customer
Details, and Save & Reset buttons should be hidden).
Clicking on Update button should display the customer details in Add
Customer form (Add Customer label should get changed to Update
Details).
Save button on Add Customer form creates a new customer.
Save button on Update Customer form updates an old customer.
If distance travelled is mentioned in the Add Customer form then total
charges (including discount) should be displayed in the Customer list.
Application state should be persistence in nature. If user opens the
application again, browser should display the last state (before closing) of
the application including respective screen and number of records.

NFRs:

Local storage must be used for saving application state.


Use of jQuery is not allowed.

Wireframes:

P a g e 2 | 3

Deliverables:

Html files containing markup.


CSS files containing styles for page and form elements.
JS files containing documented JavaScript code.

P a g e 3 | 3

You might also like