CSCI 3342 Web Development
Fall 2024

Server-Side HTML

HTML Templates

Buy my stuff.
For this module, you are going to create a very simple shopping site that allows you to browse items (from a "database") and add a new review to an item. Open up http://localhost:8080/items.html to see the mockup of the product you're creating.
Next, you will replace the static mockup items.html with a template and dynamic HTML generation. Follow the video example below to:
  1. Configure your server to use EJS templates
  2. Convert the items.html mockup into an EJS template
  3. Create an /items GET route that renders the template
  4. Create a fake "database" (an associative array) with your own list of items (each item should have name, description, price, image URL)
  5. Update the /items route and the template file to display from the "database"

EJS templates (21:22)

Inserting dynamic data into your HTML.
Additional Reference: EJS website
The documentation mostly deals with different ways to use the engine, since the actual templating part is simply: you can put in JavaScript. The list of "Tags" about halfway down the page details various alternatives to the basic <% %>.

Assignment Checklist

Create an '/items' route that serves the items page as an EJS template
Mock up your own items "database" with an associative array
Update the template to display the items from your "database"