3.8 KiB
| id | title | challengeType | forumTopicId | dashedName |
|---|---|---|---|---|
| 587d78af367417b2b2512b03 | Crea un formulario de encuesta | 3 | 301145 | build-a-survey-form |
--description--
Objetivo: Construye una aplicación en CodePen.io que funcionalmente sea similar a esta: https://codepen.io/freeCodeCamp/full/VPaoNP.
Completa las siguientes historias de usuario y consigue aprobar todos los tests. Dale tu propio estilo personal.
Puedes usar HTML, JavaScript y CSS para completar este proyecto. Se recomienda usar CSS puro porque eso es lo que las lecciones han cubierto hasta ahora y debes practicar un poco con él. Puedes usar Bootstrap o SASS si lo deseas. Tecnologías adicionales (por ejemplo, jQuery, React, Angular o Vue) no se recomiendan para este proyecto, y usarlas es bajo tu propio riesgo. Otros proyectos te darán la oportunidad de trabajar con diferentes stacks de tecnologías como React. Aceptaremos e intentaremos solucionar todos los informes de incidencias que utilicen el stack de tecnología sugerido para este proyecto. ¡Feliz día programando!
Historia de Usuario #1: Puedo ver un título con id="title" en texto tamaño H1.
Historia de Usuario #2: Puedo ver una breve explicación con id="description" en texto tamaño P.
Historia de Usuario #3: Puedo ver un elemento form con id="survey-form".
Historia de Usuario #4: Dentro del elemento form, es requerido introducir mi nombre en un campo con id="name".
Historia de Usuario #5: Dentro del elemento form, es requerido introducir un correo electrónico en un campo con id="email".
Historia de Usuario #6: Si introduzco un correo electrónico que no cuente con el formato correcto, veré un error de validación HTML5.
Historia de Usuario #7: Dentro del formulario, puedo introducir un número en un campo con id="number".
Historia de Usuario #8: Si introduzco valores no numéricos en la entrada de números, veré un error de validación HTML5.
Historia de Usuario #9: Si introduzco números fuera del rango de la entrada de números, los cuales son definidos por los atributos min y max, veré un error de validación HTML5.
Historia de Usuario #10: Para los campos nombre, correo, y número dentro del formulario puedo ver las etiquetas (labels) correspondientes que describen el propósito de cada campo con los siguientes ids: id="name-label", id="email-label", y id="number-label".
Historia de Usuario #11: Para los campos nombre, correo y número, puedo ver el texto provisional que me da una descripción o instrucciones para cada campo.
Historia de Usuario #12: Dentro del elemento form, puedo seleccionar una opción de un menú desplegable que tiene el respectivo id="dropdown".
Historia de Usuario #13: Dentro del elemento form, puedo seleccionar un campo de uno o más grupos de botones de radio. Cada grupo debe agruparse utilizando el atributo name.
Historia de Usuario #14: Dentro del elemento form, puedo seleccionar varios campos en una serie de casillas de verificación, cada una de las cuales debe tener un atributo value.
Historia de Usuario #15: Dentro del elemento form, me es presentado un textarea final para hacer comentarios adicionales.
Historia de Usuario #16: Dentro del elemento form, me es presentado un botón con id="submit" para enviar todas mis entradas.
Puedes construir tu proyecto haciendo un fork de este CodePen. O puedes utilizar este enlace CDN para ejecutar los tests en cualquier entorno que desees: https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js
Una vez que hayas terminado, envía la URL de tu proyecto funcional con todos los tests aprobados.
--solutions--
// solution required