For the final project you will create a full stack, database$-$driven web application that uses the all languages taught in this class $($HTML$,$ CSS$,$ JavaScript, PHP$,$ SQL$).$ Your web application may be on any topic, as long as you satisfy the requirements below.

Second: Requirements

General Requirements

$$ You must build this web application using the technologies taught in this class $($HTML$,$ CSS$,$ JS$,$ SQL$,$ PHP$).$

$$ This must be a fully functioning. This means:

$$ No JS$/$PHP$/$SQL errors should be displayed.

$$ All pages are working properly $($no $500$ or $404$ errors$).$

$$

HTML$/$CSS Requirements

$$ At least four $(4)$ distinct pages

$$ It is up to you on how to design each of the pages. However, each page must have substantial and real content that support the topic of your web application.

$$Coming Soon$$ pages do NOT count as a real page.

$$ Confirmation pages do NOT count as a page $($e$.$g$.$ add$\_$confirmation.php that displays a success message that users have added a record into the database successfully$).$

$$ All your designs must be responsiveness and display correctly on large, medium and small screens properly.$$

$$

Original layout

$$ Come up with your own layout $($UI$)$ and workflow.

$$ You may use Bootstrap or other CSS frameworks but you may NOT use an HTML template or copy the exact design of an existing website.

$$ Navigation menu and logo must be included.

$$ A logo that exists in all pages of the application. The logo can be text or an image. You can pick any logo you want.

$$

External stylesheet

$$ At least one $(1)$ external stylesheet that includes CSS that is shared among multiple pages.

$$ All other CSS can be written in internal stylesheets or its own external stylesheet.

$$

Consistent design

$$ All pages must have a similar structure $($header$,$ navigation, footer, etc.$).$

$$ Consistent look and feel $($such as colors, fonts, etc$)$ used throughout the pages.

$$ All links take users somewhere, even if it$$s a Coming Soon page $($i$.$e$.$ there should be no dead links$)$

$$

Responsive design

$$ All pages must look polished on mobile, tablet and desktop devices. No squished or unreadable text, elements going off screen, etc. Graders will check each page in each of these device sizes:

o$$ Mobile

o$$ Tablet

o$$ Desktop

$$

JavaScript Requirements

$$ Any user input must be validated first by JavaScript, even if server side will also do validation.

$$ Interactivity: Must implement at least one event handler $($click$,$ hover, keypress, etc$)$ for a meaningful interaction in at least one page that is NOT related to input validation.

$$

Database Requirements

$$ Design $($and normalize$)$ your own database.

$$ At least three $(3)$ tables and two $(2)$ table relationships.

$$ Populate the database with sufficient data.

$$ There must be at least $10$ rows in at least one table.

$$

PHP Requirements

$$ Use MySQLi to connect and interact with the database.

$$ Web application needs to Create, Retrieve, Update, and Delete records from the database.

$$ Allow any user to CRUD and only allow privileged users to perform certain actions $($e$.$g$.$ only admin users can delete records$).$

$$ Handle any user input errors, even if JavaScript already does so$.$

Type out your answer directly below each question. If a question does not apply to your project, type in N$/$A$.$

$$

BASICS

$$

What is the topic of your final project?

$$

Who is the intended audience?

$$

Provide a brief summary of the functionalities of your project.

$$

$$

FRONT$-$END

What is the total page count?

$$

List the names of any external stylesheet used in this project below.

$$

List any CSS libraries$/$frameworks used in this project $($e$.$g$.$ Bootstrap$)$ below.

$$

List any JavaScript libraries$/$frameworks used in this project below.

$$

How does your project meet the Interactivity requirement?

$$

BACK$-$END

Attach a screenshot of the final database diagram $($just the diagram, do not include any records$)$ below.

$$

Where in your project do you insert a record to the database $($the $$C$$ in CRUD$)?$

$$

Where in your project do you search and display record$($s$)$ from the database $($the $$R$$ in CRUD$)?$

$$

Where in your project do you update and existing record$($s$)$ the database $($the $$U$$ in CRUD$)?$

$$

Where in your project do you delete existing record$($s$)$ from the database $($the $$D$$ in CRUD$)?$