Configurare il progetto
Inizializzare il progetto e installare Socket.io con Claude Code
⏱ Stima ~8 min
01 · Leggi
È ora di costruire. Iniziamo come ogni progetto Node.js: creare la cartella, inizializzare npm, installare le dipendenze. L'hai già fatto al Livello 7.
La novità è Socket.io — una libreria che semplifica l'uso di WebSocket. Gestisce l'upgrade della connessione, la riconnessione e la serializzazione dei messaggi, così puoi concentrarti sulla logica di gioco invece che sul networking di basso livello.
Userai anche Express per servire il file HTML del gioco. Express e Socket.io lavorano insieme: Express serve le pagine, Socket.io gestisce la comunicazione in tempo reale.
Punti chiave
- Socket.io è una libreria che semplifica la comunicazione WebSocket
- Express serve i file HTML/CSS/JS al browser
- Socket.io gestisce gli eventi in tempo reale tra client e server
- Entrambi girano sullo stesso server — Express per i file, Socket.io per gli eventi
02 · Pratica reale
Crea la cartella del progetto e installa le dipendenze. Esegui questi comandi nel terminale.
03 · Modello di prompt
Chiedi a Claude Code di costruire il server. Dagli una descrizione precisa di quello che vuoi — non solo "fai un server", ma esattamente cosa deve fare.
Aiutami a creare un file server.js che funga da server per un gioco di tic-tac-toe. Usa Express per servire i file statici dalla cartella public/ e integra Socket.io per la comunicazione in tempo reale. Quando un client si connette, stampa 'Player connected' con il socket ID; quando si disconnette, stampa 'Player disconnected' con il socket ID. Ascolta sulla variabile d'ambiente PORT, con fallback alla porta 3000.
04 · Esempio di codice
Dopo che Claude ha generato server.js, cerca questo pattern fondamentale. Socket.io non può collegarsi direttamente all'app Express — ha bisogno dell'oggetto HTTP server grezzo.
Pattern di integrazione Express + Socket.io
const express = require('express');
const { createServer } = require('http');
const { Server } = require('socket.io');
const app = express();
const httpServer = createServer(app);
const io = new Server(httpServer);
app.use(express.static('public'));
io.on('connection', (socket) => {
console.log('Player connected:', socket.id);
socket.on('disconnect', () => {
console.log('Player disconnected:', socket.id);
});
});
httpServer.listen(process.env.PORT || 3000);
Nota i tre livelli: Express (app) gestisce le richieste HTTP e serve i file. HTTP server (httpServer) avvolge Express. Socket.io (io) avvolge l'HTTP server e intercetta le richieste di upgrade WebSocket. Per questo Socket.io ha bisogno dell'HTTP server grezzo — deve catturare l'header 'Upgrade: websocket' prima che Express lo veda.
05 · Pratica reale
Crea una pagina di test minima per verificare che la connessione funzioni.
06 · Completa
Socket.io ha bisogno dell'oggetto HTTP _____ grezzo, non solo dell'app Express, perché deve gestire l'handshake di upgrade WebSocket.
07 · Quiz
Cosa aggiunge al tuo progetto npm install express socket.io?
- Due linguaggi di programmazione per costruire il gioco
- Un database e un livello di cache
- Un framework frontend e una libreria CSS
- Un web framework (Express) e una libreria per la comunicazione in tempo reale (Socket.io)
Altre lezioni di questo capitolo
⚠ L'esperienza interattiva completa richiede JavaScript. Attivalo e ricarica la pagina.
※ Questo è un progetto educativo indipendente — non è un prodotto ufficiale di Anthropic. Claude™ è un marchio di Anthropic, PBC.