Course material

Lenguaje de marcas

The whole front-to-back path over three terms: semantic HTML and modern CSS, then JavaScript and the DOM, and finally Node.js and an Express API the site consumes as its own.

2026/2027~108 hours

Route

The course, block by block.

By the end of the module

What you will be able to do.

Write valid, accessible and semantic HTML5 documents.
Design modern, responsive user interfaces using Flexbox, CSS Grid and design tokens.
Program with JavaScript: data, decisions, functions, arrays of objects, modules and error handling.
Build an interface driven by a single source of truth, with events, rendering and fetch.
Run JavaScript outside the browser with Node.js, working with files, npm and HTTP.
Design and implement a REST API with Express, layered code, tests and a deployment.

About the course

A three-term, project-led module built around a single site that grows with the class. The first term writes it as a document —semantic HTML, accessible forms, then modern CSS with Flexbox, Grid and responsive layout without a framework. The second term makes it behave: JavaScript as a language first, deliberately away from the page, so that a filter that does not filter is diagnosed as logic rather than as a button; then the DOM, events, state and fetch, with one rule throughout — data is the truth and the page is its reflection. The third term crosses to the other side: Node.js, npm, files, and an HTTP server written by hand before Express, so that every piece of the framework answers a problem the student has already felt; it closes with a designed REST API, layered code, an error contract, security, tests and a deployed application. Scaffolding is withdrawn on purpose: the first unit explains every step, and the last one starts from a specification.

Semantic HTML5 and accessibility
Modern CSS, Flexbox and Grid
JavaScript: the language
DOM, events, state and fetch
Node.js, npm and HTTP
REST APIs with Express, testing and deployment

Material last updated on 4 September 2026.

Contents

Material by section.

This module is taught in Spanish and its material is published in Spanish. The section titles below are translated for reference.

TERM 1 · THE DOCUMENT

UD1

HTML: Structure and content of the Web

Write modern, organized, semantic and accessible HTML documents without CSS.

UD1 · Guía y taller práctico · in SpanishHTML: estructura y contenido de la WebHTML no describe cómo se ve una página, sino qué representa cada parte de su contenido. Durante seis sesiones de tres horas recorremos el lenguaje completo —texto, listas, enlaces, imágenes, semántica, tablas y formularios— construyendo un sitio multipágina real sin una sola línea de CSS.6 sesiones de 3 horas · 18 horas
Expected work Sitio web multipágina de cuatro páginas enlazadas, escrito solo con HTML semántico, validado en el W3C y revisado por otro alumno.

UD2

CSS: design, layout and responsive

Turn the HTML site into a responsive, accessible one, using Flexbox and Grid rather than a framework.

UD2 · Guía y taller práctico · in SpanishCSS: diseño, maquetación y responsiveEl mismo sitio de la UD1, ahora con presentación. CSS exige decidir de qué tipo es cada problema —tamaño, espacio o distribución— y saber diagnosticar qué regla está actuando cuando el resultado no es el esperado.6 sesiones de 3 horas · 18 horas
Expected work El sitio HTML de la UD1 convertido en una web completa: sistema visual con variables, layout con Flexbox y Grid, responsive sin plantillas y estados de foco visibles.

TERM 2 · BEHAVIOUR IN THE BROWSER

UD3

JavaScript: the language

Learn the language away from the page: data, decisions, functions, arrays of objects, modules and errors.

UD3 · Guía y taller práctico · in SpanishJavaScript: el lenguajeLa tercera capa de la web empieza por el lenguaje. Antes de tocar la página aprendemos a razonar con datos, decisiones, funciones y estructuras, porque un botón que no funciona casi nunca es un problema del botón: es un problema de lógica que todavía no sabes leer.6 sesiones de 3 horas · 18 horas
Expected work Un módulo de catálogo escrito en JavaScript puro: datos en memoria, funciones de búsqueda, filtrado y ordenación, validación de entradas y errores controlados, comprobado desde la consola.

UD4

The DOM: the web that responds

Connect the three layers: rendering from data, events, a single source of truth, accessible forms and fetch.

UD4 · Guía y taller práctico · in SpanishEl DOM: la web que respondeConectamos las tres capas. El catálogo que en la UD3 vivía en la consola pasa a pintarse en la página, a filtrarse desde un formulario y a llegar desde un servidor. Con una regla que no se negocia: los datos mandan, y la página es solo su reflejo.6 sesiones de 3 horas · 18 horas
Expected work El sitio de las unidades anteriores convertido en una interfaz viva: catálogo pintado desde datos, búsqueda y filtros en tiempo real, formulario validado y accesible, preferencias guardadas y datos cargados desde una API con sus estados de carga, error y vacío.

TERM 3 · JAVASCRIPT ON THE SERVER

UD5

Node.js: JavaScript outside the browser

The same language without a browser: npm, files, and an HTTP server written by hand before rewriting it with Express.

UD5 · Guía y taller práctico · in SpanishNode.js: JavaScript fuera del navegadorEl mismo lenguaje, sin navegador. Node ejecuta JavaScript en tu máquina, con acceso a ficheros y a la red, y con él construirás primero un servidor HTTP a mano —para entender qué hace de verdad— y solo después lo reescribirás con Express, sabiendo qué te ahorra.6 sesiones de 3 horas · 18 horas
Expected work Un proyecto Node completo: una herramienta de línea de comandos que gestiona el catálogo en un fichero JSON, un servidor HTTP escrito a mano que lo sirve, y ese mismo servidor reescrito con Express con sus rutas, sus estáticos, su registro de peticiones y su manejo central de errores.

UD6

Web server and API with Node

A designed REST API: full CRUD, layered code, an error contract, security, tests and a deployed application.

UD6 · Guía y taller práctico · in SpanishServidor web y API con NodeLa unidad que cierra el módulo. Las rutas sueltas de la UD5 se convierten en una API diseñada: recursos, contrato, CRUD completo, capas separadas y un cliente que consume su propia API de punta a punta, con la configuración y las pruebas necesarias para publicarla.6 sesiones de 3 horas · 18 horas
Expected work Una aplicación web completa: API REST con CRUD, validación y contrato de errores estable; capas separadas; la web de las unidades anteriores servida desde el mismo origen y consumiendo su propia API; configuración por entorno, seguridad mínima, pruebas automáticas, documentación y despliegue.