Andrea Possidente
iten

Full Stack Web Developer — Italy

Andrea Possidente

Portrait of Andrea Possidente

I build interfaces and web applications: today in React and TypeScript, in a team, on a complex digital product; before that, e-commerce stores I built and ran from scratch, and in my spare time projects of my own, from idea to production. I have a full stack background and care most about reusable components, testing and interfaces that stay simple to use.

Currently
Frontend Developer @ Microgame
On the web since
2018
Languages
Italian, fluent English

01Projects

What I’m building.

Projects of my own, from idea to production.

The portfolio hero: the name Andrea Possidente crossed by coloured beams of light, with the portrait on the right.

012026

Portfolio

Personal website

The site you’re looking at: a SvelteKit portfolio and blog, with a purpose-built CMS and beams of light in Three.js that give depth to scrolling.

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

01Personal website — 2026

Portfolio

The site you’re looking at: a SvelteKit portfolio and blog, with a purpose-built CMS and beams of light in Three.js that give depth to scrolling.

The portfolio hero: the name Andrea Possidente crossed by coloured beams of light, with the portrait on the right.
Role
Design and development
Year
2026
Stack
  • SvelteKit
  • TypeScript
  • Three.js
  • GLSL
  • Sass
  • Vite
  • Node.js
  • PostgreSQL
  • Prisma
  • Better Auth
  • Zod
  • Docker
  • Playwright

The idea

A redesign of my personal site with an editorial, restrained feel: light typography, a single accent colour and plenty of space. No calls to action: the site shows what I do, and the contact details wait at the bottom for whoever is looking for them.

Depth with Three.js

Behind the content there are volumetric beams of light at different depths, with streaks and a flicker like sunlight through leaves, and dust that takes on the colour of the beam it drifts through. As you scroll, the camera orbits the beams while descending, the focus shifts and each section brings its own beams forward: warm, cool or ivory. Out-of-focus motes turn into bokeh. The scene starts only once the browser is idle and a real GPU is available, caps the pixel ratio and settles on a still frame when reduced motion is on.

Architecture

SvelteKit with Svelte 5 and TypeScript on Node, in Italian and English with dedicated URLs linked by hreflang. Content lives in PostgreSQL through Prisma; article Markdown becomes HTML on save, code highlighting included, so pages only read ready-made HTML. A scheduled article goes out on its own at the chosen time: visibility is decided on every read, with no scheduled jobs.

A purpose-built CMS

The whole site is managed from an admin area written from scratch. The article editor has a side-by-side live preview, an SEO panel that shows the Google result and flags long titles or images without alt text, version history and a private preview link to share a draft. Uploaded images are resized and converted to AVIF and WebP, without metadata such as GPS location. Deleted items stay in a trash for 30 days, Ctrl+K searches everywhere and comments can be moderated from the keyboard, with push notifications sent by the server itself.

Performance

Pages are rendered by the server in a few milliseconds and travel compressed, with their styles already in the HTML. The technology logos are a single cached SVG sprite instead of hundreds of paths repeated on every page: the home page HTML, styles included, went from over 170 to about 35 KB. The portrait and uploaded images come in AVIF and WebP at every size, and the production image holds only the files the server actually uses.

Security and privacy

Sign-in with two-factor verification, a lock after failed attempts and a list of signed-in devices. A Content Security Policy with a per-request nonce and no third-party resources. Visitors get no cookies, so no banner is needed; comments use anti-spam without external CAPTCHAs and keep only a hash of the IP address, deleted after 30 days. A test tries every route of the restricted area without signing in, future ones included.

Quality and delivery

Oxlint, Prettier and svelte-check with warnings as errors. More than seventy Playwright end-to-end tests: five viewports, keyboard, both languages, reduced motion, the no-JavaScript page and automated accessibility checks on every page, public and restricted. In CI the same tests also run against the production Docker image; deployment to the VPS is automatic, with nightly backups of the database and images.

The Calci8 logo next to three phones showing the Matches, Teams and Ranking screens.

022025

Calci8

Progressive web app (PWA)

The app for organising five-a-side football with friends: attendance, balanced teams, lineups, results, rankings, chat and party games, on www.calci8.it and the 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

02Progressive web app (PWA) — 2025

Calci8

The app for organising five-a-side football with friends: attendance, balanced teams, lineups, results, rankings, chat and party games, on www.calci8.it and the Play Store.

The Calci8 logo next to three phones showing the Matches, Teams and Ranking screens.
Role
Concept, design and development
Year
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

The idea

Organising the Thursday match among friends means chasing who is in, making fair teams, deciding who brings the ball and remembering who scored. Calci8 puts everything in one phone-first app: each group has its own matches, squad, chat and ranking, and everyone always knows what they have to do. It is live on www.calci8.it and on the Play Store.

A match in phases

Every match goes through nine phases, from sign-ups to the official result: teams, captains, lineups, recap, kick-off and ratings. A phase opens only once the previous one is complete; some are skipped according to the group’s rules, and the scheduler does the rest on its own: reminders, closing sign-ups, the captain vote, the last call for ratings. Teams are balanced by an algorithm on the players’ attributes, attendance handles the waiting list and substitutions, and a result proposed by one captain becomes official only when the other confirms it.

The social side

Group and private chats with stickers, including personal ones cut out from a photo right in the browser by a neural network. Achievements that unlock collectible rewards (animated avatar frames, FIFA-style cards also in 3D with Three.js, kits and titles), predictions, MVPs and rankings without ties, with the tiebreakers explained under each table. And party games: a live quiz, a drawing game and Mister8, a deduction game with phone-to-phone WebRTC voice chat.

Architecture

SolidJS with Vite and SCSS modules on the web; Fastify, Better Auth and Prisma on PostgreSQL on the server, all in TypeScript. The rules both sides must agree on (phases, formats, scoring, achievements) live in a shared module. Updates arrive in real time over Server-Sent Events, so open apps reload only what changed, and attendance changes are serialised per match to avoid double promotions from the waiting list.

Native on the phone

An installable PWA that opens offline thanks to its service worker, with push notifications and an Android app published on the Play Store as a Trusted Web Activity. One design with native details per platform: page transitions, the edge swipe back on iPhone, ripples on Android, haptics, light and dark themes, and every 3D effect with a flat fallback for reduced motion.

Security and privacy

Sign-in with passkeys, Google or an email code, two-factor verification and per-group permissions with different roles. Platform admins cannot see chats, stats or ratings. There is a record of processing with a data breach procedure, and accounts unused for two years are warned and then deleted. Admins can also work through an AI assistant, with an MCP server protected by OAuth 2.1.

Quality and delivery

Oxlint with warnings as errors, a check that allows only theme tokens in the styles, hundreds of domain and API tests run against a database schema created from scratch, and Playwright end-to-end tests on a phone viewport, including several players at once. Every release has its changelog section, read by players in the app; CI also checks the production Docker image and deployment is automatic. Development is done with Claude Code, with project hooks and skills for releases and new achievements.

02Skills

From the interface to the data.

Tools change; curiosity stays.

13 tools

Frontend

Polished interfaces, from the first component to the last detail.

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

12 tools

Backend

The logic and data that make an experience work.

12 tools

Workflow

Collaboration, testing and tools to build better.

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

03Journey

From e-commerce to web apps.

I like turning complex problems into experiences that are simple to use.

I believe in open discussion, teamwork and learning by doing. Every project is a chance to add a new piece to the journey.

  • Employment3
  • Consulting1
  • Training1
  1. Employment

    May 2026 — present

    Frontend Developer

    Microgame

    I joined the in-house team after almost three years consulting on the same product: new features, evolving the frontend architecture and standardising the code of a web platform built with React and TypeScript.

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

    Jul 2023 — May 2026

    Frontend Developer

    ALTEN Italia

    Frontend consulting for Microgame S.p.A.: new features and bug fixes on React applications, evolving the frontend architecture and standardising the code for quality and maintainability.

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

    Nov 2022 — May 2023

    Full Stack Web Developer Student

    Develhope

    Intensive full stack programme focused on React, TypeScript, Node.js, Express and PostgreSQL, with collaborative team projects run with Agile and Scrum. Selected as a tutor to support new students.

    • TypeScript
    • React
    • Node.js
    • Express
    • PostgreSQL
    View certificate
  4. Employment

    Jun 2021 — Sep 2022

    Web Developer

    Opus Group

    End-to-end development and management of the company’s WordPress and WooCommerce store: theme customisation, custom features, performance tuning, technical SEO and Google Ads campaigns tracked with Analytics. The work contributed to significant growth in sales and revenue.

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

    Jul 2018 — Aug 2020

    Web Developer

    Telaro

    Enoteca Telaro’s PrestaShop store, with custom design and advanced features, plus internal tools that automatically keep warehouse, distribution, shop till and online store in sync. SEO/SEM and product catalogue optimisation.

    • PrestaShop
    • PHP
    • MySQL

Education and certifications