Database Connectivity Assignment 1:

Part 1: In-Class Tasks

You must complete these three tasks IN-CLASS on the specified day. The professor will release a
document containing the task during the lecture. If you are not in class, you will get 0 for that task.
There is no drop-box for the tasks, so you must show the professor your work before you leave.

Task 1: Creating and Setting Up an Express Project – Due: 1 mark

Task 2: Creating Simple Views and Routes – Due: 1 mark
Task 3: Using Pug to Create Views – Due: 1 mark

Part 2: Major Task

1. Begin by choosing your site from the following options: a book store, a music store, a
movie store, a mobile phone store, or a recipe database. Note: you will be using this
site for the remainder of the course, so choose one you are interested in.
2. Create a root folder for your site and set up an Express project with pug inside it. Create
an APP_SERVER folder with model, view, route and controller folders. 1 mark
3. Create two controllers with the following functionality: 1 mark
a. An about controller which renders about.pug with the title “About my site”
b. A controller which contains an array of at least three pieces of sample data
related to your site (for example 3 books, or 3 movies). The data should consist
of JavaScript objects with 2 fields (for example a book would have a title and an
author). The controller should render list-display and pass it the array.
4. Create three views: list-display.pug, about.pug and display.pug with the following
functionality: 1 mark
a. Make list-display.pug loop over the passed array of data and display the fields of
each item
b. Write some basic details of your site in about.pug
c. Design a basic home page in index.pug
d. For now, display.pug can say “NOT IMPLEMENTED”
5. Create routes so that if the user goes to /about it will display the about page and if the
user goes to /list it will display the list page 1 mark
6. Import Bootstrap into the project and update layout.pug with the Bootstrap references
(see section 3.4 of the textbook). .5 marks
7. Add a navbar to layout.pug with a brand which links to “/” and nav items linking to
“About” and “List” (see section 4.3.2). .5 marks
8. Improve the design of your website. 2 marks

TOTAL: 10 marks