Mattia Dapino

Software engineer, dal browser al server. Vue, React, TypeScript, linux, hosting e automazione.

Competenze

Frontend
TypeScript, JavaScript, Vue (Nuxt, Vuex), React (Redux), D3, HTML e CSS, Bootstrap, mockup in Adobe XD
Accessibilità
WCAG 2.1 e linee guida AgID, verifiche con WAVE, Lighthouse e VoiceOver
Test e qualità
Jest, Vitest, Testing Library, test-driven development, Semantic Versioning, Conventional Commits
Backend e integrazione
Java (Spring Boot), Node.js, C#, PostgreSQL, API REST, OAuth2 (Keycloak), Elasticsearch
Cloud e DevOps
Docker, AWS (EC2, RDS, CodePipeline), GitHub Actions, GitLab CI/CD, Git, Linux, Nginx

Progetti

Cyber Range, Visual Awareness

React, D3, Elasticsearch

Video di presentazione pubblica del Cyber Range; Visual Awareness compare a metà video.

Il Cyber Range di Leonardo è una piattaforma per addestrare team di cyber difesa su un gemello digitale dell'infrastruttura reale. Visual Awareness è il portale con cui chi supervisiona l'esercizio ne segue l'andamento dal vivo, tra reti, nodi e servizi.

Il mio ruolo. L'ho sviluppato da solo in ManyDesigns, dall'interfaccia al collegamento con i dati.

  • D3 per il grafo. La rete non è nota in anticipo, quindi il grafo si costruisce a runtime dai dati.
  • Elasticsearch come sorgente. La SPA legge gli eventi dell'attacco direttamente, senza un livello intermedio dedicato.
  • React per lo stato. L'avanzamento dell'attacco aggiorna il grafo senza ricaricare la pagina.

Presentazione pubblica del Cyber Range

zetto

Vue, TypeScript, npm

La tabella generata da zetto nel progetto demo della tesi, verificata con WAVE.

Libreria Vue che genera tabelle con ricerca, ordinamento e paginazione, schede di dettaglio e form validati a partire dalle entità esposte dalle API. È il tema della mia tesi ed è stata adottata in più progetti aziendali, tra cui il backoffice delle cedole librarie del Comune di Genova.

Il mio ruolo. Progettazione e sviluppo.

  • UI derivata dalle entità. Non si riscrive la stessa interfaccia per ogni entità e frontend e backend restano allineati.
  • Accessibilità by design. Sta nei componenti, quindi ogni progetto che li usa la eredita.
  • Verifica con strumenti e persone. WAVE senza errori WCAG 2.1, Lighthouse e prove con screen reader VoiceOver.

Codice su GitHub · Tesi (PDF)

Menivo

Nuxt, TypeScript

Il pannello di gestione, con dati di prova.

Menu digitale per ristoranti: un QR per ogni tavolo apre la carta nel browser, senza app né registrazione. Il gestore aggiorna piatti e disponibilità da un pannello online, e il menu si legge in più lingue con traduzione automatica correggibile.

Il mio ruolo. Progettazione e sviluppo, fuori dal lavoro, con agenti di coding e test-driven development.

  • Nessuna app per l'ospite. Il QR apre una pagina web, raggiungibile da qualunque telefono.
  • Allergeni e piatti terminati. Sono dati del piatto, non testo libero: restano precisi anche nelle traduzioni.

Vai a Menivo

Altri lavori

portofino-js

Libreria TypeScript per far dialogare i frontend con Portofino, il framework backend open source di ManyDesigns. Test Jest e rilascio automatico su npm.

Esperienza

Marzo 2022 - oggi

Implementation Consultant (MES), Siemens Industry Software

Consulenza e sviluppo su Opcenter Execution Electronics negli stabilimenti Leonardo di Nerviano, Latina e Fusaro.

  • Interfacce operatore in Vue e C#, ed estensione dei componenti del prodotto con JavaScript sulle pagine legacy quando il requisito andava oltre le funzionalità previste.
  • Un'architettura con Nginx e servizi a coda che rispetta il divieto di connessioni HTTPS dalla rete IT alla OT, su problemi di cybersecurity che l'R&D aveva dichiarato non risolvibili.
  • Driver Java e Spring per le macchine di linea e integrazioni tra SAP, Teamcenter e MES, con documentazione e coordinamento con il cliente, per lo più in inglese.
Settembre 2019 - Marzo 2022

Software Developer, ManyDesigns

Web app in Vue e React erogate come SaaS e on premise, in una software house certificata ISO 9001 e ISO 27001.

  • Moduli e librerie descritti nei progetti qui sopra, più MDHR, SaaS multi-tenant in Vue su Portofino di cui ho gestito il progetto.
  • Mockup in Adobe XD per allineare sviluppatori e clienti prima dello sviluppo, e adozione di Vue in azienda.
  • Containerizzazione di decine di applicazioni, migrazione da bare metal ad AWS e CI/CD con GitHub Actions e CodePipeline.
Marzo 2016

Stage, C.P. Service S.r.l.

Stage formativo di due settimane (14-25 marzo 2016), a contatto con la gestione di personale, offerte e commesse.

  • Progettato e sviluppato un gestionale web aziendale, destinato a sostituire il sistema in uso. L'azienda ha rilasciato una lettera di presentazione che ne riconosce impegno, capacità inventiva e problem solving.

Lettera di presentazione (PDF)

Formazione

Laurea triennale in Informatica

Università di Genova, DIBRIS, 2021. Tesi: «Accessibility by design, una libreria per lo sviluppo web accessibile».

Diploma tecnico informatico

I.T.I.S. Majorana-Giorgi, 2017.

Lingue

Italiano madrelingua. Inglese C1, uso quotidiano al lavoro, con certificazione Cambridge PET (B1, 2017).