freeCodeCamp/curriculum/challenges/italian/01-responsive-web-design/responsive-web-design-projects/build-a-survey-form.md

58 lines
3.6 KiB
Markdown
Raw Normal View History

---
id: 587d78af367417b2b2512b03
title: Creare un modulo di sondaggio
challengeType: 3
forumTopicId: 301145
dashedName: build-a-survey-form
---
# --description--
**Obiettivo:** Costruisci un'app [CodePen.io](https://codepen.io) funzionalmente simile a questa: <https://codepen.io/freeCodeCamp/full/VPaoNP>.
Compila le [user stories](https://en.wikipedia.org/wiki/User_story) qui sotto e fai passare tutti i test. Dalle il tuo stile personale.
Puoi utilizzare HTML, JavaScript, e CSS per completare questo progetto. CSS è raccomandato perché è l'argomento delle lezioni viste finora e dovresti fare pratica con il CSS di base. Se lo desideri puoi anche utilizzare Bootstrap o SASS. Ulteriori tecnologie (solo per esempio jQuery, React, Angular, o Vue) non sono raccomandate per questo progetto, e usarle è a tuo rischio. Altri progetti ti daranno la possibilità di lavorare con diversi stack tecnologici come React. Accetteremo e cercheremo di risolvere tutte le segnalazioni di problemi che utilizzano lo stack tecnologico suggerito per questo progetto. Happy coding!
**User Story #1:** Posso vedere un titolo con `id="title"` in un testo di dimensioni H1.
**User Story #2:** Posso vedere una breve spiegazione con `id="description"` in un testo di dimensione P.
**User Story #3:** Posso vedere un `form` con `id="survey-form"`.
**User Story #4:** All'interno del modulo, mi viene chiesto di inserire il mio nome in un campo con `id="name"`.
**User Story #5:** All'interno del modulo, mi viene chiesto di inserire un'email in un campo con `id="email"`.
**User Story #6:** Se inserisco un'email non formattata correttamente, vedrò un errore di validazione HTML5.
**User Story #7:** All'interno del modulo, posso inserire un numero in un campo con `id="number"`.
**User story #8:** Se inserisco caratteri non numerici nell'input di tipo number, vedrò un errore di validazione HTML5.
**User story #9:** Se inserisco numeri al di fuori dell'intervallo dell'input numerico, che sono definiti dagli attributi `min` e `max`, vedrò un errore di validazione HTML5.
**User story #10:** Per il nome, l'e-mail, e i campi di input numerici all'interno del modulo posso vedere le etichette corrispondenti che descrivono lo scopo di ogni campo con i seguenti id: `id="name-label"`, `id="email-label"`e `id="number-label"`.
**User story#11:** Per i campi di input di nome, email e numero, posso vedere il testo segnaposto che mi dà una descrizione o delle istruzioni per ogni campo.
**User story #12:** All'interno del modulo, posso selezionare un'opzione da un menu a discesa che ha un corrispondente `id="dropdown"`.
**User story #13:** All'interno del modulo, posso selezionare un campo da uno o più gruppi di pulsanti di opzione. Ogni gruppo dovrebbe essere raggruppato usando l'attributo `name`.
**User story #14:** All'interno del modulo, posso selezionare diversi campi da una serie di caselle di spunta, ciascuno dei quali deve avere un attributo `value`.
**User story #15:** All'interno del modulo, mi viene presentata alla fine una `textarea`, per inserire ulteriori commenti.
**User story #16:** All'interno del modulo, mi viene presentato un pulsante con `id="submit"` per inviare tutti i miei input.
Puoi costruire il tuo progetto <a href='https://codepen.io/pen?template=MJjpwO' target='_blank' rel='nofollow'>usando questo modello CodePen</a> e facendo clic su `Save` per creare il tuo pen. Oppure puoi usare questo link CDN per eseguire i test in qualsiasi ambiente tu voglia: `https://cdn.freecodecamp.org/testable-projects-fcc/v1/bundle.js`
Una volta fatto, invia l'URL del tuo progetto di lavoro con tutti i suoi test passati.
# --solutions--
```html
// solution required
```