DockApp

Piccola applicazione Dock per Windows basata su Electron + Angular 19.

La dock compare in alto allo schermo quando il mouse si avvicina al bordo superiore, permette il drag & drop di eseguibili/cartelle e li salva in apps.json.

---

Requisiti

• Node.js e npm installati (versione recente LTS consigliata)
• Sistema operativo: Windows (per l’integrazione con collegamenti .lnk e icone)

Nel progetto sono già configurati:

• Angular CLI 19
• Electron 33 con Electron Forge

---

Installazione

Da eseguire una sola volta dopo aver clonato il repository:

npm install

Questo installa sia le dipendenze Angular sia quelle Electron/Electron Forge.

---

Avviare l’app in sviluppo

Ci sono due modalità principali.

1. Solo frontend Angular (senza Electron)

Utile per lavorare solo sulla UI:

npx ng serve

Poi apri il browser su:

• http://localhost:4200/

In questa modalità non hai accesso alle API Electron (niente tray, niente IPC reali), solo l’interfaccia Angular.

2. App completa (Electron + Angular)

Modalità consigliata per testare il comportamento reale della dock.

npm start

Questo comando esegue electron-forge start che:

• Compila l’app Angular (se necessario)
• Avvia Electron usando main.js
• Carica il bundle Angular da dist/dock-app/browser/index.html

Si aprirà la dock in alto allo schermo. Puoi:

• Avvicinare il mouse al bordo superiore centrale per mostrarla
• Trascinare .exe / .lnk / cartelle per aggiungerle alla dock

---

Creare il build / eseguibile

Per generare un pacchetto installabile (es. setup per Windows) usa gli script Electron Forge.

Build di produzione Angular (opzionale)

Se vuoi solo creare il bundle Angular (utile per verificare che il build passi):

npm run build

Il risultato finisce in:

• dist/dock-app/browser/

Pacchetto della app (installer / zip)

Per creare un pacchetto utilizzando le impostazioni di Electron Forge definite in forge.config.js:

npm run package

Questo comando:

• Compila l’app
• Impacchetta il codice in un’app Electron pronta all’uso
• Scrive gli artefatti nella cartella out/ (sottocartelle dipendono dalla piattaforma)

Per creare anche gli installer (es. setup .exe su Windows), usa:

npm run make

Anche qui gli output finiscono tipicamente sotto out/ (es. out/make/…).

---

Script npm principali

Nel file package.json trovi questi script utili:

• npm start – avvia Electron tramite Electron Forge (modalità dev completa)
• npm run electron – esegue ng build e poi electron . direttamente
• npm run build – build di produzione Angular in dist/dock-app
• npm run package – crea il pacchetto dell’app (cartella out/)
• npm run make – crea i distributables/installer tramite Electron Forge

---

Struttura del progetto (high level)

• main.js – processo principale Electron (finestra dock, tray, IPC, icone)
• preload.js – bridge sicuro verso il renderer (window.electron)
• apps.json – persistenza delle app aggiunte alla dock
• src/main.ts – bootstrap Angular
• src/app/dock/dock.component.* – UI e logica della dock
• forge.config.js – configurazione Electron Forge (packaging/makers)

Per modificare il comportamento della dock lavora soprattutto in:

• src/app/dock/dock.component.ts
• main.js

Per cambiare packaging o target, usa:

• forge.config.js