- Questions that you need to answer (as a group!) are indicated with question mark symbols (:question:).
- Tasks that specify work to do without a written response will be bulleted.
Responses to questions should be submitted as specified by your instructor.
If you're ever confused about what you need to do for a given task, ask.
The structure of this project should be nearly identical to that of lab #3, and as such there really isn't much excitement in that department.
The server is, for the most part, the same as it has been in the past two labs. The difference to look for here is in how the server gets the data it sends out in reply to requests.
❓ So how does the server get all that data it's sending out?
- Re-implement the ToDo API, this time pulling data from MongoDB rather than from a flat JSON file.
- When displaying the ToDos in your Angular front-end, make thoughtful decisions about whether work like filtering should be done in Angular or via database queries. It would be reasonable, for example, to have the database filter out all the ToDos belonging to a single user, but let Angular filter by category or status.
To see an example of using the database and the server to do some useful work
(instead of having everything happen in Angular), implement an API endpoint
/api/todoSummary
which provides summary information about a group of
ToDos in the following format:
{
percentToDosComplete: Float,
categoriesPercentComplete: {
groceries: Float,
...
}
ownersPercentComplete: {
Blanche: Float,
...
}
}
So you should add a new endpoint to your Spark routes, and then have that call some method (possibly in a new class?) that queries the DB for the relevant data and assembles this JSON response. Note that you can use MongoDB aggregation to do most of this calculation without having to actually download all the todos, organize, and count them yourself.
- Use the front-end tools you've learned about to build a nice interface for
accessing these APIs:
- You must use Glyphicons somewhere
- You must use at least two of the following nifty Bootstrap features: