SlideShare una empresa de Scribd logo
1 de 1
Descargar para leer sin conexión
Ejercicio Javascript & Web Storage
Ejercicio práctico no presencial
Objetivo: Implementación de un sitio de web real utilizando validaciones y web Storage
implementadas en javascript.
Especificaciones
La radio “Sonando.FM”, necesita un sitio web para su nuevo concurso “Artista Sonando”, en el
cual los usuarios deben inscribirse llenando un formulario y elegir a su artista o grupo favorito.
 Página de inicio (Descripción del concurso).
 Página de inscripción (Formulario de inscripción).
 Página de notificación de inscripción (Despliegue de datos).
Especificaciones técnicas
Especificaciones generales: Es importante tener en cuenta que para este trabajo las paginas
deben estar compuestas por la estructura estándar HTML5 y CSS. El diseño de la página debe
estar compuesto solo por 1 archivo CSS (solo un diseño para el sitio y un archivo javascript,
para ambos casos se debe utilizar el método referencia por archivo externo. El sitio debe
poseer un menú de navegación vincular las 3 páginas de este sitio entre sí.
Página de inicio: Debe tener una descripción del concurso además de una imagen y un botón
que diga “Participar en el concurso”, este debe re direccionar al usuario página de inscripción.
Página de inscripción: Esta página debe desplegar un formulario de inscripción, el cual debe
tener los siguientes campos: Rut, nombre, número de teléfono, email, artista(mediante un
control select a lo menos debe tener 5 artistas o grupos musicales) y un botón “Participar”,
además cada uno de estos debe contar con una validación (Validación con Javascript).Una vez
que el usuario haya ingresado y sus datos y estos se encuentren validados, el usuario debe
enviar sus datos presionando el botón “Participar” y luego debe ser re direccionado a la
página de notificación de inscripción. Los datos del formulario de usuarios se deben almacenar
mediante Web Storage.
Página de notificación de inscripción: Esta página debe desplegar los datos del usuario
recientemente inscrito dentro área section de la página. Con un mensaje que diga “Tu
inscripción se ha realizado de forma exitosa”.
Formato de envió: El trabajo debe estar comprimido en un archivo .rar con su nombre y
apellido, este debe ser enviado vía correo electrónico a esta dirección
profesorsotomateluna@gmail.com , el asunto del correo debe ser: Tarea 3 –Nombre- Numero
de sección.

Más contenido relacionado

Destacado

Sociala medier-sep-2010
Sociala medier-sep-2010Sociala medier-sep-2010
Sociala medier-sep-2010Johan Groth
 
Ventum s mecanum-buehnenwagen-de
Ventum s mecanum-buehnenwagen-deVentum s mecanum-buehnenwagen-de
Ventum s mecanum-buehnenwagen-deHermann Schreiter
 
PKF Agility - Process management
PKF Agility - Process managementPKF Agility - Process management
PKF Agility - Process managementPKF Consult
 
Catalog images3
Catalog images3Catalog images3
Catalog images3Like Music
 
PETROTECH ENTERPRISES - KS Tools (U.A.E.)
PETROTECH ENTERPRISES - KS Tools (U.A.E.)PETROTECH ENTERPRISES - KS Tools (U.A.E.)
PETROTECH ENTERPRISES - KS Tools (U.A.E.)PETROTECH ENTERPRISES
 
Lma C Trach T Presentacion General
Lma C Trach T Presentacion GeneralLma C Trach T Presentacion General
Lma C Trach T Presentacion Generaleducacionanestesia
 
French rev role play cp
French rev role play cpFrench rev role play cp
French rev role play cpLauren Rivard
 
Gárgolas de la Lonja de valencia
Gárgolas de la Lonja de valenciaGárgolas de la Lonja de valencia
Gárgolas de la Lonja de valenciaernestobelda
 
Programa de vivienda rural en la costa caribe Luisa Gómez
Programa de vivienda rural en la costa caribe   Luisa GómezPrograma de vivienda rural en la costa caribe   Luisa Gómez
Programa de vivienda rural en la costa caribe Luisa Gómezjupate
 
Presentación y Breve Introducción al CAD-CAM
Presentación y Breve Introducción al CAD-CAMPresentación y Breve Introducción al CAD-CAM
Presentación y Breve Introducción al CAD-CAMJaime Del Río Highsmith
 
To tweet or not to tweet: Exploring the role of social media in public health...
To tweet or not to tweet: Exploring the role of social media in public health...To tweet or not to tweet: Exploring the role of social media in public health...
To tweet or not to tweet: Exploring the role of social media in public health...Kevin Clauson
 

Destacado (17)

Apunta junio 2012
Apunta junio 2012 Apunta junio 2012
Apunta junio 2012
 
Sociala medier-sep-2010
Sociala medier-sep-2010Sociala medier-sep-2010
Sociala medier-sep-2010
 
Ventum s mecanum-buehnenwagen-de
Ventum s mecanum-buehnenwagen-deVentum s mecanum-buehnenwagen-de
Ventum s mecanum-buehnenwagen-de
 
PKF Agility - Process management
PKF Agility - Process managementPKF Agility - Process management
PKF Agility - Process management
 
Catalog images3
Catalog images3Catalog images3
Catalog images3
 
Tallas grandes vestidos
Tallas grandes vestidosTallas grandes vestidos
Tallas grandes vestidos
 
Espar for Oil & Gas Markets
Espar for Oil & Gas MarketsEspar for Oil & Gas Markets
Espar for Oil & Gas Markets
 
Tendencias e Impactos de los Cambios
Tendencias e Impactos de los CambiosTendencias e Impactos de los Cambios
Tendencias e Impactos de los Cambios
 
PETROTECH ENTERPRISES - KS Tools (U.A.E.)
PETROTECH ENTERPRISES - KS Tools (U.A.E.)PETROTECH ENTERPRISES - KS Tools (U.A.E.)
PETROTECH ENTERPRISES - KS Tools (U.A.E.)
 
Lma C Trach T Presentacion General
Lma C Trach T Presentacion GeneralLma C Trach T Presentacion General
Lma C Trach T Presentacion General
 
Cursos Sistemas de Reservas Amadeus innovtur
Cursos Sistemas de Reservas Amadeus innovturCursos Sistemas de Reservas Amadeus innovtur
Cursos Sistemas de Reservas Amadeus innovtur
 
French rev role play cp
French rev role play cpFrench rev role play cp
French rev role play cp
 
Gárgolas de la Lonja de valencia
Gárgolas de la Lonja de valenciaGárgolas de la Lonja de valencia
Gárgolas de la Lonja de valencia
 
Programa de vivienda rural en la costa caribe Luisa Gómez
Programa de vivienda rural en la costa caribe   Luisa GómezPrograma de vivienda rural en la costa caribe   Luisa Gómez
Programa de vivienda rural en la costa caribe Luisa Gómez
 
Peritoneo
PeritoneoPeritoneo
Peritoneo
 
Presentación y Breve Introducción al CAD-CAM
Presentación y Breve Introducción al CAD-CAMPresentación y Breve Introducción al CAD-CAM
Presentación y Breve Introducción al CAD-CAM
 
To tweet or not to tweet: Exploring the role of social media in public health...
To tweet or not to tweet: Exploring the role of social media in public health...To tweet or not to tweet: Exploring the role of social media in public health...
To tweet or not to tweet: Exploring the role of social media in public health...
 

Similar a Concurso música JS Web Storage

Similar a Concurso música JS Web Storage (8)

Especialista Web J3
Especialista Web   J3Especialista Web   J3
Especialista Web J3
 
Manual de Desarrollo Formularios Web de Maestros y Operaciones en eFactory S...
Manual de Desarrollo Formularios Web de Maestros  y Operaciones en eFactory S...Manual de Desarrollo Formularios Web de Maestros  y Operaciones en eFactory S...
Manual de Desarrollo Formularios Web de Maestros y Operaciones en eFactory S...
 
Diapositivas
DiapositivasDiapositivas
Diapositivas
 
Evidencia 3.
Evidencia 3.Evidencia 3.
Evidencia 3.
 
Computacion 3 cb09302 2013
Computacion 3 cb09302 2013Computacion 3 cb09302 2013
Computacion 3 cb09302 2013
 
Bebe
BebeBebe
Bebe
 
Creación Visual de Aplicaciones con Php y mySql
Creación Visual de Aplicaciones con Php y mySqlCreación Visual de Aplicaciones con Php y mySql
Creación Visual de Aplicaciones con Php y mySql
 
G) formularios 2
G) formularios 2G) formularios 2
G) formularios 2
 

Último

Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...
Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...
Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...Francisco Javier Mora Serrano
 
Historia de la Arquitectura II, 1era actividad..pdf
Historia de la Arquitectura II, 1era actividad..pdfHistoria de la Arquitectura II, 1era actividad..pdf
Historia de la Arquitectura II, 1era actividad..pdfIsbelRodrguez
 
Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023
Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023
Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023ANDECE
 
Sistema de gestión de turnos para negocios
Sistema de gestión de turnos para negociosSistema de gestión de turnos para negocios
Sistema de gestión de turnos para negociosfranchescamassielmor
 
3.3 Tipos de conexiones en los transformadores trifasicos.pdf
3.3 Tipos de conexiones en los transformadores trifasicos.pdf3.3 Tipos de conexiones en los transformadores trifasicos.pdf
3.3 Tipos de conexiones en los transformadores trifasicos.pdfRicardoRomeroUrbano
 
CFRD simplified sequence for Mazar Hydroelectric Project
CFRD simplified sequence for Mazar Hydroelectric ProjectCFRD simplified sequence for Mazar Hydroelectric Project
CFRD simplified sequence for Mazar Hydroelectric ProjectCarlos Delgado
 
Estudio de materiales asfalticos para utilizar en obras viales
Estudio de materiales asfalticos para utilizar en obras vialesEstudio de materiales asfalticos para utilizar en obras viales
Estudio de materiales asfalticos para utilizar en obras vialesRamonCortez4
 
MUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptx
MUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptxMUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptx
MUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptxIcelaMartnezVictorin
 
I LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptx
I LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptxI LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptx
I LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptxPATRICIAKARIMESTELAL
 
LIQUIDACION OBRAS PUBLICAS POR CONTRATA.pdf
LIQUIDACION OBRAS PUBLICAS  POR CONTRATA.pdfLIQUIDACION OBRAS PUBLICAS  POR CONTRATA.pdf
LIQUIDACION OBRAS PUBLICAS POR CONTRATA.pdfManuelVillarreal44
 
La mineralogia y minerales, clasificacion
La mineralogia y minerales, clasificacionLa mineralogia y minerales, clasificacion
La mineralogia y minerales, clasificacionnewspotify528
 
S454444444444444444_CONTROL_SET_A_GEOMN1204.pdf
S454444444444444444_CONTROL_SET_A_GEOMN1204.pdfS454444444444444444_CONTROL_SET_A_GEOMN1204.pdf
S454444444444444444_CONTROL_SET_A_GEOMN1204.pdffredyflores58
 
PRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdf
PRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdfPRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdf
PRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdfAuraGabriela2
 
CONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdf
CONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdfCONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdf
CONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdfErikNivor
 
FORMATO REPORTE SEMANAL KLEF - Sem 15.pptx
FORMATO REPORTE SEMANAL KLEF - Sem 15.pptxFORMATO REPORTE SEMANAL KLEF - Sem 15.pptx
FORMATO REPORTE SEMANAL KLEF - Sem 15.pptxSAMAELAUGURIOFIGUERE
 
01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx
01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx
01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptxluiscisnerosayala23
 
5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx
5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx
5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptxNayeliZarzosa1
 
Descubrimiento de la penicilina en la segunda guerra mundial
Descubrimiento de la penicilina en la segunda guerra mundialDescubrimiento de la penicilina en la segunda guerra mundial
Descubrimiento de la penicilina en la segunda guerra mundialyajhairatapia
 

Último (20)

Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...
Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...
Hanns Recabarren Diaz (2024), Implementación de una herramienta de realidad v...
 
Historia de la Arquitectura II, 1era actividad..pdf
Historia de la Arquitectura II, 1era actividad..pdfHistoria de la Arquitectura II, 1era actividad..pdf
Historia de la Arquitectura II, 1era actividad..pdf
 
Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023
Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023
Centro Integral del Transporte de Metro de Madrid (CIT). Premio COAM 2023
 
Linea del tiempo de la inteligencia artificial.pptx
Linea del tiempo de la inteligencia artificial.pptxLinea del tiempo de la inteligencia artificial.pptx
Linea del tiempo de la inteligencia artificial.pptx
 
Sistema de gestión de turnos para negocios
Sistema de gestión de turnos para negociosSistema de gestión de turnos para negocios
Sistema de gestión de turnos para negocios
 
3.3 Tipos de conexiones en los transformadores trifasicos.pdf
3.3 Tipos de conexiones en los transformadores trifasicos.pdf3.3 Tipos de conexiones en los transformadores trifasicos.pdf
3.3 Tipos de conexiones en los transformadores trifasicos.pdf
 
MATPEL COMPLETO DESDE NIVEL I AL III.pdf
MATPEL COMPLETO DESDE NIVEL I AL III.pdfMATPEL COMPLETO DESDE NIVEL I AL III.pdf
MATPEL COMPLETO DESDE NIVEL I AL III.pdf
 
CFRD simplified sequence for Mazar Hydroelectric Project
CFRD simplified sequence for Mazar Hydroelectric ProjectCFRD simplified sequence for Mazar Hydroelectric Project
CFRD simplified sequence for Mazar Hydroelectric Project
 
Estudio de materiales asfalticos para utilizar en obras viales
Estudio de materiales asfalticos para utilizar en obras vialesEstudio de materiales asfalticos para utilizar en obras viales
Estudio de materiales asfalticos para utilizar en obras viales
 
MUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptx
MUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptxMUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptx
MUROS Y CONEXIONES NTC 2017 CONCRETO REFORZADO.pptx
 
I LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptx
I LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptxI LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptx
I LINEAMIENTOS Y CRITERIOS DE INFRAESTRUCTURA DE RIEGO.pptx
 
LIQUIDACION OBRAS PUBLICAS POR CONTRATA.pdf
LIQUIDACION OBRAS PUBLICAS  POR CONTRATA.pdfLIQUIDACION OBRAS PUBLICAS  POR CONTRATA.pdf
LIQUIDACION OBRAS PUBLICAS POR CONTRATA.pdf
 
La mineralogia y minerales, clasificacion
La mineralogia y minerales, clasificacionLa mineralogia y minerales, clasificacion
La mineralogia y minerales, clasificacion
 
S454444444444444444_CONTROL_SET_A_GEOMN1204.pdf
S454444444444444444_CONTROL_SET_A_GEOMN1204.pdfS454444444444444444_CONTROL_SET_A_GEOMN1204.pdf
S454444444444444444_CONTROL_SET_A_GEOMN1204.pdf
 
PRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdf
PRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdfPRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdf
PRIMER Y SEGUNDO TEOREMA DE CASTIGLIANO.pdf
 
CONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdf
CONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdfCONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdf
CONSTRUCCIONES II - SEMANA 01 - REGLAMENTO NACIONAL DE EDIFICACIONES.pdf
 
FORMATO REPORTE SEMANAL KLEF - Sem 15.pptx
FORMATO REPORTE SEMANAL KLEF - Sem 15.pptxFORMATO REPORTE SEMANAL KLEF - Sem 15.pptx
FORMATO REPORTE SEMANAL KLEF - Sem 15.pptx
 
01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx
01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx
01 COSTOS UNITARIOS Y PRESUPUESTO DE OBRA-EXPEDIENTE TECNICO DE OBRA.pptx
 
5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx
5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx
5.1 MATERIAL COMPLEMENTARIO Sesión 02.pptx
 
Descubrimiento de la penicilina en la segunda guerra mundial
Descubrimiento de la penicilina en la segunda guerra mundialDescubrimiento de la penicilina en la segunda guerra mundial
Descubrimiento de la penicilina en la segunda guerra mundial
 

Concurso música JS Web Storage

  • 1. Ejercicio Javascript & Web Storage Ejercicio práctico no presencial Objetivo: Implementación de un sitio de web real utilizando validaciones y web Storage implementadas en javascript. Especificaciones La radio “Sonando.FM”, necesita un sitio web para su nuevo concurso “Artista Sonando”, en el cual los usuarios deben inscribirse llenando un formulario y elegir a su artista o grupo favorito.  Página de inicio (Descripción del concurso).  Página de inscripción (Formulario de inscripción).  Página de notificación de inscripción (Despliegue de datos). Especificaciones técnicas Especificaciones generales: Es importante tener en cuenta que para este trabajo las paginas deben estar compuestas por la estructura estándar HTML5 y CSS. El diseño de la página debe estar compuesto solo por 1 archivo CSS (solo un diseño para el sitio y un archivo javascript, para ambos casos se debe utilizar el método referencia por archivo externo. El sitio debe poseer un menú de navegación vincular las 3 páginas de este sitio entre sí. Página de inicio: Debe tener una descripción del concurso además de una imagen y un botón que diga “Participar en el concurso”, este debe re direccionar al usuario página de inscripción. Página de inscripción: Esta página debe desplegar un formulario de inscripción, el cual debe tener los siguientes campos: Rut, nombre, número de teléfono, email, artista(mediante un control select a lo menos debe tener 5 artistas o grupos musicales) y un botón “Participar”, además cada uno de estos debe contar con una validación (Validación con Javascript).Una vez que el usuario haya ingresado y sus datos y estos se encuentren validados, el usuario debe enviar sus datos presionando el botón “Participar” y luego debe ser re direccionado a la página de notificación de inscripción. Los datos del formulario de usuarios se deben almacenar mediante Web Storage. Página de notificación de inscripción: Esta página debe desplegar los datos del usuario recientemente inscrito dentro área section de la página. Con un mensaje que diga “Tu inscripción se ha realizado de forma exitosa”. Formato de envió: El trabajo debe estar comprimido en un archivo .rar con su nombre y apellido, este debe ser enviado vía correo electrónico a esta dirección profesorsotomateluna@gmail.com , el asunto del correo debe ser: Tarea 3 –Nombre- Numero de sección.