dds 1
|
|
Título del Test:
![]() dds 1 Descripción: 1er parcial |



| Comentarios |
|---|
NO HAY REGISTROS |
|
Un equipo de plataforma de cursos decide resolver validaciones de permisos solo ocultando botones en la pantalla. ¿Cuál es el problema principal de esa decisión?. El sistema queda seguro porque el usuario ya no ve el botón en la interfaz. El HTML deja de ser semántico si se ocultan botones con CSS. Un usuario podría invocar igualmente el endpoint si el backend no valida la regla. Bootstrap no puede renderizar componentes que dependan de permisos. Relacioná cada componente de una aplicación de catálogo de productos con stock con la responsabilidad que mejor le corresponde. Base de datos. Backend. HTTP. Frontend. Un formulario tiene tres botones iguales llamados “Aceptar”. ¿Qué decisión mejora la comprensión y la accesibilidad?. Quitar los botones y usar sólo iconos sin etiqueta accesible. Cambiar la ruta Express para que el HTML tenga menos texto. Mantener el mismo texto porque el color del botón alcanza para distinguirlos. Usar textos específicos como Guardar cambios, Cancelar o Eliminar según la acción. En un tablero de reclamos, una grilla se ve bien en escritorio pero rompe el contenido en celular. ¿Cuál es el analisis más adecuado?. Conviene fijar el ancho en 1400px para que todos vean la misma version. Hay que revisar estructura responsive, clases de grilla y prioridades de contenido para pantallas chicas. La solucion correcta es convertir todo el texto en imagenes. El problema es solo de base de datos porque hay demasiados registros. Observa el código: let cantidad = "5"; let extra = 2; let total = cantidad + extra; En el contexto de una catálogo de productos con stock, cual es la interpretación correcta?. total vale "52" porque con + y un string se produce concatenación. total vale undefined porque cantidad fue declarada con let. total produce error porque no se puede sumar string con number. total vale 7 porque JavaScript convierte siempre strings numéricos antes de usar +. En una aplicación de panel de reservas de aulas, una función usa await fetch("/api/items"). ¿Qué condición debe cumplirse para que ese await sea valido en una función común?. La función debe declararse con async o el await debe estar en un contexto que lo permita. await convierte automáticamente cualquier error HTTP en una excepción de JavaScript. fetch debe ejecutarse solo desde el backend Express. La llamada a fetch debe estar necesariamente dentro de un addEventListener. Relacioná cada pieza backend con su responsabilidad en una API de usuarios. Controlador. Modelo ORM / capa de datos. Ruta Express. Servicio. En una aplicación de gestión de turnos médicos, después de recibir datos del backend se quiere cambiar solo el texto de <h1 id="título">Pendiente</h1>. ¿Qué instrucción es más adecuada?. app.get("#título", "Datos actualizados");. document.querySelector("#título").fetch("Datos actualizados");. document.getElementById("título").style = "Datos actualizados";. document.getElementById("título").textContent = "Datos actualizados";. En una API para gestiónar usuarios, seleccioná todas las decisiones técnicamente adecuadas. Ayuda: esta pregunta tiene 2 respuestas correcta. Encapsular el acceso a datos en modelos ORM o una capa de datos simple. Exponer detalles internos del error SQL al usuario final para facilitar la depuración. Responder siempre 200 aunque la base de datos falle, para simplificar el frontend. Usar POST para crear un nuevo recurso cuando el endpoint recibe los datos de alta. En una ruta Express de productos, una operación asincrónica con la base de datos puede fallar. ¿Qué decisión es más robusta?. Manejar el error y responder con un estado y mensaje adecuados sin exponer detalles internos. Ignorar el error para que el frontend no se entere. Convertir la ruta en CSS para que no pueda fallar. Enviar siempre 201 aunque no se haya guardado nada. Un alumno entrega el siguiente párrafo: "JavaScript es un lenguaje interpretado que se ejecuta en el navegador. Como es interpretado, es lento y poco seguro. La principal razón por la que JavaScript no puede leer archivos del disco duro es porque no tiene esa funcionalidad implementada en su lenguaje. Por suerte, gracias a NodeJS — que es un framework — ahora podemos usar JavaScript para construir aplicaciones más serias." 1. a) Identificá al menos cuatro errores conceptuales o de terminología técnica y citá la frase problemática. 2. b) Explicá por qué cada frase está mal, usando vocabulario técnico preciso. 3. c) Reescribí cada afirmación de forma correcta. 1. a) ¿Qué significa API? ¿Cuál es su propósito? 2. b) Considerá esta definición: "una API describe una interfaz de servicio expuesta a través del protocolo HTTP". ¿Es lo mismo "API" que "API REST"? Justificá. 3. c) Mencioná tres características que debe tener una buena API según el criterio técnico. 4. d) ¿Para quién se diseña una API? Mencioná las dos audiencias y qué les importa a cada una. Un endpoint permite cambiar el estado de una orden si el usuario tiene rol supervisor. ¿Dónde debe verificarse esa regla para que la arquitectura sea segura?. En el backend, antes de ejecutar la modificación sobre los datos. En Bootstrap, usando una clase distinta para usuarios supervisores. Sólo en el menú del frontend, ocultando la opción a otros roles. En la base enviada al navegador, filtrando visualmente las filas. Ordená el flujo conceptual cuando un usuario consulta información en una aplicación de catálogo de productos con stock. Formato Moodle: relacioná cada posición con el paso correcto. Paso 1. Paso 2. Paso 3. Paso 4. Paso 5. Paso 6. Paso 7. Un formulario marca un campo inválido después de una validación del frontend. ¿Qué mejora favorece la accesibilidad?. Mover el error al backend y no mostrar nada en la pantalla. Usar únicamente borde rojo porque todos los usuarios lo interpretan igual. Eliminar el label para que haya más espacio visual. Asociar el mensaje de error al campo y expresarlo también con texto, no sólo con color. Relacioná cada tecnologia con su aporte principal en un panel de turnos. Bootstrap. CSS. JavaScript. HTML. Una función debe calcular el total de un pedido a partir de precio y cantidad. ¿Qué diseño facilita testearla?. Leer directamente todos los inputs y modificar la pantalla dentro de la misma función. Recibir precio y cantidad como parámetros y devolver el resultado sin tocar el DOM. Hacer una petición HTTP aunque el cálculo sea local y determinístico. Guardar el resultado en una clase Bootstrap para reutilizarlo. Un formulario de una aplicación de catálogo de productos con stock dispara una petición con fetch, pero la página se recarga antes de ver el resultado. ¿Qué explicación es más probable?. El evento submit no fue interceptado con preventDefault antes de ejecutar la lógica asincrónica. Bootstrap impide enviar formularios con JavaScript. El backend Express borra automáticamente el DOM en cada POST. La etiqueta form solo puede usarse con bases de datos locales. Ordená la secuencia cuando un botón de una aplicación de administrador de pedidos carga datos desde el backend. Formato Moodle: relacioná cada posición con el paso correcto. Paso 1. Paso 2. Paso 3. Paso 4. Paso 5. Paso 6. El endpoint fue pensado para crear nuevos inscripciónes, pero se definió asi: app.get("/inscripciónes", createInscripciones) Cuál es el problema conceptual principal?. GET no expresa creación de recursos; debería usarse POST si el objetivo es registrar uno nuevo. Express no permite rutas en plural. El callback nunca puede tener un nombre que empiece con create. La ruta debería estar obligatoriamente en el frontend. Un endpoint de productos arma una consulta SQL textual dentro de la ruta y repite esa lógica en varios lugares. ¿Qué mejora es más coherente con el uso de ORM/Sequelize?. Mover el acceso a datos a modelos ORM o a una capa de datos simple, y llamar esa lógica desde servicios/controladores. Copiar la consulta en el frontend para evitar latencia. Reemplazar todos los códigos HTTP por 200 aunque haya errores. Guardar las respuestas JSON dentro de archivos CSS. Una crítica común en internet sobre el rol de "Programador Full Stack" dice que es "un mito o un recurso de empresas para ahorrar dinero con una persona que pueda hacer el trabajo de todo un equipo". 1. a) ¿Estás de acuerdo? Justificá apelando a la definición que da la cátedra del rol. 2. b) Mencioná una habilidad o conocimiento que un full stack DEBE tener pero un especialista (solo front o solo back) podría no tener. 3. c) ¿En qué tamaño / etapa de proyecto es razonable un perfil full stack y en cuál es razonable especialización?. 1. a) ¿Qué es una consulta RAW en Sequelize? Mostrá un ejemplo. 2. b) Mencioná una situación donde puede tener sentido usar RAW. 3. c) Mencioná dos motivos por los que el criterio técnico sugiere evitar RAW como práctica habitual. 4. d) ¿Una consulta RAW que recibe input del usuario es segura frente a inyección SQL? Justificá y mencioná cómo se protegería. En una aplicación de sistema de inscripción a materias, seleccioná todas las decisiones que respetan una arquitectura full stack clara y mantenible. Ayuda: esta pregunta tiene 2 respuestas correctas. Definir un contrato de respuesta entre backend y frontend para que la interfaz sepa que datos recibirá. Hacer que el navegador acceda directamente a la base de datos para reducir código del servidor. Enviar todos los registros al frontend y ocultar con CSS los que el usuario no debería ver. D. Validar permisos y reglas sensibles en el backend antes de consultar o modificar datos. En un panel de turnos, un input importante no tiene label asociado y el placeholder explica el dato esperado. ¿Cuál es el ajuste más correcto?. Reemplazar el input por una imagen con el nombre del campo. Asociar un label al input y usar el placeholder solo como ayuda secundaria si hace falta. Validar el campo solo con una clase de Bootstrap. Dejar solo el placeholder porque ocupa menos espacio. Dado const usuario = { nombre: "Ana", rol: "admin" }, ¿qué hace const { rol } = usuario?. Borra la propiedad rol del objeto usuario. Hace una petición al backend para obtener el rol. Crea una variable rol con el valor "admin". Convierte usuario en un array de dos posiciones. Una API de inscripciónes recibe una solicitud válida de creación y registra correctamente el recurso. ¿Qué respuesta expresa mejor el resultado?. 500 con un mensaje de éxito, porque el servidor participo de la operación. 204 con un HTML obligatorio que describa el formulario. 201 con el recurso creado o una referencia útil, si la creación fue exitosa. 404 porque antes de crear el recurso no existia. En una ruta Express de cursos, una operación asincrónica con la base de datos puede fallar. ¿Qué decisión es más robusta?. Manejar el error y responder con un estado y mensaje adecuados sin exponer detalles internos. Ignorar el error para que el frontend no se entere. Enviar siempre 201 aunque no se haya guardado nada. Convertir la ruta en CSS para que no pueda fallar. a) ¿Qué hace !important? ¿Cómo afecta la cascada normal de CSS? b) Si tengo dos reglas con !important y la misma especificidad: ¿cuál gana? c) Mencioná dos razones por las que se considera un anti-patrón usar !important ampliamente. d) Mencioná un caso legítimo donde sí está justificado. a) ¿Cuál de los dos modelos lleva la clave foránea? Justificá. b) Definí las asociaciones en Sequelize: ¿qué método usás en cada modelo? c) ¿Qué efecto tiene el atributo as: 'perfil' en Usuario.belongsTo(Perfil)? d) Si elimino un perfil que tiene 5 usuarios asociados: ¿qué pasa con esos usuarios? ¿Cómo configurarías el comportamiento?. En una aplicación de sistema de inscripción a materias, seleccioná todas las decisiones que respetan una arquitectura full stack clara y mantenible. Ayuda: esta pregunta tiene 2 respuestas correctas. Enviar todos los registros al frontend y ocultar con CSS los que el usuario no debería ver. Definir un contrato de respuesta entre backend y frontend para que la interfaz sepa que datos recibirá. Hacer que el navegador acceda directamente a la base de datos para reducir código del servidor. Validar permisos y reglas sensibles en el backend antes de consultar o modificar datos. En un grilla de reservas, el equipo usa solo para título, navegacion, contenido principal y pie. ¿Qué mejora aporta más valor conceptual?. Agregar clases Bootstrap sin revisar la estructura del documento. Mover todo el contenido a CSS para que el HTML quede vacío. Reemplazar todos los <div> por <span> para reducir el alto visual. Usar etiquetas semánticas como header, nav, main, section y footer cuando correspondan. En una aplicación de plataforma de cursos, seleccioná todas las afirmaciones correctas sobre JavaScript en el navegador. Ayuda: esta pregunta tiene 3 respuestas correctas. await debe usarse dentro de una función async o un contexto que lo permita. fetch actualiza automáticamente el DOM aunque no se procese la respuesta. Un listener registrado con addEventListener puede ejecutar código cuando ocurre un evento del usuario. textContent sirve para cambiar el texto de un nodo sin interpretarlo como HTML. Un alumno escribe el siguiente código: <div id="header"> <div id="title">Blog</div> <div id="menu"> <a href="/">Inicio</a> <a href="/posts">Posts</a> </div> </div> <div id="content"> <div class="post">...</div> </div> <div id="footer">© 2026</div> 1. a) Reescribilo usando etiquetas semánticas HTML5 apropiadas. 2. b) Listá cuatro razones por las que la versión semántica es preferible. 3. c) ¿Cuándo SÍ es razonable usar <div> ?. 1. a) ¿Qué es el DOM? ¿Es lo mismo que el HTML que escribimos en un archivo .html ? Justificá. 2. b) ¿Por qué se modela como un árbol? Mencioná una operación que ese modelo facilita. 3. c) Si hago document.getElementById("app").innerHTML = "<p>hola</p>" , ¿qué cambió? ¿El archivo HTML original se modificó?. En una aplicación de panel de reservas de aulas, el frontend espera recibir una lista de objetos con id, nombre y estado, pero el backend devuelve texto plano. ¿Qué conclusión técnica es más adecuada?. HTTP impide devolver estructuras JSON en respuestas exitosas. El problema se resuelve cambiando el color de los botones del frontend. La base de datos no puede guardar cadenas de texto. Hay un problema de contrato entre frontend y backend que debe corregirse acordando formato y campos de respuesta. En un buscador de cursos, seleccioná todas las decisiones que mejoran estructura, accesibilidad y mantenimiento del frontend. Ayuda: esta pregunta tiene 2 respuestas correctas. Usar labels asociados a los inputs importantes del formulario. Usar CSS propio para centralizar ajustes visuales repetidos. Depender del placeholder como único nombre visible y accesible del campo. Reemplazar toda la estructura semántica por divs para simplificar el HTML. Dentro de un if se declara una variable con let y luego se intenta usar fuera del bloque. ¿Qué ocurre conceptualmente?. La variable pasa automáticamente al objeto window. La variable queda disponible en todo el archivo como si fuera var. La variable se convierte en propiedad CSS del elemento activo. La variable no está disponible fuera del bloque donde fue declarada. Un endpoint de cursos arma una consulta SQL textual dentro de la ruta y repite esa lógica en varios lugares. ¿Qué mejora es más coherente con el uso de ORM/Sequelize?. Guardar las respuestas JSON dentro de archivos CSS. Copiar la consulta en el frontend para evitar latencia. Reemplazar todos los códigos HTTP por 200 aunque haya errores. Mover el acceso a datos a modelos ORM o a una capa de datos simple, y llamar esa lógica desde servicios/controladores. ara cada caso, escribí el selector CSS apropiado: 1. a) Todos los párrafos. 2. b) Todos los elementos con clase destacado . 3. c) El elemento con id menu . 4. d) Todos los <a> que están dentro de un <nav> (a cualquier profundidad). 5. e) Solo los <li> que son hijo directo de un <ul> . 6. f) Todos los <input> de tipo email . 7. g) Cuando el usuario pasa el cursor sobre un <a>. 1. a) Reescribí el siguiente código usando async/await y captura de errores con try/catch : fetch("/api/users/1") .then(r => r.json()) .then(user => console.log(user.name)) .catch(err => console.error(err)); 2. b) ¿ async/await es realmente síncrono? Explicá técnicamente. 3. c) ¿Cuándo conviene .then() y cuándo async/await ? Mencioná un escenario para cada uno. Un detalle de pedido usa Bootstrap, pero cada componente tiene muchas clases duplicadas y estilos inline para corregir detalles. ¿Qué decisión mejora el mantenimiento?. Resolver las diferencias visuales desde el backend antes de enviar la respuesta. Mantener componentes base de Bootstrap y mover ajustes repetidos a clases CSS propias. Duplicar los estilos inline en cada elemento para que sean explícitos. Eliminar Bootstrap y volver a tablas HTML para todo el layout. En una aplicación de administrador de pedidos, seleccioná todas las afirmaciones correctas sobre JavaScript en el navegador. Ayuda: esta pregunta tiene 3 respuestas correctas. Un listener registrado con addEventListener puede ejecutar código cuando ocurre un evento del usuario. await debe usarse dentro de una función async o un contexto que lo permita. fetch actualiza automáticamente el DOM aunque no se procese la respuesta. textContent sirve para cambiar el texto de un nodo sin interpretarlo como HTML. Una ruta Express debe validar autenticación antes de ejecutar el controlador. ¿Qué esquema es más adecuado?. Definir la ruta con middleware de autenticación antes del controlador. Ejecutar primero el controlador y validar el usuario después de modificar datos. Validar autenticación con una clase CSS enviada por el frontend. Usar siempre GET para evitar middlewares. La cátedra eligió un stack basado en JavaScript en frontend (React) y JavaScript en backend (Node + Express). Otras combinaciones posibles serían LAMP (PHP) o MERN. a) Mencioná dos ventajas técnicas concretas de usar el mismo lenguaje en frontend y backend. b) Mencioná una desventaja que esa decisión introduce. c) Si una empresa ya tiene un equipo de back-end senior en Java y un equipo de front-end senior en JS: ¿cambiarías la decisión? ¿Bajo qué criterio?. const persona = { nombre: "Juan", edad: 30, correo: "juan@gmail.com" }; const { nombre, edad } = persona; const { correo: email } = persona; const { profesion = "Desconocida" } = persona; const numeros = [10, 20, 30, 40]; const [primero, , tercero, ...resto] = numeros; a) Indicá el valor de nombre, edad, email y profesión. b) Indicá el valor de primero, tercero y resto. c) Justificá brevemente el renombrado, el valor por defecto, la coma vacía y el operador rest. En una aplicación de inscripción a finales, el frontend deshabilita el botón cuando el cupo parece completo. ¿Qué decisión evita inconsistencias si dos alumnos intentan inscribirse al mismo tiempo?. Confiar en el botón deshabilitado porque el usuario no puede hacer clic. Enviar todos los cupos al navegador y resolver el conflicto con CSS. Cambiar el color del botón para indicar que la operación es crítica. Validar el cupo nuevamente en el backend antes de confirmar la inscripción. Una validación compara un código recibido desde un input con el número 0. ¿Qué criterio reduce resultados inesperados?. Comparar con CSS para evitar coerción en JavaScript. Usar siempre == porque JavaScript corrige cualquier diferencia de tipo. Usar innerHTML para que la comparación sea más flexible. Usar comparación estricta y convertir el dato al tipo esperado antes de comparar. Un cliente pide GET /turnos/999 y ese turno no existe. ¿Qué respuesta comunica mejor la situación?. 500 Internal Server Error aunque no haya falla interna. 201 Created porque el servidor procesó la petición. 204 No Content y además un HTML de error obligatorio. 404 Not Found con un mensaje controlado. class Persona { constructor(nombre) { this.nombre = nombre; } saludar() { console.log("Hola, soy " + this.nombre); } } const juan = new Persona("Juan"); juan.saludar(); juan.toString(); 1. a) Cuando se ejecuta juan.saludar() : ¿dónde busca JS el método saludar ? Trazá el camino concretamente. 2. b) Cuando se ejecuta juan.toString() : toString no fue definido en Persona ni en juan . ¿Por qué funciona? Trazá la búsqueda. 3. c) Si juan.metodoInexistente() se invoca, ¿qué pasa?. En un alta de productos, un input tiene placeholder pero no tiene label. ¿Qué corrección aporta más valor semántico?. Quitar el atributo name porque el label ya describe el campo. Usar más clases de espaciado para que el placeholder se vea centrado. Reemplazar el input por un div editable sin nombre accesible. Agregar un label asociado al input mediante for/id. Una función crearUsuario(nombre, rol = "lector") se llama sólo con el nombre. ¿Qué valor toma rol?. null, porque JavaScript completa parámetros faltantes con null. El valor del último rol guardado en el DOM. undefined siempre, porque los valores por defecto no existen en JavaScript. "lector", porque el parámetro por defecto se usa cuando no se envía ese argumento. a) ¿Qué significa "diseño responsive"? ¿Por qué es crítico hoy? b) ¿Qué es una media query en CSS? Mostrá la sintaxis básica para aplicar estilos cuando el ancho >= 768px. c) Bootstrap define breakpoints (xs, sm, md, lg, xl, xxl). ¿Qué representan? ¿Por qué hay varios y no uno único? d) ¿Qué pasa si una página NO es responsive y el usuario la abre en un celular? Mencioná dos consecuencias concretas. Considerá estos dos snippets: Snippet A: console.log(foo()); function foo() { return 10; } Snippet B: console.log(bar()); let bar = function() { return 10; }; a) ¿Qué imprime A? ¿Qué pasa con B? b) Justificá la diferencia con el concepto de hoisting o elevación. c) ¿Cuál es la recomendación práctica: declarar funciones con function o con expresión asignada a const / let ? Justificá según el caso. |




