Passo 1
Percorso di apprendimento
Front end developer: la roadmap
Corsi gratuiti nell'ordine in cui servono davvero a un front end developer: HTML per la struttura, CSS per il layout, JavaScript per il comportamento, TypeScript per la sicurezza, React e Next.js per applicazioni reali, Git per pubblicare, e otto progetti per dimostrarlo. Ogni lezione gira nel browser e ogni corso prima del passaggio dei progetti termina con un certificato gratuito.
663,032+ codder iscritti a questi corsi
804 lezioni681 sfide3,184 domande del quiz
- Adatto ai principianti
Aiuto alla programmazione con l'AI
Lezioni interattive pratiche
Narrazione audio in ogni lezione
Quiz per mettere alla prova le tue conoscenze
13 certificati gratuiti lungo il percorso
Il percorso da front end developer, passo dopo passo
Ogni passaggio è un corso Coddy già esistente. Seguili in ordine, o passa direttamente a quello che ti manca: i tuoi progressi vengono salvati per ogni corso in entrambi i casi.
- 1
- 2Passo 2
CSS: layout e designPagina dedicata
Inizia questo passoIniziaSelettori, il box model, colori e tipografia, poi flexbox, grid, layout responsive, transizioni e animazioni, in due sezioni. Questo è il passaggio in cui una pagina inizia ad assomigliare a quelle che usi.IniziaPagina dedicata2 sezioni, in ordine - 3Passo 3
JavaScript, il linguaggio completoPagina dedicata
Inizia questo passoIniziaFondamenti, logica e flusso di controllo, poi oggetti e classi, in tre sezioni. Il lavoro front end è lavoro in JavaScript; ogni framework dopo questo passaggio è solo un modo di organizzarlo, ed è leggibile solo quando lo è il linguaggio.IniziaPagina dedicata3 sezioni, in ordine - 4Passo 4
JavaScript nel browserPagina dedicata
Inizia questo passoIniziaIl DOM, gli eventi, il recupero di dati e la costruzione di pagine interattive senza framework, poi schemi pratici del front end. Qui HTML, CSS e JavaScript diventano una cosa sola: una pagina che risponde a chi la usa.IniziaPagina dedicata2 sezioni, in ordine - 5Passo 5
TypeScriptPagina dedicata
Inizia questo passoIniziaTipi, interfacce, generics e gli errori del compilatore come strumento. Quasi ogni progetto professionale in React è in TypeScript, quindi viene subito prima del framework invece che come aggiunta dell'ultimo minuto.IniziaPagina dedicata - 6Passo 6
React e Next.jsPagina dedicata
Inizia questo passoIniziaComponenti, props, stato, hook e rendering, poi Next.js per il routing, il caricamento dei dati e applicazioni reali. Il framework richiesto dalla maggior parte degli annunci front end, insegnato dopo il linguaggio in cui è scritto.IniziaPagina dedicata2 sezioni, in ordine - 7Passo 7
Git e controllo di versionePagina dedicata
Inizia questo passoIniziaCommit, branch, merge, risoluzione dei conflitti e repository remoti. Ogni lavoro front end e ogni progetto di portfolio vive in un repository Git; impararlo qui significa che i progetti del passaggio successivo vengono pubblicati come si fa nel lavoro vero.IniziaPagina dedicata - 8Passo 8
Progetti: costruisci ciò che hai visto
Inizia questo passoIniziaEsercizi su flexbox e selettori, pratica con il DOM e i metodi degli array, poi progetti reali: una scheda profilo Coddy, una pagina Instagram, una pagina di accesso di Netflix e uno slider di immagini. Ognuno è un pezzo di portfolio che un selezionatore può aprire.Inizia8 corsi, in ordine- CSS Flexbox - Il corso completoSolo html15 lezioni
- Selettori CSSSolo html15 lezioni
- Metodi DOM di JavaScriptSolo html13 lezioni
- Metodi degli array in JavaScriptSolo javascript18 lezioni
- Clone della scheda profilo Coddy | Progetto front-endSolo html26 lezioni
- Clone di una pagina Instagram | Progetto Front-EndSolo html16 lezioni
- Clone della pagina di accesso a Netflix | Progetto front-endSolo html19 lezioni1 sfide
- Slider | Progetto front-endSolo html23 lezioni1 sfide
Cosa ottieni
Tutto ciò che userai per imparare a programmare
Impara facendo
Scrivi codice vero, interroga database, crea siti web e padroneggia i prompt per l'AI. Le nostre lezioni interattive coprono tutte le competenze di cui ha bisogno uno sviluppatore moderno.
playground.js
Editor di codice
1const greeting = "Hello, Coddy!"
2function sayHi(name) {
3 return greeting + " " + name
4}
5
Test #1
Test #2
Test #3
Input
"Alex"
Output
"Hello, Coddy! Alex"
Costruisci la tua serie
Sii costante e guarda crescere i tuoi progressi! Tieni traccia della tua abitudine quotidiana di programmare, proteggi la tua serie con i giorni di congelamento e guadagna ricompense ogni giorno che ti presenti.
12 giorni di serie
Torna domani per mantenere la tua serie!
January 2026
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
21
22
23
24
25
26
27
28
29
30
Lascia o raddoppia
Giorno 5 di 7
Congela serie
2 left
Programma ovunque
Porta il tuo percorso di programmazione sempre con te! Niente configurazioni, niente download: apri l'app e inizia a programmare. Disponibile su iOS, Android e Web con valutazioni di 4,9 stelle.
7
250
5
Variabili
CONTINUA
4.9
Valutazione
Non sei solo
Competi nelle classifiche globali, invita gli amici per guadagnare ricompense e festeggiate insieme i vostri successi. Programmare è più bello con gli amici!
Lega SfidanteI primi 7 avanzano
1
Alex7+ Days
2840
2
Jordan7+ Days
2650
3
Sam7+ Days
2420
4
Casey
2180
5
Morgan7+ Days
1950
Zona promozioneTutti i modi per imparare
Leggi, ascolta, mettiti alla prova, chiedi all'AI o ripassa qualsiasi cosa tu abbia già visto. Ogni lezione si adatta a te.
Introduzione alle variabili
Audio
Una variabile è un contenitore con un nome che memorizza un valore a cui puoi fare riferimento più avanti nel programma.
In Python la crei scrivendo il nome, un segno di uguale e poi il valore che vuoi memorizzare.
Il valore può cambiare nel tempo: riassegnare il nome lo fa semplicemente puntare a un nuovo valore.
1xSarah
Ottieni un certificato
Ottieni un certificato per ogni corso che completi. Aggiungilo al tuo profilo LinkedIn e al curriculum per mostrare ai datori di lavoro le tue competenze di programmazione.
Certificato di completamentoSi certifica cheMario Rossiha completato con successoFondamenti di Python
Fondamenti di Python
Datagen 2026
Aggiungi a LinkedInPerché imparare lo sviluppo front end su Coddy
- Vedi la pagina che costruisci. Ogni lezione di HTML, CSS e JavaScript viene visualizzata dal vivo nel browser accanto al tuo codice, quindi un selettore sbagliato o un flexbox rotto si vede nell'istante in cui lo scrivi, non in uno screenshot alla fine.
- L'ordine giusto, senza saltare JavaScript. La maggior parte dei corsi front end corre dall'HTML a un framework; questo percorso dedica a JavaScript tre sezioni complete prima di React, perché un framework diventa leggibile solo quando lo è il linguaggio sottostante.
- Suggerimenti AI che leggono il tuo markup e il tuo codice. Quando un layout si rompe o un componente non viene visualizzato, Bugsy guarda cosa hai scritto e ti indirizza verso la correzione senza darti la risposta.
- Progetti che un selezionatore può aprire. L'ultimo passaggio è fatto di otto progetti reali, cloni di pagine che conosci già, ognuno un pezzo di portfolio da condividere, più un certificato gratuito per ogni corso dei primi sette passaggi.
Domande frequenti su come diventare front end developer
Come si diventa front end developer?
Impara HTML, CSS e JavaScript abbastanza bene da costruire una pagina partendo da un file vuoto, aggiungi TypeScript e un framework (React è la scelta sicura), impara Git, poi costruisci tre o quattro progetti reali senza tutorial e mettili online. Questo è il percorso, in quest'ordine. I progetti contano più dei certificati: un portfolio front end è l'unica cosa che un responsabile delle assunzioni può giudicare in trenta secondi.
Devo imparare prima HTML, CSS o JavaScript?
Prima HTML, poi CSS, poi JavaScript, e dedica a JavaScript più tempo. Per prendere confidenza servono un paio di settimane con l'HTML e un mese con il CSS; JavaScript è un linguaggio di programmazione completo ed è dove la maggior parte degli sviluppatori front end autodidatti prende scorciatoie. Questo percorso gli dedica tre sezioni più una sezione sul DOM prima che compaia qualsiasi framework.
Serve TypeScript per fare il front end developer?
Per lavorare, quasi sempre: la grande maggioranza dei progetti professionali in React e Next.js è scritta in TypeScript, e un annuncio che dice 'JavaScript' in pratica di solito intende TypeScript. È un passo breve quando JavaScript è solido, ed è per questo che in questo percorso sta subito prima di React invece che alla fine.
React, Vue o Angular: quale framework imparare?
React, a meno che l'offerta di lavoro che ti interessa non chieda altro. Ha di gran lunga più offerte di lavoro, l'ecosistema più grande, e Next.js, che poggia su React, è ciò con cui si costruisce la maggior parte dei nuovi siti in produzione. Le idee (componenti, stato, props, rendering) si trasferiscono poi a Vue e Angular in una o due settimane. Questo percorso insegna React e Next.js.
Quanto tempo ci vuole per imparare lo sviluppo front end?
Da sei a nove mesi circa, con un'ora al giorno, per arrivare a un livello junior con un portfolio. In questo percorso HTML e CSS insieme richiedono da sei a otto settimane, JavaScript da due a tre mesi, TypeScript due settimane, React e Next.js sei settimane, e il passaggio dei progetti dura quanto continui a costruire. Il numero che conta sono i progetti finiti, non le lezioni finite.
Questo percorso copre test, accessibilità o gestione dello stato?
Non con corsi dedicati, e preferiamo dirlo piuttosto che gonfiare la pagina. Il markup semantico, la base delle pagine accessibili, fa parte del passaggio sull'HTML, e la gestione dello stato propria di React è trattata; un corso sui test, un lavoro più approfondito sull'accessibilità e una libreria per lo stato sono nella roadmap del programma e si aggiungeranno a questo percorso come nuovi passaggi quando usciranno.
Posso trovare lavoro come front end developer solo con corsi gratuiti?
Sì, se i corsi producono un portfolio, ed è per questo che questo percorso termina con otto progetti. Quello che i datori di lavoro valutano è una pagina costruita da te che possono aprire, una cronologia Git che mostra che l'hai costruita tu, e un colloquio in cui sai spiegare un layout e un componente. Tutte e tre le cose vengono da questo percorso; nessuna richiede un bootcamp a pagamento.
