Sumérgete en el emocionante mundo del diseño web. Explora cursos que te enseñarán los principios del diseño, la usabilidad y las herramientas necesarias para crear sitios web atractivos y funcionales. Da vida a tu creatividad en la web.

Curso Front-end y consumo de API con HTML, CSS y JavaScript

PayPal

Costo $15

Curso Front-end y consumo de AI con HTML, CSS y JavaScript


Este curso de Front-end y consumo de API con HTML, CSS y JavaScript transformará tu manera de crear sitios web, llevándote más allá del diseño para adentrarte en la funcionalidad interactiva y dinámica de las aplicaciones web modernas. A través de este ampliado camino de aprendizaje, no solo profundizaremos en HTML (HyperText Markup Language) y CSS (Cascading Style Sheets), sino que también incorporaremos JavaScript, el lenguaje de programación que potencia la interactividad en la web. Además, aprenderás cómo las aplicaciones web consumen datos de API (Application Programming Interfaces) para crear experiencias ricas y personalizadas.

Experimentarás con prácticas interactivas en entornos de desarrollo y, como un valor añadido, aprenderás a subir tu sitio web a diversas plataformas cloud de forma gratuita, libre de publicidad, para lanzar tus proyectos a todo público y construir tu propio portafolio de proyectos.

Objetivos del Curso:


1. Introducción al Desarrollo Web

  • ¿Qué es el desarrollo web? Diferencias entre front-end y back-end.

  • Navegadores, editores y flujo de trabajo de un desarrollador.

  • Estructura de un sitio web moderno.

  • Cómo funciona internet (breve vista: servidores, dominios, cliente/servidor).

2. Fundamentos de HTML y CSS

  • Estructura básica de un documento HTML.

  • Etiquetas esenciales: texto, enlaces, imágenes, listas.

  • Introducción a CSS: selectores, propiedades, unidades.

  • Vinculación de HTML y CSS (en línea, interna y externa).

  • Buenas prácticas de semántica web.

3. Estructura Avanzada con HTML5 y Estilos con CSS3

  • Nuevas etiquetas semánticas de HTML5: <header>, <main>, <article>, <section>, <footer>.

  • Uso correcto de estructuras y jerarquía de contenidos.

  • Box model, posicionamiento, flexbox y grid.

  • Animaciones y transiciones básicas en CSS.

  • Accesibilidad y SEO técnico básico.

4. Diseño Responsivo y Framework Bootstrap

  • Mobile-first: diseño adaptable para móviles, tablets y desktop.

  • Media queries y breakpoints.

  • Introducción a Bootstrap 5: instalación y ventajas.

  • Sistema de grid, componentes (navbar, cards, botones) y utilidades.

  • Personalización de estilos Bootstrap con CSS propio.

5. Formularios Web Modernos con HTML y CSS

  • Estructura básica de un formulario (<form>, <input>, <textarea>, <select>, <button>).

  • Validaciones nativas en HTML5.

  • Estilización de formularios con CSS y Bootstrap.

  • Buenas prácticas de accesibilidad (uso de label, placeholder, etc.).

  • Manejo de eventos en formularios (preview a lo que se hace con JS).

6. Introducción a la Programación con JavaScript

  • Fundamentos: variables, tipos de datos, operadores, condicionales, bucles.

  • Funciones y eventos del DOM.

  • Manipulación del DOM: acceder y modificar contenido, atributos, clases.

  • Buenas prácticas de organización del código JS.

7. Interactividad Web: JS y Consumo de APIs

  • Peticiones HTTP y el rol de las APIs en la web moderna.

  • Uso de fetch() y JSON.

  • Async/await, promesas y manejo de errores.

  • Renderizado dinámico de datos (ejemplo: cargar usuarios, clima o noticias).

  • Proyecto práctico: consumir una API pública y mostrar datos en el DOM.

8. Proyecto Final y Publicación Web

  • Planificación y diseño del proyecto (maquetación y estructura).

  • Integración completa de HTML, CSS y JS en una mini aplicación web.

  • Consumo real de una API externa.

  • Optimización de código y estructura de carpetas.

  • Publicación gratuita con GitHub Pages o Netlify.

  • Evaluación final y sugerencias de mejora.

9. Bonus: Opcionales: Despliegues en Cloud

  • Tipos de Nubes.
  • Creación de Máquinas Virtuales.
  • Servidores Low-cost.
  • Terminología Cloud.
  • Google Apps.
  • Azure Static Webs.



Al finalizar, no solo habrás fortalecido tus habilidades en diseño web, sino que también estarás equipado para crear aplicaciones web interactivas y dinámicas que consumen datos de APIs. ¡Prepárate para llevar tus habilidades de diseño web al siguiente nivel con HTML, CSS y JavaScript!

Recursos de Aprendizaje:

  • Lecciones descargables en PDF.
  • Videos tutoriales y referencias externas.
  • Quizzes interactivos para comprobar tu aprendizaje.
  • Proyectos prácticos y estudios de caso.
  • Certificado descargable en PDF al completar el curso.
  • Acceso de por vida al curso.