freeCodeCamp

5.1 KiB

Raw Blame History

id	title	isRequired	challengeType	videoUrl	localeTitle
587d78af367417b2b2512b03	Build a Survey Form	true	3		Crear un formulario de encuesta

Description

Objetivo: crear una aplicación CodePen.io que sea funcionalmente similar a esta: https://codepen.io/freeCodeCamp/full/VPaoNP . Cumple las siguientes historias de usuario y haz que pasen todas las pruebas. Dale tu propio estilo personal. Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda CSS simple porque eso es lo que las lecciones han cubierto hasta ahora y debe obtener algo de práctica con CSS simple. Puede utilizar Bootstrap o SASS si lo desea. No se recomiendan tecnologías adicionales (solo por ejemplo, jQuery, React, Angular o Vue) para este proyecto, y su uso es bajo su propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes pilas de tecnología como React. Aceptaremos e intentaremos solucionar todos los informes de problemas que utilizan la pila de tecnología sugerida para este proyecto. ¡Feliz codificación! Historia de usuario n. ° 1: Puedo ver un título con id="title" en texto de tamaño H1. Historia de usuario n. ° 2: Puedo ver una breve explicación con id="description" en texto de tamaño P. Historia de usuario n. ° 3: Puedo ver un form con id="survey-form" . Historia de usuario # 4: Dentro del elemento del formulario, debo ingresar mi nombre en un campo con id="name" . Historia de usuario n. ° 5: Dentro del elemento del formulario, debo ingresar un correo electrónico en un campo con id="email" . Historia de usuario n. ° 6: Si ingreso un correo electrónico que no tiene el formato correcto, veré un error de validación de HTML5. Historia de usuario n. ° 7: Dentro del formulario, puedo ingresar un número en un campo con id="number" . Historia de usuario n. ° 8: Si ingreso números que no son números en la entrada del número, veré un error de validación de HTML5. Historia de usuario n. ° 9: si ingreso números fuera del rango del ingreso de números, que están definidos por los atributos min y max , veré un error de validación de HTML5. Historia de usuario n. ° 10: Para los campos de ingreso de nombre, correo electrónico y número dentro del formulario, puedo ver las etiquetas correspondientes que describen el propósito de cada campo con los siguientes id="name-label" : id="name-label" , id="email-label" , y id="number-label" . Historia de usuario n. ° 11: Para los campos de ingreso de nombre, correo electrónico y número, puedo ver el texto del marcador de posición que me da una descripción o instrucciones para cada campo. Historia del usuario n. ° 12: Dentro del elemento del formulario, puedo seleccionar una opción de un menú desplegable que tiene un id="dropdown" correspondiente id="dropdown" . Historia de usuario n. ° 13: Dentro del elemento del formulario, puedo seleccionar un campo de uno o más grupos de botones de radio. Cada grupo debe agruparse usando el atributo de name . Historia de usuario n. ° 14: Dentro del elemento del formulario, puedo seleccionar varios campos de una serie de casillas de verificación, cada una de las cuales debe tener un atributo de value . Historia de usuario # 15: Dentro del elemento del formulario, me presentan un área de textarea al final para comentarios adicionales. Historia de usuario n. ° 16: Dentro del elemento de formulario, se me presenta un botón con id="submit" para enviar todas mis entradas. Puedes construir tu proyecto por medio de este CodePen . O puede usar este enlace CDN para ejecutar las pruebas en el entorno que desee: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js Una vez que haya terminado, envíe la URL a su cuenta Proyecto con todas sus pruebas aprobadas. Recuerda usar el método de lectura-búsqueda-pregunta si te atascas.

Instructions

Tests

tests: []

Challenge Seed

Solution

// solution required

5.1 KiB Raw Blame History