Web Development

Immergiti nel mondo dello sviluppo web: impara linguaggi e stili di markup, collega siti a database, crea design e costruisci il tuo sito web.

Età: 13+ anni
Principiante
32 lezioni

Informazioni sul corso

Web Development: questa è un'immersione nel mondo dello sviluppo web. I ragazzi impareranno linguaggi e stili di markup, impareranno a collegare il sito a database, creeranno design e costruiranno il proprio sito web. Il corso copre HTML, CSS, JavaScript, PHP e WordPress.

Argomenti trattati

Creare layout in Figma
Database e motori di siti
Sviluppo di siti web responsive
Imparare HTML per creare markup di siti
Imparare CSS per applicare stili
Lavorare con le animazioni del sito web
Creazione di database per lavorare con gli utenti

Esempi di progetto

Durante il corso, gli studenti realizzeranno progetti pratici come questi:

Portfolio personale

Esempio di progetto del corso

Landing page professionale

Esempio di progetto del corso

Sito web completo con WordPress

Esempio di progetto del corso

📌 Gli esempi dettagliati dei progetti verranno aggiunti a breve. Se hai bisogno immediato di vedere un esempio di progetto, contattaci su WhatsApp!

Curriculum del corso

1

Modulo 1. Introduzione a HTML

  • 1. Gli studenti impareranno cos'è una pagina HTML e proveranno a creare il loro primo layout usando le etiquette più semplici.
  • 2. Multimedia ed embedding. Gli studenti impareranno a usare etiquette multimedia: img, video, audio.
  • 3. Frame e markup di pagina, apprendimento dell'etiquetta iframe e embedding di elementi.
  • 4. Introduzione a CSS. I ragazzi impareranno le basi di CSS e applicheranno i loro primi stili.

Risultato: Nel primo modulo, gli studenti creeranno pagine web integrando contenuti multimedia e apprenderanno le basi della stilizzazione degli elementi.

2

Modulo 2. Concetti base di CSS

  • 5. Selettori CSS. Gli studenti impareranno cosa sono i selettori e come impostare stili per elementi specifici.
  • 6. Il modello a blocchi di CSS. Elementi del modello a blocchi e inline, display e proprietà dei blocchi.
  • 7. Link e proprietà di sfondo. Etiquetta <a>, link interni ed esterni, configurazione dello sfondo.
  • 8. Posizionamento. Flusso del documento e posizioni degli elementi, proprietà position.

Risultato: Nel secondo modulo, gli studenti padroneggeranno temi fondamentali per ottenere un web design professionale.

3

Modulo 3. Prototipazione e basi di UX/UI

  • 9. Introduzione al design. Cos'è il design UX e UI, qual è la loro differenza?
  • 10. Analisi dei motori di ricerca. Studio dei motori di ricerca e del funzionamento di Internet.
  • 11. Mock-up del progetto finale: introduzione a Figma, basi della prototipazione.
  • 12. Flexbox. I ragazzi impareranno la proprietà più importante di CSS: i Flexbox.

Risultato: Gli studenti apprenderanno le basi del design di siti web e svilupperanno il design del loro futuro progetto.

4

Modulo 4. Design

  • 13. Design del sito web, lavoro con VSC. Conoscenza dell'editor e lavoro sul primo progetto.
  • 14. Completamento del progetto. Finalizzazione e completamento del progetto.
  • 15. Pubblicazione di un progetto. Cos'è GitHub e come pubblicare il tuo sito?
  • 16. Presentazione dei progetti. Riepilogo di quanto fatto nei quattro moduli.

Risultato: Gli studenti creeranno il loro primo sito web, lo pubblicheranno online e raccoglieranno feedback dagli utenti.

5

Modulo 5. CSS Avanzato

  • 17. Pseudo-classi e pseudo-elementi. Studio di pseudo-classi e pseudo-elementi importanti.
  • 18. Trasformazioni. Esplorazione delle trasformazioni, rendere il sito interattivo.
  • 19. Animazioni. La proprietà animation e come funzionano le animazioni in CSS.
  • 20. Modello a blocchi PRO. Differenza tra margin e padding, applicazione al progetto.

Risultato: Gli studenti padroneggeranno CSS avanzato e miglioreranno il loro progetto.

6

Modulo 6. Layout adattivo, grid e form

  • 21. Layout Grid. La seconda proprietà importante di CSS. Differenza con i flex.
  • 22. Variabili in CSS. La variabile root che cambierà molto il nostro sito!
  • 23. Design adattivo e responsive. Come rendere un sito adattabile?
  • 24. Interazione con le informazioni dell'utente. Form, come inviare informazioni al server.

Risultato: Gli studenti impareranno grid più comode, risolveranno casi reali e apprenderanno a fare adattamenti.

7

Modulo 7. Motori di siti e basi di PHP

  • 25. Server locale e introduzione a PHP. Apprendimento di PHP per il sito, interazione con HTML.
  • 26. Immersione in PHP. Apprendimento di cicli e array, come costruire il proprio sito PHP.
  • 27. WordPress. Motori di siti e WordPress, come creare un sito da blocchi PHP.
  • 28. Motore del sito ed estensione del progetto sul motore.

Risultato: Gli studenti apprenderanno hosting e PHP, e come trasferire il loro progetto sul server.

8

Modulo 8. Elaborazione del progetto finale

  • 29. Elaborazione del progetto finale.
  • 30. Perfezionamento del progetto, lavoro con form, codice pronto per verificare la correttezza dell'input.
  • 31. Perfezionamento del progetto, menu hamburger, carousel, chips JS. Completamento del progetto.
  • 32. Presentazione dei progetti.

Risultato: Per tutti i moduli, gli studenti lavoreranno al miglioramento del loro progetto, creando un buon prodotto finale.

Come funzionano le lezioni con Techland

1

Primo Incontro

Lo studente si connette alla piattaforma in accordo con le istruzioni fornite, fa conoscenza con l'insegnante e i compagni e le compagne di classe.

2

Approccio pratico

Ad ogni lezione, lo studente apprenderà un nuovo argomento, che consoliderà praticando, e poi facendo i suoi compiti per casa.

3

Creazione del Progetto

A metà corso, lo studente deciderà l'argomento per il suo progetto e inizierà a lavorare per esso.

4

Presentazione del Progetto

Lo studente pubblica il suo progetto online e lo presenta all'esame finale del corso.

Prenota una lezione di prova gratuita!

Inizia il tuo viaggio nel mondo del coding con Web Development. Compila il form e ti contatteremo entro 24 ore.