FabioBiondi.
← tutti i corsi
// corso · 2026angularNEW

Creare e pubblicare una libreria Angular

Crea una libreria di componenti Angular riutilizzabile, pubblicala su NPM e condividila tra tutti i tuoi progetti.

Durata
4h
Livello
Intermedio
[ descrizione ]

Di cosa parla
questo corso.

Contesto, obiettivi e taglio del corso. Tutto è personalizzabile in base a stack e team — questa è la base di partenza.

§01

INTRODUZIONE

Ogni sviluppatore Angular prima o poi si ritrova a copiare gli stessi componenti, Card, Button, Modal e così via, da un progetto all'altro, con inevitabili divergenze e duplicazioni. La soluzione corretta è estrarre quei componenti in una libreria riutilizzabile, pubblicarla una volta sola e consumarla ovunque, esattamente come le librerie che installiamo ogni giorno da NPM.

Grazie all'Angular CLI e a ng-packagr, creare e distribuire una libreria è diventato molto più semplice. La parte meno ovvia, però, è tutto ciò che ruota attorno al passo di pubblicazione: come testare la libreria in locale senza inquinare NPM con versioni usa e getta, come documentarla in modo professionale e come fornire uno showcase visuale navigabile da altri sviluppatori e designer.

Questa masterclass copre l'intero ciclo di vita di una libreria Angular: da un workspace vuoto fino a un pacchetto documentato e pubblicato su NPM.
§02

OBIETTIVO DEL CORSO

Al termine del corso saprai configurare un workspace Angular dedicato alla libreria, effettuare build di produzione con ng-packagr, pubblicare su NPM con 2FA e versionamento corretto, e sviluppare in locale con un workflow fluido basato su tsconfig paths e watch mode.

Inoltre imparerai a generare documentazione API automatica con Compodoc e a creare un playground visuale con Storybook, ottenendo lo stesso setup professionale utilizzato dalle librerie Angular più diffuse.
§03

REQUISITI

Conoscere le fondamenta del framework e/o aver partecipato ai corsi Angular Core Concepts e Mastering Angular.

È consigliabile aver già sviluppato componenti riutilizzabili in Angular per apprezzare al meglio i contenuti del corso.
[ programma ]

Cosa vediamo,
in dettaglio.

Il programma viene rifinito con il team prima del corso, in base a stack, obiettivi e livello. Quella che vedi è la base: possiamo accelerare o approfondire dove serve e, se necessario, modificare il programma.
La maggior parte del corso è live-coding, con esempi pratici.

5 moduli · 22 argomenti
  1. M01

    Scaffolding della libreria

    • Creare un workspace Angular senza applicazione
    • Generare un progetto libreria con l'Angular CLI
    • Configurare selector prefix personalizzati
    • Struttura del progetto: libreria vs app di consumo
  2. M02

    Build di produzione con ng-packagr

    • Angular Package Format (APF): cos'è e perché esiste
    • Contenuto della cartella dist/
    • Differenza tra sorgente e pacchetto pubblicabile
    • Configurazione di ng-package.json
  3. M03

    Pubblicazione su NPM

    • Creazione e configurazione account NPM e 2FA
    • Script lib:build / lib:publish / lib:deploy
    • Scrivere un README.md efficace per il pacchetto
    • Versionamento semantico e gestione degli aggiornamenti
    • Regole e gotcha della pubblicazione su NPM
  4. M04

    Workflow di sviluppo locale

    • Collegamento locale tramite tsconfig.json paths
    • Confronto tra tsconfig paths e npm link
    • Configurazione angular.json: preserveSymlinks e source maps
    • Watch mode: modifiche alla libreria riflesse in tempo reale
    • Sviluppare come in un'app normale con una libreria disaccoppiata
  5. M05

    Documentazione e showcase

    • Documentazione API automatica con Compodoc
    • JSDoc, sidebar componenti, inputs/outputs e dependency graph
    • Playground visuale con Storybook
    • Scrivere stories per documentare gli stati visuali dei componenti

Pronto a portarlo nel tuo team?

Contattami →