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
Di cosa parla
questo corso.
Contesto, obiettivi e taglio del corso. Tutto è personalizzabile in base a stack e team — questa è la base di partenza.
INTRODUZIONE
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.
OBIETTIVO DEL CORSO
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.
REQUISITI
È consigliabile aver già sviluppato componenti riutilizzabili in Angular per apprezzare al meglio i contenuti del corso.
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.
M01 Scaffolding della libreria
- 01Creare un workspace Angular senza applicazione
- 02Generare un progetto libreria con l'Angular CLI
- 03Configurare selector prefix personalizzati
- 04Struttura del progetto: libreria vs app di consumo
M02 Build di produzione con ng-packagr
- 01Angular Package Format (APF): cos'è e perché esiste
- 02Contenuto della cartella
dist/ - 03Differenza tra sorgente e pacchetto pubblicabile
- 04Configurazione di
ng-package.json
M03 Pubblicazione su NPM
- 01Creazione e configurazione account NPM e 2FA
- 02Script
lib:build/lib:publish/lib:deploy - 03Scrivere un
README.mdefficace per il pacchetto - 04Versionamento semantico e gestione degli aggiornamenti
- 05Regole e gotcha della pubblicazione su NPM
M04 Workflow di sviluppo locale
- 01Collegamento locale tramite
tsconfig.jsonpaths - 02Confronto tra tsconfig paths e
npm link - 03Configurazione
angular.json:preserveSymlinkse source maps - 04Watch mode: modifiche alla libreria riflesse in tempo reale
- 05Sviluppare come in un'app normale con una libreria disaccoppiata
- 01Collegamento locale tramite
M05 Documentazione e showcase
- 01Documentazione API automatica con Compodoc
- 02JSDoc, sidebar componenti, inputs/outputs e dependency graph
- 03Playground visuale con Storybook
- 04Scrivere stories per documentare gli stati visuali dei componenti
Prima di questo corso...
Potrebbero piacerti anche...
12h · IntermedioApplicazioni Agentiche con Angular & Gemini SDK
Interfacce professionali per l'AI, dashboard per la generazione video con Veo e tool di image editing basati su Nano Banana.
8h · IntermedioAngular Signal Forms
Le nuove API per la creazione di form in Angular, basate sui Signal: masterclass intensiva, reattiva e moderna.
8h · IntermedioAngular Reactive Forms
Tutto ciò che devi sapere sui Reactive Forms, lo strumento per form complessi, dinamici e reattivi.

