Programación Web – Conceptos Básicos, Herramientas y Tecnologías

Tarjetas de estudio en formato pregunta-respuesta que cubren los conceptos fundamentales vistos en la Unidad 1 y parte de la Unidad 2 del curso de Programación Web: objetivos, evaluación, redes e Internet, protocolos, tecnologías frontend/backend, TypeScript, Git, DOM, HTML, CSS, almacenamiento web, AJAX, servicios web, Express, ORM y React. Están redactadas en español y diseñadas para repasar antes del examen.

¿Cuál es el logro de aprendizaje general del curso de Programación Web?

Aplicar conceptos, técnicas, modelos y herramientas para comprender los elementos que intervienen en una solución web.

¿Qué porcentaje de la nota final corresponde al proyecto grupal en la evaluación del curso?

El proyecto representa el 30 % de la nota final, aunque el ítem completo (proyecto) pesa 70 % grupal y 30 % individual.

¿Qué es Internet según los aspectos clave mencionados en clase?

Una red de redes distribuida, sin centro y construida sobre estándares abiertos.

Menciona dos organizaciones que definen estándares de Internet.

IETF (protocolos de Internet) y W3C (estándares web).

¿Qué función realiza el protocolo TCP en la comunicación de datos?

Fragmenta archivos en paquetes, numera, reordena, maneja fallas y determina la mejor ruta para su entrega.

¿Qué puerto utilizan por defecto los servidores web para escuchar peticiones HTTP?

El puerto 80.

Define World Wide Web (WWW).

Conjunto de páginas enlazadas accesibles a través de servidores y navegadores web.

¿Qué es una URL y cuáles son sus tres partes principales?

Localizador uniforme de recursos; sus partes son protocolo, host y path.

¿Para qué sirve el código de estado HTTP 404?

Indica un error del cliente: recurso no encontrado.

¿Qué indica un MIME type en una respuesta HTTP?

El tipo de documento que el navegador está recibiendo (p. ej. text/html, image/png).

¿Cuál es la principal diferencia entre TypeScript y JavaScript en cuanto a tipos?

TypeScript maneja tipos estáticos mientras que JavaScript maneja tipos dinámicos.

Comando para instalar TypeScript globalmente usando npm.

npm install typescript -g

¿Para qué sirve el archivo tsconfig.json?

Configura la compilación de TypeScript a JavaScript.

Sintaxis para declarar una tupla de número y cadena en TypeScript.

const tupla: [number, string] = [1, "Lunes"]

¿Qué palabra clave se usa para crear un alias de tipo en TypeScript?

type

¿Qué comando de Git se usa para crear un repositorio vacío en un directorio?

git init

Explica brevemente la diferencia entre sistemas de control de versiones tradicionales y distribuidos.

En los tradicionales existe un servidor central; en los distribuidos cada copia contiene el repositorio completo y puede actuar como servidor o cliente.

¿Cuál es la finalidad del comando git add?

Pasar archivos modificados al estado staged antes de hacer commit.

¿Qué hace git pull?

Obtiene y fusiona los últimos cambios del repositorio remoto con la rama local.

¿Para qué se usa un pull request en GitHub?

Para solicitar la revisión e integración de cambios desde una rama a la rama principal del proyecto.

Define DOM (Document Object Model).

Representación en forma de árbol de todos los elementos HTML de una página, accesible y manipulable mediante JavaScript.

¿Qué hace el método addEventListener?

Anexa un manejador de evento a un elemento sin sobrescribir manejadores existentes.

En un manejador de eventos, ¿a qué hace referencia la palabra clave this?

Al elemento DOM al que se encuentra asociado el manejador.

Nombre tres tipos de nodos en el DOM.

Nodos de elemento, nodos de texto y nodos de atributo.

Propiedad DOM que devuelve el nodo padre de un elemento.

parentNode

¿Qué etiqueta HTML define un enlace?

¿Qué diferencia hay entre etiquetas block e inline?

Las block ocupan todo el ancho disponible y comienzan en línea nueva; las inline solo el ancho del contenido y pueden estar dentro de un párrafo.

¿Cuál es la entidad HTML para un espacio en blanco (&)?

 

¿Para qué se usa la etiqueta

en HTML?

Para agrupar y enviar elementos de entrada de datos al servidor.

Enumera tres valores comunes del atributo type en un elemento .

text, radio, checkbox (entre otros submit, button).

¿Qué es CSS y cuál es su objetivo principal?

Cascading Style Sheets; separar la presentación (apariencia) del contenido HTML.

Sintaxis general de una regla CSS.

selector { propiedad: valor; }

Explica brevemente el concepto de cascada en CSS.

Los estilos se aplican siguiendo una jerarquía donde reglas más específicas o definidas después pueden sobrescribir reglas anteriores.

¿Qué propiedad CSS controla la transparencia de un elemento?

opacity

Menciona las cuatro técnicas de layout vistas en clase.

Float, Flexbox, Grid y uso de frameworks CSS.

¿Qué es JSON y por qué es popular en aplicaciones web?

JavaScript Object Notation; formato ligero y legible para intercambiar datos compatible con múltiples lenguajes.

Diferencia entre Local Storage y Session Storage.

Local Storage persiste tras cerrar el navegador; Session Storage se borra al cerrar la pestaña o ventana.

¿Qué es AJAX según la definición dada?

Asynchronous JavaScript and XML; forma de usar tecnologías web para intercambiar datos con el servidor sin recargar la página.

¿Qué devuelve la función fetch y cómo se manejan sus resultados?

Devuelve una Promise; se manejan con then para éxito y catch para errores.

¿Qué es un Servicio Web?

Aplicación de software que permite la comunicación máquina a máquina sobre una red utilizando estándares abiertos.

Diferencia principal entre SOAP y REST.

SOAP usa mensajes XML con protocolo propio; REST se basa en HTTP y manipulación de recursos con verbos como GET, POST, PUT, DELETE.

¿Qué es CORS y cuál es su propósito?

Cross-Origin Resource Sharing; mecanismo de seguridad que controla si un recurso puede ser solicitado desde otro origen.

Define servidor web en el contexto del curso.

Programa que permanece en ejecución esperando peticiones HTTP, las procesa y devuelve respuestas al cliente.

Comando npm para instalar ExpressJS y registrarlo como dependencia.

npm install express --save

¿Cómo se define un endpoint GET raíz ('/') en Express?

app.get('/', (req, res) => { res.send('Programación Web'); });

¿Qué son path parameters en Express?

Partes variables del path utilizadas para enviar datos: '/alumnos/:codigo/:nombre'.

¿Para qué sirve body-parser o express.json()?

Para interpretar el cuerpo de las peticiones (JSON o urlencoded) y exponerlo en req.body.

¿Qué son archivos estáticos en un servidor Express?

Archivos servidos tal cual (imágenes, JS, CSS) usando app.use(express.static('folder')).

Define ORM.

Object-Relational Mapping; técnica que permite manipular datos relacionales como objetos.

¿Qué herramienta ORM se usará en el curso con NodeJS?

Prisma (anteriormente se mencionó Sequelize pero en las notas se detalla Prisma).

¿Qué comando inicializa un proyecto Prisma?

npx prisma init

¿Qué es una migración en Prisma?

Conjunto de instrucciones DDL versionadas que crean o modifican la estructura de la base de datos.

¿Cómo se genera y aplica una migración con Prisma?

npx prisma migrate dev --name

Tipo de relación 1:N en Prisma entre User y Post (pregunta conceptual).

Un User tiene muchos Post; se define con posts Post[] en User y user User @relation(…) en Post.

¿Qué método de Prisma Client obtiene todos los registros de un modelo?

findMany()

¿Qué comando se usa para compilar un archivo TypeScript llamado programa.ts?

npx tsc programa.ts

¿Cómo se declara una variable de estado en React usando hooks?

const [valor, setValor] = useState(tipoInicial)

Propósito del hook useNavigate en React Router.

Navegar de forma programática a otra ruta dentro de la aplicación.

¿Cuál es la regla para regenerar un componente React?

Se vuelve a renderizar cuando cambian sus props o su state.

Define promesa (Promise) en JavaScript.

Objeto que representa la eventual finalización (o fallo) de una operación asíncrona y su resultado.