Introduction

Goodfood (https://www.makegoodfood.ca/) is a popular Canadian meal delivery company that creates recipes and delivers the ingredients straight to your door. You have been contracted as a full-stack programmer to develop your version, a competing product, of the Goodfood website.

You must not name your website Goodfood but instead come up with your own name and brand. Also, your website cannot look the same as the Goodfood website however you can use the website (or similar meal delivery websites) to inspire the look and feel for your implementation.

The implementation of the website will be spanned over six assignments. In this assignment, you will focus on building an Express server and the home page for your web application. There is no database connectivity required at this time.

This assignment is worth 5% of your final grade.

Reminder about academic integrity

You must comply with Seneca Colleges Academic Integrity Policy. Although you may interact and collaborate with others, this assignment must be worked on individually and you must submit your own work.

You are responsible to ensure that your solution, or any part of it, is not duplicated by another student. If you choose to push your source code to a source control repository, such as GIT, ensure that you have made that repository private.

A suspected violation will be filed with the Academic Integrity Committee and may result in a grade of zero on this assignment or a failing grade in this course.

Technical Requirements

• All back-end functionality must be implemented using only js and Express, other frameworks/packages are not allowed for this assignment.
• You are not allowed to use any front-end CSS frameworks or JavaScript frameworks.

Objectives

Express web server set-up

Create an Express web server that listens to incoming HTTP requests on port 8080. The logic for your web server must be placed in a file called server.js. The top of the file must include the following header.

/************************************************************************************

• WEB322 Project (Fall 2021)
• I declare that this assignment is my own work in accordance with Seneca Academic
• No part of this assignment has been copied manually or electronically from * any other source (including web sites) or distributed to other students.
• * Name:
• Student ID:
• Course/Section:

*

************************************************************************************/

Remember to fill in your name, student ID, and the course code (including the section code) in the header. For example:

/************************************************************************************

• WEB322 Project (Fall 2021)
• I declare that this assignment is my own work in accordance with Seneca Academic
• No part of this assignment has been copied manually or electronically from * any other source (including web sites) or distributed to other students.

*

• Name: Nick Romanidis
• Student ID: 990123456
• Course/Section: WEB322 ZAA

*

************************************************************************************/

Implement Route Handlers

Create route handlers that will direct users to specific pages when they navigate to the following routes:

• The home page
• An on the menu page, this page will list the current weeks meals.
• A registration page used to sign up to the service.
• A login page used to log in after a user has signed up.

The Home Page

You are required to build a well-designed home page that consists of the following sections:

• Header: The header must contain a logo for your website. The logo must be an image file and cannot be html markup. Feel free to add links or other content.

• Navigation Bar: The navigation bar can be placed within the header or defined as an entirely new area. It must contain links that navigate visitors to the on the menu page, a sign-up page, the login page, and the home page (default route).

• A Hero: This section must have a prominent image or video element that is placed at the top of your page, below the header and navigation section. Here is an example:

• Content Section(s): These sections must use a combination of grids, words, headings, and images with the sole purpose of highlighting some selling features of the website, how it will work, and/or the services that it will provide. Here is an example:
• Top Meals: This section must display at least three (3) top meals. In this assignment, the data for this section will not be pulled from a database, instead it will be hardcoded in the HTML file. Each meal package must display an image, title, what is included, and a price. Here is an example:

• Footer: This section must include footer menu items, social media links, and any other information you deem necessary.

Required: Your footer must contain a copyright statement that reads exactly as follows:

Copyright Fall 2021, <FirstName> <LastName>, WEB322 <SectionCode>

Be sure to include your first and last name. For example, your professor would show the following copyright statement:

Copyright Fall 2021, Nick Romanidis, WEB322 ZAA

On the Menu, Registration, and Login Pages

You do not need to implement these pages for this assignment, but you must create and configure the appropriate routes. Simply, return a string with the page name for the On the Menu, registration, and login pages. Do not leave any dead routes.

Reminder

All back-end functionality must be implemented using Node.js and Express and your pages must be created with using only vanilla HTML, CSS and JavaScript.

Rubric

Criteria	Not Implemented (0) Little or no work done. Unacceptable attempt.	Partially Implemented (1) Work is minimally acceptable but is incomplete or needs significant modification.	Fully Implemented (2) Work is complete and done perfectly.
Home page. Header Navigation Hero Section Content Section Top Meals Section Footer
Express web server. A web server was created in a file named server.js. The file has the appropriate header at the top. The web server listens on port 8080.
Additional routes. Routes have been configured for the On the Menu, registration, and login pages.

Home page look and feel. Page is polished. Used pleasing typography, color palettes, and imagery. Appropriate use of grids.

Poor (1)

Average (3)

Exceeds (6)

Total: 24 Marks

Note: Half marks may be awarded.

Submitting your work

Make sure you submit your assignment before the due date and time. It will take a few minutes to package up your project so make sure you give yourself a bit of time to submit the assignment.

1. Locate the folder that holds your solution files.

2. Compress the copied folder into a zip file. You must use ZIP compression, do not use 7z or other compression algorithms or your assignment will not be marked.

3. Login to My.Seneca.

4. Open the Web Programming Tools and Frameworks course area and click the Project link on the left-side navigator. Follow the link for this assignment.

5. Submit/upload your zip file. The page will accept three submissions so you may re-upload the project if you need to make changes. Make sure you make all your changes before the due date. Only the latest submission will be marked.