Andrea Possidente
iten

Full Stack Web Developer — Italia

Andrea Possidente

Ritratto di Andrea Possidente

Sviluppo interfacce e applicazioni web: oggi in React e TypeScript, in team, su un prodotto digitale complesso; prima e-commerce costruiti e gestiti da zero, e nel tempo libero progetti miei, dall’idea alla produzione. Ho una base full stack e mi interessano soprattutto componenti riutilizzabili, test e interfacce che restano semplici da usare.

Attualmente
Frontend Developer @ Microgame
Sul web dal
2018
Lingue
Italiano, inglese fluente

01Progetti

I miei progetti.

Dall’idea alla produzione.

Hero del portfolio: il nome Andrea Possidente attraversato da fasci di luce colorati, con il ritratto sulla destra.

012026

Portfolio

Sito personale

Il sito che stai guardando: portfolio e blog in SvelteKit, con un CMS costruito su misura e fasci di luce in Three.js che danno profondità allo scroll.

  • SvelteKit
  • TypeScript
  • Three.js
  • GLSL
  • Sass
  • Vite
  • Node.js
  • PostgreSQL
  • Prisma
  • Better Auth
  • Zod
  • Docker
  • Playwright

01Sito personale — 2026

Portfolio

Il sito che stai guardando: portfolio e blog in SvelteKit, con un CMS costruito su misura e fasci di luce in Three.js che danno profondità allo scroll.

Hero del portfolio: il nome Andrea Possidente attraversato da fasci di luce colorati, con il ritratto sulla destra.
Ruolo
Design e sviluppo
Anno
2026
Stack
  • SvelteKit
  • TypeScript
  • Three.js
  • GLSL
  • Sass
  • Vite
  • Node.js
  • PostgreSQL
  • Prisma
  • Better Auth
  • Zod
  • Docker
  • Playwright

L’idea

Un redesign del mio sito personale con un’impronta editoriale e sobria: tipografia leggera, un solo colore d’accento e molto spazio. Nessuna call to action: il sito racconta cosa faccio, e i recapiti restano in fondo per chi li cerca.

Profondità con Three.js

Dietro al contenuto ci sono fasci di luce volumetrici a profondità diverse, con striature e tremolii come luce filtrata dagli alberi, e un pulviscolo che si accende del colore del fascio che attraversa. Scorrendo la pagina la camera ruota attorno ai fasci scendendo di quota, la messa a fuoco si sposta e ogni sezione porta in primo piano i propri fasci: caldi, freddi o avorio. Le particelle fuori fuoco diventano bokeh. La scena parte solo quando il browser è libero e c’è una GPU vera, limita il pixel ratio e si ferma su un fotogramma statico quando è attivo il movimento ridotto.

Architettura

SvelteKit con Svelte 5 e TypeScript su Node, in italiano e in inglese con URL dedicati e collegati con hreflang. I contenuti stanno in PostgreSQL e passano da Prisma; il Markdown degli articoli diventa HTML al salvataggio, con l’evidenziazione del codice, così le pagine leggono solo HTML pronto. Un articolo programmato esce da solo alla data scelta: la visibilità si decide a ogni lettura, senza processi pianificati.

Un CMS su misura

Tutto il sito si gestisce da un’area di amministrazione scritta da zero. L’editor degli articoli ha l’anteprima dal vivo affiancata, un pannello SEO che mostra il risultato su Google e segnala titoli troppo lunghi o immagini senza testo alternativo, la cronologia delle versioni e un link di anteprima privato per far leggere una bozza. Le immagini caricate vengono ridimensionate e convertite in AVIF e WebP, senza metadati come la posizione GPS. Ciò che si elimina resta in un cestino per 30 giorni, Ctrl+K cerca ovunque e i commenti si moderano anche da tastiera, con notifiche push inviate dal server stesso.

Prestazioni

Le pagine sono rese dal server in pochi millisecondi e arrivano compresse, con gli stili già nell’HTML. I loghi delle tecnologie sono un unico sprite SVG in cache, invece di centinaia di tracciati ripetuti in ogni pagina: l’HTML della home, stili compresi, è passato da oltre 170 a circa 35 KB. Il ritratto e le immagini caricate hanno varianti AVIF e WebP per ogni dimensione, e l’immagine di produzione contiene solo i file che il server usa davvero.

Sicurezza e privacy

Accesso con verifica in due passaggi, blocco dopo i tentativi falliti ed elenco dei dispositivi collegati. Content Security Policy con nonce per ogni richiesta e nessuna risorsa di terze parti. Chi visita il sito non riceve cookie, quindi non serve alcun banner; i commenti hanno un anti-spam senza CAPTCHA esterni e conservano solo un hash dell’indirizzo IP, cancellato dopo 30 giorni. Un test prova ogni rotta dell’area riservata senza accesso, comprese quelle aggiunte in futuro.

Qualità e rilascio

Oxlint, Prettier e svelte-check con warning bloccanti. Oltre settanta test end-to-end con Playwright: cinque viewport, tastiera, entrambe le lingue, movimento ridotto, pagina senza JavaScript e controlli automatici di accessibilità su ogni pagina, pubblica e riservata. In CI gli stessi test girano anche sull’immagine Docker di produzione; il rilascio sul VPS è automatico, con backup notturni di database e immagini.

Il logo di Calci8 accanto a tre telefoni con le schermate Partite, Squadre e Classifica.

022025

Calci8

App web progressiva (PWA)

L’app per organizzare il calcetto con gli amici: presenze, squadre equilibrate, formazioni, risultati, classifiche, chat e giochi di gruppo, su www.calci8.it e sul Play Store.

  • Android
  • Better Auth
  • Claude Code
  • Docker
  • Fastify
  • Node.js
  • ONNX Runtime
  • Oxlint
  • Playwright
  • PostgreSQL
  • Prisma
  • PWA
  • Sass
  • SolidJS
  • Three.js
  • TypeScript
  • Vite
  • WebRTC
  • Zod

02App web progressiva (PWA) — 2025

Calci8

L’app per organizzare il calcetto con gli amici: presenze, squadre equilibrate, formazioni, risultati, classifiche, chat e giochi di gruppo, su www.calci8.it e sul Play Store.

Il logo di Calci8 accanto a tre telefoni con le schermate Partite, Squadre e Classifica.
Ruolo
Ideazione, design e sviluppo
Anno
2025
Stack
  • Android
  • Better Auth
  • Claude Code
  • Docker
  • Fastify
  • Node.js
  • ONNX Runtime
  • Oxlint
  • Playwright
  • PostgreSQL
  • Prisma
  • PWA
  • Sass
  • SolidJS
  • Three.js
  • TypeScript
  • Vite
  • WebRTC
  • Zod

L’idea

Organizzare la partita del giovedì tra amici vuol dire inseguire chi c’è, fare squadre giuste, decidere chi porta il pallone e ricordarsi chi ha segnato. Calci8 mette tutto in un’unica app pensata per il telefono: ogni gruppo ha le sue partite, la sua rosa, la sua chat e la sua classifica, e ognuno sa sempre cosa deve fare. È online su www.calci8.it e sul Play Store.

Una partita in fasi

Ogni partita attraversa nove fasi, dalle iscrizioni al risultato ufficiale: squadre, capitani, formazioni, riepilogo, partita e voti. Una fase si apre solo quando la precedente è completa; alcune si saltano secondo le regole del gruppo, e il calendario fa il resto da solo: promemoria, chiusura delle iscrizioni, voto dei capitani, ultimo richiamo per le pagelle. Le squadre si bilanciano con un algoritmo sulle caratteristiche dei giocatori, le presenze gestiscono la lista d’attesa e le sostituzioni, e i risultati proposti da un capitano diventano ufficiali solo quando l’altro li conferma.

Il lato social

Chat di gruppo e private con sticker, anche personali, ritagliati dalla foto direttamente nel browser con una rete neurale. Traguardi che sbloccano premi da collezionare (cornici animate per l’avatar, carte stile FIFA anche in 3D con Three.js, maglie e titoli), pronostici, MVP e classifiche senza pari merito con gli spareggi spiegati sotto ogni tabella. E i giochi di gruppo: un quiz in diretta, un gioco di disegno e Mister8, un gioco di deduzione con chat vocale WebRTC da telefono a telefono.

Architettura

SolidJS con Vite e SCSS modules sul web; Fastify, Better Auth e Prisma su PostgreSQL sul server, tutto in TypeScript. Le regole che entrambi devono rispettare (fasi, formati, punteggi, traguardi) stanno in un modulo condiviso. Gli aggiornamenti arrivano in tempo reale con Server-Sent Events, così le app aperte ricaricano solo quello che è cambiato, e le operazioni sulle presenze sono serializzate per partita per evitare doppie promozioni dalla lista d’attesa.

Nativa sul telefono

È una PWA installabile che si apre anche offline grazie al service worker, con notifiche push e un’app Android pubblicata sul Play Store come Trusted Web Activity. Un solo design, con dettagli nativi per piattaforma: transizioni tra pagine, gesto indietro dal bordo su iPhone, ripple su Android, vibrazioni, tema chiaro e scuro e tutti gli effetti 3D con un’alternativa piatta per chi riduce le animazioni.

Sicurezza e privacy

Accesso con passkey, Google o codice via email, verifica in due passaggi e autorizzazioni per gruppo con ruoli diversi. Gli amministratori della piattaforma non vedono chat, statistiche né pagelle. C’è un registro dei trattamenti con la procedura in caso di violazione dei dati, e gli account inutilizzati per due anni vengono avvisati e poi cancellati. Gli admin possono lavorare anche tramite un assistente AI, con un server MCP protetto da OAuth 2.1.

Qualità e rilascio

Oxlint con warning bloccanti, un controllo che ammette negli stili solo i token del tema, centinaia di test sul dominio e sulle API eseguiti su uno schema del database creato da zero, e test end-to-end con Playwright su telefono che coprono anche più giocatori contemporaneamente. Ogni versione ha la sua sezione nel changelog, letta dai giocatori nell’app; la CI verifica anche l’immagine Docker di produzione e il deploy è automatico. Lo sviluppo è fatto con Claude Code, con hook e skill di progetto per i rilasci e i nuovi traguardi.

02Competenze

Dall’interfaccia ai dati.

Gli strumenti cambiano, la curiosità resta.

13 strumenti

Frontend

Interfacce curate, dal primo componente all’ultimo dettaglio.

  • React
  • Next.js
  • TypeScript
  • JavaScript
  • HTML & CSS
  • Sass
  • Tailwind CSS
  • Redux
  • Zustand
  • TanStack Query
  • React Hook Form
  • Zod
  • Storybook

12 strumenti

Backend

La logica e i dati che fanno funzionare un’esperienza.

12 strumenti

Workflow

Collaborazione, test e strumenti per costruire meglio.

  • Git
  • GitHub
  • Figma
  • Jest
  • Vite
  • Vitest
  • Cypress
  • ESLint
  • Docker
  • Postman
  • Claude Code
  • Agile / Scrum

03Percorso

Le mie esperienze

Mi piace trasformare problemi complessi in esperienze semplici da usare.

Credo nel confronto, nel lavoro di squadra e nell’imparare facendo. Ogni progetto è un’occasione per aggiungere un nuovo pezzo al percorso.

  • Lavoro3
  • Consulenza1
  • Formazione1
  1. Lavoro

    Mag 2026 — in corso

    Frontend Developer

    Microgame

    Sono entrato nel team interno dopo quasi tre anni di consulenza sullo stesso prodotto: nuove funzionalità, evoluzione dell’architettura frontend e standardizzazione del codice di una piattaforma web in React e TypeScript.

    • React
    • TypeScript
    • Zustand
    • TanStack Query
    • Sass
    • Vite
    • Vitest
    • ESLint
    • REST API
  2. Consulenza

    Lug 2023 — Mag 2026

    Frontend Developer

    ALTEN Italia

    Consulenza frontend per Microgame S.p.A.: sviluppo di nuove funzionalità e risoluzione di bug su applicazioni React, evoluzione dell’architettura frontend e standardizzazione del codice per qualità e manutenibilità.

    • React
    • TypeScript
    • Zustand
    • TanStack Query
    • Sass
    • Vite
    • Jest
    • Vitest
    • ESLint
    • REST API
  3. Formazione

    Nov 2022 — Mag 2023

    Studente Full Stack Web Developer

    Develhope

    Corso intensivo full stack con focus su React, TypeScript, Node.js, Express e PostgreSQL, con progetti collaborativi in team secondo le metodologie Agile e Scrum. Selezionato come tutor per assistere i nuovi studenti.

    • TypeScript
    • React
    • Node.js
    • Express
    • PostgreSQL
    Vedi certificato
  4. Lavoro

    Giu 2021 — Set 2022

    Web Developer

    Opus Group

    Sviluppo e gestione completa dell’e-commerce aziendale su WordPress e WooCommerce: personalizzazione del tema, funzionalità su misura, ottimizzazione delle prestazioni, SEO tecnica e campagne Google Ads monitorate con Analytics. Un lavoro che ha contribuito a una crescita importante di vendite e fatturato.

    • WordPress
    • WooCommerce
    • PHP
    • MySQL
    • Google Analytics
  5. Lavoro

    Lug 2018 — Ago 2020

    Web Developer

    Telaro

    E-commerce di Enoteca Telaro su PrestaShop, con grafica e funzionalità avanzate su misura, e applicativi interni che sincronizzano automaticamente magazzino, distribuzione, punto vendita ed e-commerce. Gestione SEO/SEM e ottimizzazione del catalogo prodotti.

    • PrestaShop
    • PHP
    • MySQL

Istruzione e certificazioni