Desarrollo web: responsive y JavaScript básico

Desarrollo web: responsive y JavaScript básico

Diseno responsive

• Una web que se adapta a diferentes pantallas (móvil, tablet, PC).
• Meta viewport: <meta ñame="viewport" content="width=device-width, initial-scale=1.0">
• Media queries: CSS que cambia según tamaño de pantalla.
• Flexbox: sistema CSS para organizar elementos en fila o columna. Fácil de hacer responsive.

/* Flexbox básico */
.contenedor {
  display: flex;
  gap: 20px;
}

/* Media query para móvil */
@media (max-width: 768px) {
  .contenedor {
    flex-direction: column;
  }
}

JavaScript básico

Lenguaje que anade INTERACTIVIDAD a la web.

// Variables
let nombre = "María";
let edad = 15;

// Función
function saludar() {
  let nombre = prompt("Tu nombre?");
  alert("Hola " + nombre);
}

// Evento
document.getElementById("botón").addEventListener("click", function() {
  document.getElementById("texto").innerHTML = "Has hecho clic!";
});

Aplicaciones

• Botón que cambia color de fondo.
• Formulario que valida datos.
• Contador que sube/baja al hacer clic.
• Galería de imágenes interactiva.

Ampliación: Desarrollo web: responsive y JavaScript básico

En esta lección de Tecnología, vamos a profundizar en el estudio de Desarrollo web: responsive y JavaScript básico. Este tema es una pieza clave del currículum y nos permitirá desarrollar competencias fundamentales para nuestra formación.

El conocimiento de Desarrollo web: responsive y JavaScript básico conecta con muchos aspectos de nuestra vida cotidiana. A través de su estudio, aprenderemos a analizar, comprender y aplicar conceptos que nos serán útiles tanto dentro como fuera del aula.

A lo largo de la historia, grandes pensadores, científicos y artistas han contribuido a desarrollar el conocimiento que tenemos hoy sobre Desarrollo web: responsive y JavaScript básico. Cada avance se construye sobre los logros de quienes nos precedieron.

En el nivel de tu curso, es importante sentar unas bases solidas sobre Desarrollo web: responsive y JavaScript básico. Los conceptos que aprendamos ahora serán la base para contenidos mas avanzados en cursos posteriores. Por eso, te animamos a prestar atención, preguntar tus dudas y practicar con los ejercicios propuestos.