JAVASCRIPT

Ejercicio final

individual .... sorry :) con paciencia

Fecha límite de entrega el lunes

https://github.com/YuniorGlez/dinamic_form

Reglas

  • Valida que los campos están bien antes de introducirlo en el array.
  • No permitas usuarios con el mismo correo dentro del array.
  • Hoja en blanco y tira de mucho internet, para eso está.
  • Usa bootstrap u otra librería si lo deseas oblitagoriamente, no gastes más de un 10% de tu tiempo en el estilo
  • No se pueden métodos de más de 10 líneas.

Extras

  • Pinta de rojo los inputs no válidos.
  • Añade un icono de borrado en los usuarios de la lista y al pulsarlo elimínalo tanto de la pantalla como de la memoria.
  • Añade un input a la derecha y un botón con una lupa. Servirá para buscar, de manera que al introducir algo y pinchar en la lupa solo saldrán en la pantalla aquellos cuyo nombre contenga la ristra introducida.
  • Si algo va mal, crea una zona en el html para mostrar mensajes de errores, como por ejemplo si las validaciones no pasan.

Fecha límite de entrega el lunes

https://github.com/YuniorGlez/dinamic_form

PROGRAMA DE HOY

  • 30m-1h para que rematen un poco el ejercicio. (les pregunto ahora) 17:15 les pregunto
  • 30m-1h para revisar 2-3 de los vuestros
  • 30m-1h para hacer yo en directo este ejercicio final

---- merecido descanso ----

  • 2-3h para practicar varios ejercicios de arrays+objetos nuevos  

Practicando

Ejercicio 1

Vamos a dibujar en el DOM todas las fotos que hay en 

https://jsonplaceholder.typicode.com/photos

 

Para ello:

 

- Dirigete a esa web y copia todo el array gigante.

- Create una variable llamada photos y guardarlo todo.

- Preparar en el HTML un elemento que será en el que dibujarás dentro las imágenes 

- Recorre el array y dibuja en la pantalla todas las imagenes, usa el atributo thumbnailUrl

Ejercicio 2

Vamos a dibujar en el DOM todas "las tareas" (TODO en inglés)  que hay en 

https://jsonplaceholder.typicode.com/todos

 

Para ello:

 

- Dirigete a esa web y copia todo el array gigante.

- Create una variable llamada todos y guardarlo todo.

- Preparar en el HTML un elemento que será en el que dibujarás dentro las tareas 

- Recorre el array y dibuja en la pantalla todas las tareas.

- Añadele algun estilo diferente a las completadas

- Crea un botón que sea para "ver solo las mias" (id user 3)