andreaguerrero8 / ProyectoNETNET

0 stars 0 forks source link

Reto Sprint-2 NETNET #1

Open andreaguerrero8 opened 2 years ago

andreaguerrero8 commented 2 years ago

Adjubto evidencia de reto NETNET, del sprint-2

Para este proyecto, se creo una pagina que contiene una carpeta images ( con todas las imagenes usadas y un video), una llamada scripts (donde estan los archivos js data.js(datos de las peliculas), registro.js(el script donde esta la funcionalidasd de guardar los registros en el localStorage y una alerta para indicar al usuario que el registro fue eitoso), script.js(donde se implemento la funcionalidad de las cards y un filtrado entre series y peliculas)
Tambien hay una carpeta style en la cual esta el archivo style.css donde se le dieron los estilos a nuestro sitio web
por ultimo de encuentran los archivos HTML como el index.html donde se creó el maquetado base del sitio web, se agregó un video y abajo un espacio para insertar las cards que se crearán dinamicamente desde el archivo script.js

data.js
En este archivo podremos observar un arreglo de objetos que contiene las propiedades de las cards


script.js
en este archivo se realizaron los procesos de captura de datos del DOM, se usaron funciones y capturas de eventos para llamar a una funcion que mostrara las cards dinamicamente
mediante un foreach que recorrera la data importada desde el archivo data.js que contiene la informacion de la pelicula a mostrar en la pagina inicial, para ellos se usaron condicionales para dividir las cards
Por otro lado al hacer click en las cards se lleva a una funcion que mostrará la informacion de la pelicula seleccionada y un boton para regresar

En los botones series y peliculas se filtran las mismas por categoria (serie / pelicula) y al presionar alguna de las mismas se realizo una funcion que muestra la informacion de la pelicula seleccionada en el footer se tienen iconos que mostraran alertas o en el de INICIO nos llevará al principio de la misma pagina

registro.js


En la cabrcera hay un icono de bolsa, este esta enlazado con la pagina de registro en la cual se obtuvieron los compos desde el DOM en el archivo registro.html
en un formulario se crearon dichos campos y se creo una funcion, la cual obtendrá al momento de darle click en enviar, guardará los datos en el localStorage y enviará una alerta indicando que el registro fue exitoso


el sitio web cuenta con algunos estilos que hacen que la pagina se adapte de forma responsiva

index ![image](https://user-images.githubusercontent.com/91300257/153622706-4ec91e54-1433-4356-9c89-411eddc77924.png) ![image](https://user-images.githubusercontent.com/91300257/153622721-cd952d75-1ae3-4552-9e93-e04111b86a42.png) registro ![image](https://user-images.githubusercontent.com/91300257/153622780-1fde462e-fd84-4698-85fe-88401102c698.png) ![image](https://user-images.githubusercontent.com/91300257/153622800-6fe10fa2-d42c-4f72-95f6-93b41467fe1c.png) data ![image](https://user-images.githubusercontent.com/91300257/153622845-04c06a7d-faee-4db3-864c-4190c34e628f.png) registro ![image](https://user-images.githubusercontent.com/91300257/153622874-acedb5d5-a1ae-471b-9dfc-fb5066ff237c.png) ![image](https://user-images.githubusercontent.com/91300257/153622895-62279f2e-c8bb-435f-b862-ede78df543fa.png) script ![image](https://user-images.githubusercontent.com/91300257/153622917-ebb60b76-5167-4f03-a4a8-99ae8a0bd3f9.png) ![image](https://user-images.githubusercontent.com/91300257/153622940-8e729b2a-bbb9-4be8-bc29-274601237079.png) ![image](https://user-images.githubusercontent.com/91300257/153622981-5cbca2f2-3592-4512-b11d-f3773dc27e93.png) ![image](https://user-images.githubusercontent.com/91300257/153623001-2dc1243b-373b-4749-b7f2-14a2c35abcf3.png) ![image](https://user-images.githubusercontent.com/91300257/153623017-ebee4f3e-3c85-4fa0-a146-d59e735b0497.png) ![image](https://user-images.githubusercontent.com/91300257/153623038-c34b7fbf-78b4-4d73-af0a-466253732668.png) ![image](https://user-images.githubusercontent.com/91300257/153623056-6b1bf93f-0d5e-4399-a2f3-8584c9dcb289.png) ![image](https://user-images.githubusercontent.com/91300257/153623078-06dd1a40-765a-4976-b33d-f00b747c6100.png) ![image](https://user-images.githubusercontent.com/91300257/153623097-f8793651-29fa-4870-9f00-04482717376b.png) ![image](https://user-images.githubusercontent.com/91300257/153623112-1a606795-6228-44a1-829d-5285e031ba40.png) ![image](https://user-images.githubusercontent.com/91300257/153623128-f8a9a0b3-8af2-4827-85ab-e134c09dbc4d.png) ![image](https://user-images.githubusercontent.com/91300257/153623153-f669531b-9636-41d6-b767-3f784011814d.png) ![image](https://user-images.githubusercontent.com/91300257/153623198-d8bdc8f8-02c5-47e3-ac2d-0364980414ba.png)

esperando se pudiera haber cumplido con la mayoria de requerimientos y luchando porue cada día pueda ser mejor, espero les guste

Adjunto URL de despliegue

https://tender-archimedes-4661ad.netlify.app/
andreaguerrero8 commented 2 years ago

cordial saludo adjunto url de despliegue

https://tender-archimedes-4661ad.netlify.app/

@JhonFlorez25 @Gatc-18 @leonyudithk