Angular mit Docker ohne lokale node Installation

In den letzten Monaten war es ziemlich ruhig, jedoch möchte ich das Ganze nun wieder etwas aufleben lassen. Aktuell beschäftigt mich die Entwicklung einer einfachen JavaScript / TypeScript App mit Angular. Als ich zuletzt Angular verwendet habe, war die Version 1.8 aktuell - nun ist es Version 8. Angular wird mit node.js entwickelt, jedoch bin ich kein Fan davon, mir mein lokales System mit Tools zur Softwareentwicklung vollzuspammen, sondern möchte lieber das Einfache Ausrollen von Entwicklungsumgebungen unterstützen. Daher möchte ich kurz zeigen, wie ich ein neues Angular Projekt mittels Docker ohne lokale Node.js-Installation aufsetze.

Das Ganze ist recht simple und den nötigen Code für das Dockerfile und ein Beipsiel für eine docker-compose.yml habe ich direkt in meinem github.com-Account verlinkt, auf welchen ich an dieser Stelle auch verweisen und zurückgreifen möchte.

Wenn ihr also Euren Rechner, genau wie ich, frei von Abhängikeiten zur Softwareentwicklung halten wollt, hüpft doch kurz rüber auf github.com und befolgt die wenigen Schritte dort. Anschließend könnt ihr direkt mitt der App Entwicklung nach modernen JavaScript Standards beginnen.

Für die Faulen, habe ich die Steps hier noch einmal kurz kopiert und zusammengefasst, sowie um das Ändern des Git-Upstreams erweitert. So könnt ihr direkt nach dem Erstellen und intialen Laden der node_modules mit der Entwicklung in Eurem eigenen Repository starten.

git clone https://github.com/erickubenka/angular-docker-boilerplate.git
cd angular-docker-boilerplate

Stellt bitte sicher, dass ihr die github-Credentials in der Dockerfile angepasst habt - Anonsten kann es beim initalen Laden der node_modules zu Problemen kommen, da der Vorgang abgebrochen wird.

docker build -t code-fever/angular-app:latest .
docker-compose up -d
docker logs angular-app -f

An dieser Stelle könnt ihr nun versuchen http://localhost:4200 aufzurufen. Falls das nicht klappen sollte, so muss die Anwendung noch einmal beenedet werden und die eben generierte Datei angular-app/package.json verändert werden. Ersetzt dazu die Zeile

    "start": "ng serve",

mit der Zeile:

    "start": "ng serve --host 0.0.0.0",

Danach sollte mittels docker-compose up -d die Basic Angular Website unter http://localhost:4200 erreichbar sein.

Git Upstream ändern

Nun kann der Git-Upstream auf das eigen Repository umgelegt und anschließend direkt commited werden.

git remote set-url origin https://github.com/USERNAME/REPOSITORY.git
git add --all
git commit -m "Initial boilerplate setup for my angular app"
git push

Falls ihr nun neue Entwickler in das projetk holt, reicht es, wenn diese die folgenden Zeilen ausführen.

ocker build -t code-fever/angular-app:latest .
docker-compose up -d