Question
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
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
Step by Step Solution
There are 3 Steps involved in it
Step: 1
Get Instant Access to Expert-Tailored Solutions
See step-by-step solutions with expert insights and AI powered tools for academic success
Step: 2
Step: 3
Ace Your Homework with AI
Get the answers you need in no time with our AI-driven, step-by-step assistance
Get Started