A Page Is Text
Part of the Express Basics section of Coddy's Node.js journey. Lesson 8 of 23.
A browser draws an HTML string as a page. Tags give the text structure: <h1> is a heading, <ul> a list, and <li> one item. A closing tag ends each part.
const cities = ['Oslo', 'Lima'];
const rows = cities.map(city => `<li>${city}</li>`);
const page = `<h1>Places</h1><ul>${rows.join('')}</ul>`;The template strings use backticks to insert values. map builds an array of item strings; join('') combines them without commas. In this practice the server returns the HTML inside JSON so you can inspect the exact tags. The supplied function receives a heading and an array of items. Escaping inserted text comes next.
Challenge
EasyEdit exercise.js. The server passes an object containing title and an items array. Return one html field: a heading followed by a list, with one item for each string. Keep the original item order and do not put commas between items.
{"html":"<h1>Recipe Box</h1><ul><li>Soup</li><li>Salad</li></ul>"}Try Run: the supplied GET example produces the response above. Send GET /result?title=Lunch&item=Rice&item=Beans for a different heading and list. The query values become the supplied function input.
The server calls your exercise function with a title and an items array. Repeating item= in the query supplies several items. Keep the GET method selected and enter only the path in the request box.
Try it yourself
export function exercise({ title, items }) {
return { html: title };
}
All lessons in Express Basics
Practice on your own: Express playground