Catch the star

Argomenti principali:
- Storia di Internet
- Internet Domain e IP Address
- Cosa è un web server e perchè serve per fare un sito web
- Plesk o cPanel?
- Sviluppare con GIT
- Editor di testo
- Progetto Web: Catch the star
- WebToNative.org e installazione su Android
Lesson One
La Storia di Internet e i Concetti Chiave

Parte 1: La Storia di Internet Parte 2: Concetti Chiave di Internet

1. Le Origini: 1. Infrastruttura di Internet:

o ARPANET: gli anni '60 e il a. Router e Switch.
Dipartimento della Difesa degli Stati b. ISP (Internet Service Provider).
Uniti. c. Protocolli di Comunicazione
o Packet Switching: la tecnologia che i. TCP/IP e indirizzi ipv4 e 6.
ha reso possibile la trasmissione ii. HTTP/HTTPS: i protocolli HTTP e
efficiente dei dati. HTTPS, essenziali per il web.
2. Domini e DNS
2. Gli Anni '70 e '80: a. Domain Name System: il concetto di
o TCP/IP: il protocollo dagli anni '70. DNS e il suo ruolo nella traduzione
o Crescita e Sviluppo: L'espansione di dei nomi di dominio in indirizzi IP.
ARPANET in NSFNET, le reti
accademiche. Attività Pratica
Timeline di Internet:
3. Gli Anni '90: il Web: Crea una timeline visiva che mostri i
o Tim Berners-Lee e il WWW: la principali eventi nella storia di Internet.
creazione del World Wide Web nel
1989. Ricerca e Presentazione:
o Nascita dei Browser: Mosaic, Scegliere un evento importante nella
Netscape, Opera e Internet Explorer storia di Internet, fare una breve ricerca
e presentarla.
4. L'Evoluzione Recente:
o Web 2.0 e i social media. Esperienza di Navigazione Storica:
o Mobile Internet: la nascita delle app. Wayback Machine e come apparivano i
siti web nei primi anni di Internet.

Materiali:
Video su YouTube sulla storia di Internet,
articoli e risorse online, Wayback Machine,
strumenti di creazione grafica come LucidChart
o Draw.io.
Lesson two
Web Servers e Domini

Parte 1: come funziona il web Parte 2: creare nel web

1. Web Server: 1. Plesk/cPanel:

o Cosa è. o Cos'è Plesk/cPanel e perché è utile.
o Risposte a richieste di pagine o Panoramica dell'interfaccia.
web.
2. Configurazione di Base:
2. Concetto di Hosting o Come creare un account di hosting.
o Come caricare file su un server.
3. Domini:
o Cosa è un dominio? 3. Attività Pratica:
o Come funziona il DNS? o Configurare un semplice sito web.
o Caricare una pagina HTML di esempio.
4. Attività Pratica:
o whois per cercare informazioni Materiali: Accesso a un account Plesk o cPanel,
esempio di pagina HTML.
Materiali: Diagrammi di rete, visite virtuali a data
center.
Lesson three
Il codice e gitHub

Parte 1: creare nel web Parte 2: dove salvo il mio codice?

1. I diversi tipi di codice: 1. Cos'è Git:

o Client Side. o Introduzione a Git e al controllo di
o Server Side. versione.
o Perché è importante per i progetti di
2. I diversi linguaggi sviluppo.

3. Perchè è importante imparare un 2. Git Basics:

linguaggio o Comandi di base: git init, git add, git
commit, git push.
4. Perchè non è importante imparare tanti o Introduzione a GitHub.
linguaggi
3. Attività Pratica:
5. Attività Pratica: o Installare Git sul computer.
o chatGPT e la sua capacità di o Creare un repository locale e fare i
programmare per te primi commit sul remoto.

Materiali: chatGPT, editor di testo, Materiali: Documentazione ufficiale di Git,

riconoscimento automatico del codice, storia e account GitHub.
quando il codice era solo codice.
Lesson four
Catching the stars!

Parte 1: creare nel web Parte 2: Catch the star

1. Scelta dell'Editor: 1. Progetto Web:

o Visual Studio Code o Sublime Text. o Panoramica del progetto "Catch the
o Perché è importante avere un buon Star".
editor. o Scelta del nome

2. Installazione e Configurazione: 2. Sviluppo:

o Installazione dell’editor. o Scrivere il codice HTML, CSS e
o Configurare le estensioni di base. JavaScript per il gioco.
o Testare il programma in locale.
3. Composizione di una pagina web:
o Creare un semplice file HTML 3. Attività Pratica:
o Aggiungere un CSS o Sviluppare il programma insieme,
o Cosa è un JavaScript? passo dopo passo.
o Salvare tutto sul repository GIT. o Utilizzare Git per il controllo di
versione.
Materiali: Guida all'installazione di Visual Studio o Impostare l’hosting
Code, tutorial video.
Materiali: Codice di esempio, accesso a risorse
online per il debugging.
Lesson five
We are going on-line!

Parte 1: pubblicare Parte 2: Trasformare il progetto in un app

mobile
1. Caricamento sull’hosting:
o Utilizzare Plesk/cPanel per caricare i 1. WebToNative.Org:
file del progetto sull’hosting nel nome a o Perchè usare un servizio del genere.
dominio scelto in base al nome del o Differenza tra un app mobile nativa e
progetto stesso. una non nativa.
o Testare il sito online.
2. Come installare le app:
2. Trasformazione in App Mobile: cosa o Cosa è un APK.
significa o Accenni agli store:
o Differenze sostanziali tra i dispositivi 1. Appstore connect di Apple.
mobile e quelli non mobile. 2. Playstore di Google.

3. Attività Pratica: 3. Attività Pratica:

o Caricare i file e configurare il sito. o Scaricare l’APK e installarlo.
o Test su più dispositivi.
Materiali: Accesso all’hosting, dispositivi Android
per i confronti. Materiali: accesso a risorse online per il
debugging.