讲解CO3098/CO7098、辅导JSON, Bootstrap, AJAX、讲解Java设计、辅导Java 讲解留学生Process

CO3098/CO7098
Coursework 3
Mini Web Project - Genealogy Explorer
Important Dates:
Handed out: 28-Nov-2018
Deadline: 6-Jan-2019 at 23:59 GMT
The deadline is strict and will not be changed. Please ensure that you submit your work in time.
This coursework counts as 22% of your final mark.
Please read guidelines on plagiarism in the study guide and course documentation.
This coursework requires knowledge about REST Web Service, JSON, Bootstrap, AJAX and the
Web MVC framework.
Learning outcome:
Use a web MVC framework to create web applications.
Demonstrate the understanding of technologies behind Web Service
Coursework Description
Your task is to develop the Genealogy Explorer (GE), an online tool for building a family tree and tracking
ancestry. This piece of coursework consists of two parts – Part 1 (RESTful Service) and Part 2 (Web
Interface). You will need to develop a RESTful web service back-end for searching and editing genealogy
records, and to design a web interface for creating and browsing these data.
You may start your work from Part 1 or Part 2 first as you wish. Java domain class templates and a SQL file
is provided on Blackboard (see Appendix). You may choose to use them for implementation, and you are
allowed to make any changes to them.
Part 1: RESTful Web Service [40 marks]
GE allows users to create and edit a family tree. Your tasks in Part 1 are to implement the following REST
Web Service methods (a), (b), (c), (d) and (e).
(a) Adding a person [10 marks]
(1) GET /GE/person/add?key=3&name=RichardIII&dob=14830626&m=1&f=2&g=male
Submit a GET request to this URI to add a person to the database.
Parameter:
key : the unique key of the person (*)
name : full name of the person (*)
m : the person’s mother’s key
f : the person’s father’s key
dob : the person’s date of birth (e.g. 19921210 – December 10th 1992)
g : the person’s gender
* Required fields(2) POST /GE/person/addJSON
JSON request
{
"key": "1",
"name": "RichardIII",
"dob": "14830626",
"gender": "male"
"m": "2",
"f": "3"
}
Successful response in JSON
{"result": "true"}
Unsuccessful response in JSON
{
"result": "false",
"message": "person id already exists (or m/f id does not exist)"
}
Add a new person to the database. This request returns true if the operation is successful, otherwise false
is returned. (e.g. a person with the provided id already exists; one of the parent ids does not exist)
Consider the following HTTP GET requests:
GET /GE/person/add?key=1&name=King%20George%20VI
GET /GE/person/add?key=2&name=Queen%20Elizabeth
GET /GE/person/add?key=3&name=Queen%20Elizabeth%20II&m=2&f=1
GET /GE/person/add?key=5&name=Prince%20Philip%20Duke%20of%20Edinburgh
GET /GE/person/add?key=4&name=Princess%20Margaret&m=2&f=1
GET /GE/person/add?key=6&name=Prince%20Charles&m=3&f=5
GET /GE/person/add?key=7&name=Princess%20Diana
GET /GE/person/add?key=8&name=Prince%20William&m=7&f=6
GET /GE/person/add?key=9&name=Prince%20Harry&m=7&f=6
GET /GE/person/add?key=10&name=Catherine%20Duchess20%of20%Cambridge
GET /GE/person/add?key=11&name=Prince%20George&m=10&f=8
The family tree structure below will be created (Note that spaces in URLs are encoded as %20; optional
arguments are omitted)
Figure (1) Example - Royal Family Tree
It is also possible to add multiple persons at the same time by posting a JSON array to addJSON. For example, the following JSON will add two people to the database:
{
"list":[
{
"key":"12",
"name":"Princess Charlotte",
"dob":"20150502",
"gender":"female",
"m":"10",
"f":"8"
},
{
"key":"13",
"name":"Prince Louis",
"dob":"14830626",
"gender":"male",
"m":"10",
"f":"8"
}
]
}
This request returns true if all people are added successfully, otherwise the operation is cancelled and
false is returned.
(b) Deleting a person [5 marks]
GET /GE/person/delete/7
Delete a person with the given key (e.g. key=7) from the Genealogy database. The person's descendants
should NOT be deleted from the family tree. The request should return true if the operation is successful,
otherwise false is returned. For example, the above HTTP GET request should not delete key=8, 9,
10 or 11 in Figure (1).
Successful response in JSON
{"result": "true"}
Unsuccessful response in JSON
{
"result": "false",
"message": "key X does not exist"
}
(c) Getting information about a specific person [5 marks]
GET /GE/person/get/12
Return the information about a person with the given key in JSON:
Successful response in JSON
{
"key": "12",
"name": "Princess Charlotte",
"dob": "20150502",
"gender": "female",
"m": "10",
"f": "8"
}
Unsuccessful response in JSON
{
"result": "false",
"message": "key X does not exist"
}(d) Finding someone’s ancestors [10 marks]
GET /GE/person/ancestors/6
Return the person’s direct-line ancestors (a direct-line ancestor is someone from whom you descend in a
direct line - parent to child, grandparent, great-grandparent etc.) as a JSON object. Given the family tree in
Figure 1, the GET request above should return all direct-line ancestors of the person (key=6) as a JSON
object:
{
"key":"6",
"parents":{
"m":{
"key":"3",
"parents":{
"m":{
"key":"2"
},
"f":{
"key":"1"
}
}
},
"f":{
"key":"5"
}
}
}
Unsuccessful response in JSON
{
"result": "false",
"message": "key X does not exist"
}
Note: You may include other attributes (e.g. name, gender etc) in the JSON response.
(e) Finding someone’s descendants [10 marks]
GET /GE/person/ancestors/7
Return all of the person’s lineal descendants (a lineal descendant is a blood relative in the direct line of
descent – the children, grandchildren, great-grandchildren, etc.) as a JSON object. Given the family tree in
Figure (1), the GET request above should return all descendants of the person (key=7) as a JSON object:
{
"key":"7",
"children":[
{
"key":"8",
"children":[
{
"key":"11"
}
]
},
{
"key":"9"
}
]
}Part 2: Web Interface [60 marks]
Your task in Part 2 is to design and implement a web interface for creating and editing the Genealogy data.
You may use any Web Frameworks (MVC, MVP or MVVM) for implementation, including but not limited
to:
Spring MVC
ASP.NET MVC
Ruby On Rails
Laravel PHP
AngularJS
Django
Ember.js
The architecture and good coding practice will also be taken into account when allocating marks. The mark
for this piece of coursework will be capped at 65% if the solution does not use any web framework (Please
consult with the convenor first if the framework you intend to use is not listed here).
Your tasks in Part 2 are to implement a Web Interface for (f), (g) and (h)
(f) Browsing genealogy records [20 marks]
(g) Adding, deleting and editing persons from the family trees [20 marks]
(h) Searching descendants and ancestors [20 marks]
In addition to the functionality, the website responsiveness (page rendering on a variety of devices and
window or screen sizes) will be taken into account when allocating marks.
Marking Scheme & Rubrics
Part 1:
REST Service API testing process will be automated. Test cases will be provided for each REST controller
method (a), (b), (c), (d), (e) to check whether methods are behaving as they are expected. Marks will be
distributed according to test results.
Part 2:
N (0%)
No submission
F (0-40%)
Front-end HTML page exists, but the program fails to load or display any genealogy data. No listing
of records in a simple form (e.g. table). No front-end framework/CSS used.
An attempt was made but adding/deleting/editing functions are not functional.
Static web pages (or view) for searching descendants/ancestors exists but without any connection to
the database.
E (40-50%)
Basic HTML pages/view without any front-end framework/CSS; do not adopt a responsive design.
Listing of genealogy records in simple form, e.g. display all persons in a simple HTML table; formbased
adding, deleting and editing feature developed, but still not functioning properly.
Static HTML page and server-side code for searching partially implemented, but there are still major
issues. (e.g. failed to return any result, 500 internal server error)
D (50-60%)
Adopt responsive web design in the development, but there are major issues. (e.g. cannot navigate the website through desktop/mobile)
Genealogy records are loaded and displayed in a static tree-like structure (e.g. HTML