| Nächste Überarbeitung | Vorhergehende Überarbeitung |
| de:modul:m291:learningunits:lu16:theorie:c_deploy [2026/06/28 23:34] – angelegt gkoch | de:modul:m291:learningunits:lu16:theorie:c_deploy [2026/07/03 09:50] (aktuell) – gkoch |
|---|
| |
| {{:de:modul:m291:learningunits:lu16:theorie:screenshot_2026-06-28_at_23.17.53.png?direct&900| Terminal-Output nach npm run build }}\\ | {{:de:modul:m291:learningunits:lu16:theorie:screenshot_2026-06-28_at_23.17.53.png?direct&900| Terminal-Output nach npm run build }}\\ |
| //Platzhalter: Screenshot Terminal mit Build-Output – Dateigrössen, Chunk-Namen, Dauer// | //Screenshot Terminal mit Build-Output – Dateigrössen, Chunk-Namen, Dauer// |
| |
| |
| Nach dem Build liegt ein neuer Ordner ''dist/'' im Projekt: | Nach dem Build liegt ein neuer Ordner ''dist/'' im Projekt: |
| {{:de:modul:m291:learningunits:lu16:theorie:scap_20260628231953_1.png?direct&600| Inhalt des dist-Ordners }}\\ | {{:de:modul:m291:learningunits:lu16:theorie:scap_20260628231953_1.png?direct&600| Inhalt des dist-Ordners }}\\ |
| //Screenshot VS Code Explorer mit dist-Ordner: index.html, assets/-Unterordner mit .js und .css Dateien | //Screenshot VS Code Explorer mit dist-Ordner: index.html, assets/-Unterordner mit .js und .css Dateien// |
| |
| |
| {{:de:modul:m291:learningunits:lu16:theorie:screenshot_2026-06-28_at_23.26.39.png?direct&1100 | Deploy-Workflow mit Git: Code → GitHub → Hoster → Live }}\\ | {{:de:modul:m291:learningunits:lu16:theorie:screenshot_2026-06-28_at_23.26.39.png?direct&1100 | Deploy-Workflow mit Git: Code → GitHub → Hoster → Live }}\\ |
| //Development → Code push zu GitHub → Vercel/Netlify/Render → Preview → Production (Live)// | //Development → Code push zu GitHub → Vercel/Netlify/Render → Preview → Production (Live)// |
| | |
| <WRAP center round center 80%> | <WRAP center round center 80%> |
| ^ Anbieter ^ Kostenlos ^ Besonderheit ^ | ^ Anbieter ^ Kostenlos ^ Besonderheit ^ |
| Für den Unterricht – ohne Git-Kenntnisse – gibt es zwei einfachere Wege: | Für den Unterricht – ohne Git-Kenntnisse – gibt es zwei einfachere Wege: |
| |
| <WRAP center round box 80%> | |
| {{:de:modul:m291:learningunits:lu16:theorie:scap_20260628233044_1.png?direct&1100| Deploy ohne Git: npm run build → dist → surge.sh → Live-URL }}\\ | {{:de:modul:m291:learningunits:lu16:theorie:scap_20260628233044_1.png?direct&1100| Deploy ohne Git: npm run build → dist → surge.sh → Live-URL }}\\ |
| //Vue.js mit npm run build und surge.sh deployen// | //Vue.js mit npm run build und surge.sh deployen// |
| </WRAP> | |
| |
| ==== Option A: Surge.sh (Terminal-Weg) ==== | ==== Option A: Surge.sh (Terminal-Weg) ==== |
| | **Automatisches Re-Deploy** | Nein | Nein | Ja (bei Git-Push) | | | **Automatisches Re-Deploy** | Nein | Nein | Ja (bei Git-Push) | |
| | **Gratis** | ✅ | ✅ | ✅ (mit Limits) | | | **Gratis** | ✅ | ✅ | ✅ (mit Limits) | |
| | | **Eigene Domain** | Ja | Nein | Ja | |
| </WRAP> | </WRAP> |
| ===== Zusammenfassung: Der komplette Ablauf ===== | ===== Zusammenfassung: Der komplette Ablauf ===== |