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