Skip to main content

Óscar Miras

Qué haremos hoy

  • Algoritmo del día por David Pérez
  • Modularización de JavaScript
  • Concepto de asincronía
  • Consumir de APIs
  • Brainstorming

Recursos

  • Async/await en JavaScript moderno Enlace
  • API de Spotify Enlace .
  • API de GitHub. Consultar los repositorios de Iago Fernandez Enlace

Próxima sesión

  • Burbujeo de eventos
  • Ejercicio sorpresa
  • Reto en grupo
  • Challenge pair programming

Óscar Miras

Qué haremos hoy

  • Manipulación DOM
  • QuerySelectorAll
  • Ámbito de una variable
  • Evaluación de variables que no son del tipo boleano
  • Refatorización básica

Recursos

  • Ámbito de una variable Enlace
  • Cómo iterar una lista de nodos con QuerySelectorAll Enlace
  • 3 técnicas básicas de refactorización: funciones, usar objetos como parámetros, usar clases (lo veremos más adelante) Enlace

Próxima sesión

  • Burbujeo de eventos
  • Concepto de asincronía
  • Consumir una API

Óscar Miras

Qué haremos hoy

  • Algorítmica básica. Planteamiento de problemas y resolución.

  • Ampliar manipulación del DOM

    • Conocer el objeto event
    • Seleccionar varios nodos a la vez
    • Recorrer un conjunto de nodos
  • Concepto de estado de un aplicación

Recursos

  • 10 sitios online para practicar algorítmica Enlace
  • Como resolver un algorítmo en una entrevista técnica Enlace
  • Lista de los eventos más comunes con ejemplos Enlace

Grabaciones clase

  • Como resolver algoritmo CodeWards Enlace

Próxima sesión

  • Contribuir al repositorio de algoritmos
  • Aprender a contribuir en un repositorio GitHub que no es el vuestro
  • Buenas prácticas y reusabilidad de funciones
  • Burbujeo de eventos
  • Concepto de asincronía
  • Reto 30 ejercicios JavaScript

Óscar Miras

Qué haremos hoy

  • Creación, modificación y manipulación de objetos en JavaScript
  • Manipulación del DOM(Document Object Model) e introducción a los eventos de JavaScript

Recursos

  • Aprendre manipulación del DOM en 18 minutos Vídeo
  • FreeCodeCamp: como crear y manipular objetos JavaScript Enlace

Grabaciones clase

  • Los objetos en JavaScript Vídeo
  • Manipulación del DOM e introducción a eventos Vídeo

Próxima sesión

  • Más sobre eventos y manipulació del DOM
  • Resolución de algoritmos y transformación de datos
  • Ejercicios

Óscar Miras

Qué haremos hoy

  • Arrays en JavaScript
  • Frameworks CSS

Recursos

  • Explicación bien detallada del concepto de Array, por Pildoras Informáticas Vídeo
  • Crear una página Web desde cero con Bootstrap 5 Vídeo
  • Resumen, explicación y recursos muy bien estructurados de diferentes conceptos de programación HTML/CSS/JavaScript - Enlace
  • Explicación del framwork CSS y maquetación de la Web Zenva por Adrian Rey
  • Altiaverse, maquetación de Web con HTML y CSS (Work in Progress) por David Gomez

Grabaciones clase

  • Explicación de arrays JavaScript Vídeo
  • Explicación del framework Tailwind por Adrian Rey. Ventajas y desventahas. Consejos de donde coger inspiración para nuestros propias diseños Vídeo

Próxima sesión

  • El tipo de variable Object
  • Introducción al DOM (Document Object Model)

Óscar Miras

Qué haremos hoy

  • Funciones en JavaScript
  • Más sobre variables JavaScript

Recursos

  • Funciones en 5 minutos, por the Net Ninja - Elace
  • Buenas prácticas al nombrar variables en JavaScript - Enlace

Próxima sesión

  • El tipo de dato "array" en JavaScript
  • Frameworks CSS
  • Adrián Rey explicará una maquetación con el Framework Tailwind
  • Introducción a la maquetación con Bootstrap
  • Ejercicios Bootstrap
  • Challenge Front End con framework CSS
  • Challenge conjunto quien lo desee para repasar conceptos

Óscar Miras

Qué haremos hoy

  • Un poco más sobre media queries
  • Introducción a los formularios HTML5
  • JavaScript: lógica condicional y código iterativo

Recursos

  • Muy buena explicación sobre las diferentes maneras que podemos usar media queries - Enlace
  • A veces es mejor empezar de un código ya creado y adaptarlo a nuestra solución. Conjunto de 60 formularios "típicos" para ser modificados.
  • Operadores lógicos en JavaScript - Enlace

Próxima sesión

  • Frameworks CSS
  • Funciones en JavaScript

Óscar Miras

Qué haremos hoy

  • HTML Semántico
  • Variables CSS
  • Diseño responsive
  • Media queries
  • Introducción a la programación/JavaScript

Recursos

  • Ejemplo visual de una Web semántica
  • Variables CSS - Enlace
  • The Net Ninja. Creación de una Web responsive desde cero - Enlace
  • Ejercicios JavaScript de FreeCodecamp. Idealmente, hacer todos de la sección Basic JavaScript - Enlace

Próxima sesión

  • Formularios HTML
  • Lógica condicional y bucles en JavaScript

Óscar Miras

Qué haremos hoy

  • Reto completo Front End
  • Introducción al Pair Programming
  • Caso de uso: Mi GitHub es compartido
  • Publicar nuestra solución para recibir feedback

Recursos

  • HTML5 Semántico. - Enlace
  • Variables CSS - Enlace
  • Resolviendo un reto Front End Elementor Enlace

Próxima sesión

  • Media queries
  • Frameworks CSS
  • Introducción a la programación con JavaScript

Óscar Miras

Qué haremos hoy

  • Juego sobre selectores CSS
  • Modelo de caja: márgenes, márgenes interiores o paddings , bordes y tamaños
  • Posicionamiento absoluto, relativo y fijo.
  • Cajas flexibles o flex box
  • Rejilla o grid
  • Maquetación completa de Web

Recursos

Próxima sesión

  • Pair Programming
  • Reto CSS por parejas