{"id":29471,"date":"2026-09-13T22:51:11","date_gmt":"2026-09-13T20:51:11","guid":{"rendered":"https:\/\/blog.mi.hdm-stuttgart.de\/?p=29471"},"modified":"2026-09-13T23:34:45","modified_gmt":"2026-09-13T21:34:45","slug":"von-der-lokalen-chat-app-zur-cloud","status":"publish","type":"post","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/","title":{"rendered":"Von der lokalen Chat-App zur Cloud"},"content":{"rendered":"\n<h3 class=\"wp-block-heading\">Ausgangspunkt und Tech-Stack<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren Backend-Instanzen und NGINX dient als Gateway zwischen externen Anfragen, Frontend und Backend.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Die wichtigsten Komponenten und ihre Verbindungen lassen sich vereinfacht so darstellen:<\/p>\n\n\n\n<figure class=\"wp-block-image size-full\"><a href=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\"><img loading=\"lazy\" decoding=\"async\" width=\"753\" height=\"243\" data-attachment-id=\"29484\" data-permalink=\"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/techstack\/\" data-orig-file=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\" data-orig-size=\"753,243\" data-comments-opened=\"1\" data-image-meta=\"{&quot;aperture&quot;:&quot;0&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;0&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;0&quot;,&quot;iso&quot;:&quot;0&quot;,&quot;shutter_speed&quot;:&quot;0&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;,&quot;alt&quot;:&quot;&quot;}\" data-image-title=\"techstack\" data-image-description=\"\" data-image-caption=\"\" data-large-file=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\" src=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\" alt=\"\" class=\"wp-image-29484\" srcset=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp 753w, https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack-300x97.webp 300w\" sizes=\"auto, (max-width: 753px) 100vw, 753px\" \/><\/a><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Unsere Ziele<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">F\u00fcr das Projekt hatten wir drei Ziele:<\/p>\n\n\n\n<ol class=\"wp-block-list\">\n<li>\u00a0<strong>Infrastructure as Code:<\/strong> Die Infrastruktur sollte reproduzierbar mit Terraform erstellt werden.<\/li>\n\n\n\n<li><strong>Automatisiertes Deployment:<\/strong> \u00c4nderungen sollten \u00fcber GitLab CI\/CD gebaut und auf dem Server bereitgestellt werden.<\/li>\n\n\n\n<li><strong>Skalierung:<\/strong> Wir wollten untersuchen, wie Kubernetes mehrere Instanzen<br>verwaltet und Anwendungen unter Last automatisch skaliert.<\/li>\n<\/ol>\n\n\n\n<p class=\"wp-block-paragraph\">Dabei ging es nicht darum, eine vollst\u00e4ndig hochverf\u00fcgbare Produktionsplattform zu bauen.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Terraform: Infrastruktur als Code<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Mit Terraform erstellen wir den Hetzner-Server und die zugeh\u00f6rige Firewall. Beim Start richtet Cloud-Init den Deploy-Benutzer ein und installiert k3s. Dadurch kann ein neuer Server automatisch vorbereitet werden.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Wir mussten unterscheiden, wof\u00fcr Terraform und Kubernetes zust\u00e4ndig sind: Terraform stellt die Maschine bereit. Kubernetes verwaltet anschlie\u00dfend die Anwendung, ihre Pods und Services.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Dabei mussten wir besonders auf den Terraform-State achten. Der State enth\u00e4lt Informationen dar\u00fcber, welche Cloud-Ressourcen zu einer Konfiguration geh\u00f6ren. Wir verwenden deshalb einen Remote-State in GitLab. W\u00e4hrend der Entwicklung wurde uns klar, dass getrennte Terraform-Verzeichnisse allein nicht ausreichen, wenn sie versehentlich denselben State verwenden. Ein falsch gesetzter State-Name kann dazu f\u00fchren, dass Terraform Ressourcen einer anderen Infrastruktur zuordnet.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Passw\u00f6rter, API-Tokens und private Schl\u00fcssel d\u00fcrfen weder im Repository noch im State landen. Sensible Werte werden \u00fcber Umgebungsvariablen und GitLab-CI\/CD-Variablen bereitgestellt. F\u00fcr den initialen SSH-Zugriff verwenden wir lokal einen SSH-Agent.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Deployment: Von Docker Compose zu Kubernetes<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Unser erster Deployment-Ansatz basierte auf Docker Compose. Terraform erstellte einen Server. Die Pipeline hat die Compose- und Nginx-Konfiguration per SSH auf den Server \u00fcbertragen. Dort hat Docker Compose die Images aus der GitLab Registry geladen und sie gestartet. Dieser Ansatz hat uns geholfen, den Ablauf zu verstehen: Server erstellen, Images bereitstellen, Umgebungsvariablen setzen und die Anwendung erreichbar machen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Im Laufe des Projekts wurde uns klar, dass Docker Compose f\u00fcr unser eigentliches Lernziel nicht ausreicht. Wir wollten Pods, Services und automatische Skalierung kennenlernen. Deshalb wechselten wir zu k3s, einer schlanken Kubernetes-Distribution.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Zun\u00e4chst probierten wir Kubernetes lokal mit Docker Desktop aus. So konnten wir schrittweise verstehen, wie Pods und Services funktionieren, bevor wir den vollst\u00e4ndigen Aufbau auf dem Hetzner-Server einrichteten. Anschlie\u00dfend wurden Backend, Frontend, MongoDB, Redis und das NGINX-Gateway als Kubernetes-Ressourcen definiert.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Anfangs verwendeten wir SSH-Skripte, um Dateien auf den Server zu kopieren und dort Kubernetes-Befehle auszuf\u00fchren. Sp\u00e4ter ersetzten wir dieses Verfahren durch den GitLab Kubernetes Agent. Der Agent l\u00e4uft im Cluster und verbindet sich mit GitLab. Die Pipeline kann dadurch \u00fcber den Kubernetes-Kontext des Agents auf den Cluster zugreifen und die Manifeste mit <code class=\"\" data-line=\"\">kubectl<\/code>\u00a0anwenden.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Diese Kommunikation war anfangs schwer nachzuvollziehen, weil die Pipeline nicht einfach per SSH auf dem Server arbeitet. Der Ablauf besteht aus mehreren Teilen: GitLab CI baut die Images, die Container Registry speichert sie, der Agent verbindet GitLab mit Kubernetes und Kubernetes startet die neue Version der Anwendung.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Die beiden Deployment-Ans\u00e4tze<\/h4>\n\n\n\n<figure class=\"wp-block-table\"><table class=\"has-fixed-layout\"><thead><tr><th>Docker Compose<\/th><th>Kubernetes\/k3s<\/th><\/tr><\/thead><tbody><tr><td>Einfache Orchestrierung auf einem Server<\/td><td>Verwaltung der Anwendung in einem Cluster<\/td><\/tr><tr><td>Container werden direkt gestartet<\/td><td>Anwendung l\u00e4uft in Pods<\/td><\/tr><tr><td>Weniger automatische Skalierung<\/td><td>HPA kann Pods automatisch skalieren<\/td><\/tr><tr><td>Gut f\u00fcr den ersten Deployment-Schritt<\/td><td>N\u00e4her an einem realit\u00e4tsnahen Cloud-Deployment<\/td><\/tr><tr><td>Bereitstellung zun\u00e4chst per SSH <\/td><td>Bereitstellung \u00fcber den GitLab Kubernetes Agent<\/td><\/tr><\/tbody><\/table><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Skalierung und Redis<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">F\u00fcr die Skalierung verwenden wir den Horizontal Pod Autoscaler von Kubernetes. Der HPA \u00fcberwacht die CPU-Auslastung und passt die Anzahl der Pods an. F\u00fcr das Backend sind zwei bis f\u00fcnf Pods vorgesehen, f\u00fcr das Gateway zwei bis vier.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Die Skalierung hat erfolgreich funktioniert. Unter Last startete Kubernetes automatisch zus\u00e4tzliche Backend- und Gateway-Pods. Damit konnten wir die horizontale Skalierung praktisch nachstellen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Redis war wichtig, damit der Chat auch mit mehreren Backend-Pods funktioniert. Eine WebSocket-Verbindung ist immer an einen bestimmten Backend-Pod gebunden. Wenn ein Benutzer mit Pod A und ein anderer mit Pod B verbunden ist, kennen die beiden Pods ihre jeweiligen Verbindungen nicht automatisch. Ohne Redis k\u00f6nnte eine Nachricht deshalb nur lokal beim jeweiligen Pod ankommen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">\u00dcber Redis Pub\/Sub werden Nachrichten, Direktnachrichten, L\u00f6schereignisse und \u00c4nderungen des Online-Status zwischen den Pods verteilt. Jede Backend-Instanz besitzt einen Redis-Listener und leitet empfangene Ereignisse an ihre lokal verbundenen WebSockets weiter. Dadurch funktioniert der Chat auch dann, wenn Benutzer auf unterschiedlichen Pods landen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Auch mit nur einem Backend-Pod laufen Chat-Ereignisse in unserer Anwendung \u00fcber Redis. Bei mehreren Pods muss man beachten, dass Nachrichten alle Backend-Instanzen erreichen, weil jeder Pod nur seine eigenen WebSocket-Verbindungen kennt.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Lasttests und Grenzen<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Mit k6 haben wir die Anwendung unter steigender Last getestet. Neben normalen Lasttests f\u00fchrten wir auch extreme Tests mit 300 und 600 virtuellen Benutzern durch. Diese Tests sollten keine realistische Dauerlast darstellen, sondern bewusst zeigen, wo die Grenzen der Anwendung und der Infrastruktur liegen.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Dabei stellten wir fest, dass das Gateway die erste Engstelle war. Bereits bevor das Backend vollst\u00e4ndig ausgelastet war, traten am NGINX-Gateway h\u00f6here Antwortzeiten und teilweise Verbindungsfehler auf. Durch zus\u00e4tzliche Gateway-Pods konnte die Stabilit\u00e4t verbessert werden.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Au\u00dferdem wurde uns klar, dass Pod-Skalierung allein keine unbegrenzte Skalierung bedeutet. Alle Pods liefen weiterhin auf demselben Hetzner-Server und teilten sich dessen CPU- und Speicherressourcen. Der einzelne Node setzte daher ein Limit.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Um \u00fcber die Kapazit\u00e4t unseres einzelnen Hetzner-Servers hinaus zu skalieren, h\u00e4tten wir weitere Nodes ben\u00f6tigt. Diese h\u00e4tten wir auch manuell einrichten k\u00f6nnen. F\u00fcr das automatische Hinzuf\u00fcgen weiterer Server w\u00e4re zus\u00e4tzlich eine passende Autoscaling-L\u00f6sung n\u00f6tig gewesen. Das haben wir in diesem Projekt nicht umgesetzt. Trotzdem konnten wir die Pod-Skalierung erfolgreich testen und eine automatische Skalierung innerhalb der vorhandenen Infrastruktur demonstrieren.<\/p>\n\n\n\n<h4 class=\"wp-block-heading\">Ergebnisse der Lasttests<\/h4>\n\n\n\n<div class=\"wp-block-columns are-vertically-aligned-top is-layout-flex wp-container-core-columns-is-layout-37ae2f39 wp-block-columns-is-layout-flex\" style=\"border-style:none;border-width:0px;border-top-left-radius:0px;border-top-right-radius:0px;border-bottom-left-radius:0px;border-bottom-right-radius:0px;padding-top:0;padding-right:0;padding-bottom:0;padding-left:0\">\n<div class=\"wp-block-column is-vertically-aligned-top is-layout-flow wp-block-column-is-layout-flow\" style=\"flex-basis:100%\">\n<figure class=\"wp-block-table is-style-regular\"><table><thead><tr><th>Test<\/th><th class=\"has-text-align-left\" data-align=\"left\">Last<\/th><th>Beobachtung<\/th><\/tr><\/thead><tbody><tr><td>Normaler Lasttest<\/td><td class=\"has-text-align-left\" data-align=\"left\">100 VUs<\/td><td>49.691 Requests, 0 % Fehler, P95-Latenz von 290 ms. Der HPA reagierte bereits auf diese Last und startete zus\u00e4tzliche Pods.<\/td><\/tr><tr><td>Stresstest<\/td><td class=\"has-text-align-left\" data-align=\"left\">300 VUs<\/td><td>Die Latenz stieg deutlich an. Das Gateway war stark ausgelastet, konnte die meisten Anfragen aber noch verarbeiten.<\/td><\/tr><tr><td>Grenztest<\/td><td class=\"has-text-align-left\" data-align=\"left\">600 VUs<\/td><td>Die Latenz erh\u00f6hte sich extrem. Das Gateway erreichte seine Belastungsgrenze und konnte viele Anfragen nicht mehr verarbeiten.<\/td><\/tr><\/tbody><\/table><\/figure>\n<\/div>\n<\/div>\n\n\n\n<h3 class=\"wp-block-heading\">Herausforderungen<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Die gr\u00f6\u00dfte Herausforderung war das Zusammenspiel der verschiedenen Werkzeuge. Zun\u00e4chst war nicht klar, wie GitLab CI\/CD den Kubernetes-Cluster erreicht. er erste Ansatz verwendete SSH-Skripte und sp\u00e4ter wechselten wir zum GitLab-Kubernetes-Agenten. Dieser Wechsel erforderte ein neues Verst\u00e4ndnis davon, wie Pipeline, Container Registry und Cluster miteinander verbunden sind.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Der Wechsel von Docker Compose zu K3s hat l\u00e4nger gedauert als gedacht. Wir mussten uns zun\u00e4chst mit Pods, Services, Deployments und Kubernetes-internen Namen vertraut machen. Erst danach konnten wir Backend, Frontend, MongoDB, Redis und NGINX gemeinsam im Cluster betreiben.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Bei der CI-Konfiguration f\u00fchrten Protected Variables zu einem weiteren Problem. Unser Feature-Branch war zun\u00e4chst nicht gesch\u00fctzt, daher erhielt die Pipeline den gesch\u00fctzten SSH-Key nicht. Zus\u00e4tzlich war nicht abgestimmt, ob<br><code class=\"\" data-line=\"\">SSH_PRIVATE_KEY<\/code> als Text- oder File-Variable angelegt wird. Bei einer File-Variable muss das Skript den Pfad zu einer tempor\u00e4ren Datei verarbeiten, nicht den Key direkt.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Auch die Tests und die Infrastruktur erforderten Fehlersuche. Ein Hintergrundprozess f\u00fcr den Redis-Listener lie\u00df <code class=\"\" data-line=\"\">pytest<\/code> in GitLab h\u00e4ngen und musste in den Tests kontrolliert werden. Nach dem Ersetzen eines Servers mussten wir au\u00dferdem SSH-Warnungen wegen eines ge\u00e4nderten Host-Keys pr\u00fcfen. Als wir versehentlich den falschen Terraform-State verwendeten, wurde der Compose-Server zerst\u00f6rt. Deswegen sollte vor <code class=\"\" data-line=\"\">terraform apply<\/code> gepr\u00fcft werden, welchen State Terraform verwendet und welche \u00c4nderungen der Plan anzeigt.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">F\u00fcr die Lasttests war der GitLab Runner kein zuverl\u00e4ssiger Ausgangspunkt, da er den \u00f6ffentlichen NodePort nicht immer erreichen konnte. Wir f\u00fchrten k6 daher lokal aus.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Was wir gelernt haben<\/h3>\n\n\n\n<p class=\"wp-block-paragraph\">Wir haben gelernt, Infrastructure as Code mit Terraform selbst zu programmieren, anzuwenden und mit einem automatisierten Deployment zu verbinden. Nach dem Docker-Compose-Setup richteten wir die Anwendung auch mit K3s, Services und mehreren Pods ein.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Au\u00dferdem wurde deutlich, dass Skalierung mehr bedeutet als nur die Anzahl der Replicas zu erh\u00f6hen. Redis ist notwendig, damit mehrere Backend-Pods bei WebSocket-Kommunikation zusammenarbeiten. Mit k6 konnten wir Last gezielt steigern, w\u00e4hrend wir Pods, Ressourcenauslastung, Antwortzeiten und Fehlerraten beobachteten. So wurde sichtbar, wann der HPA skaliert, dass das Gateway die erste Engstelle bildet und dass ein einzelner Server die weitere Skalierung begrenzt.<\/p>\n\n\n\n<p class=\"wp-block-paragraph\">Unser wichtigstes \u00fcbergreifendes Learning ist daher, dass ein Deployment aus mehreren \u00fcberpr\u00fcfbaren Schritten besteht: Infrastruktur erstellen, Images bauen, Anwendung deployen, Kommunikation zwischen Instanzen sicherstellen und das Verhalten unter Last messen. Erst das Zusammenspiel dieser Schritte zeigt, ob die Anwendung in der Cloud tats\u00e4chlich funktioniert.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Projektteam<\/h3>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Henry Spechtenhauser &#8211; @hs128<\/li>\n\n\n\n<li>Georgi Bozhilski &#8211; @gb040<\/li>\n\n\n\n<li>Martin Herdt &#8211; @mh370<\/li>\n\n\n\n<li>Asim Jugo &#8211; @aj049<\/li>\n<\/ul>\n\n\n\n<p class=\"wp-block-paragraph\"><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren [&hellip;]<\/p>\n","protected":false},"author":1339,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_feature_clip_id":0,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_post_was_ever_published":false,"_ppma_block_editor_authors":""},"categories":[120,659,650,22,21,2,662],"tags":[],"ppma_author":[1272],"class_list":["post-29471","post","type-post","status-publish","format-standard","hentry","category-cloud-technologies","category-devops","category-scalable-systems","category-student-projects","category-system-architecture","category-system-engineering","category-web-performance"],"aioseo_notices":[],"aioseo_head":"\n\t\t<!-- All in One SEO 5.0.1.1 - aioseo.com -->\n\t<meta name=\"description\" content=\"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren\" \/>\n\t<meta name=\"robots\" content=\"max-image-preview:large\" \/>\n\t<meta name=\"author\" content=\"Asim Jugo\"\/>\n\t<link rel=\"canonical\" href=\"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/\" \/>\n\t<meta name=\"generator\" content=\"All in One SEO (AIOSEO) 5.0.1.1\" \/>\n\t\t<meta property=\"og:locale\" content=\"en_US\" \/>\n\t\t<meta property=\"og:site_name\" content=\"Computer Science Blog\" \/>\n\t\t<meta property=\"og:type\" content=\"article\" \/>\n\t\t<meta property=\"og:title\" content=\"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart\" \/>\n\t\t<meta property=\"og:description\" content=\"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren\" \/>\n\t\t<meta property=\"og:url\" content=\"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/\" \/>\n\t\t<meta property=\"og:image\" content=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\" \/>\n\t\t<meta property=\"og:image:secure_url\" content=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\" \/>\n\t\t<meta property=\"og:image:width\" content=\"753\" \/>\n\t\t<meta property=\"og:image:height\" content=\"243\" \/>\n\t\t<meta property=\"article:published_time\" content=\"2026-09-13T20:51:11+00:00\" \/>\n\t\t<meta property=\"article:modified_time\" content=\"2026-09-13T21:34:45+00:00\" \/>\n\t\t<meta name=\"twitter:card\" content=\"summary\" \/>\n\t\t<meta name=\"twitter:title\" content=\"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart\" \/>\n\t\t<meta name=\"twitter:description\" content=\"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren\" \/>\n\t\t<meta name=\"twitter:image\" content=\"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp\" \/>\n\t\t<script type=\"application\/ld+json\" class=\"aioseo-schema\">\n\t\t\t{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#article\",\"name\":\"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart\",\"headline\":\"Von der lokalen Chat-App zur Cloud\",\"author\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/author\\\/asim_jugo\\\/#author\"},\"publisher\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/#organization\"},\"image\":{\"@type\":\"ImageObject\",\"url\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/wp-content\\\/uploads\\\/2026\\\/09\\\/techstack.webp\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#articleImage\",\"width\":753,\"height\":243},\"datePublished\":\"2026-09-13T22:51:11+02:00\",\"dateModified\":\"2026-09-13T23:34:45+02:00\",\"inLanguage\":\"en-US\",\"mainEntityOfPage\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#webpage\"},\"isPartOf\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#webpage\"},\"articleSection\":\"Cloud Technologies, DevOps, Scalable Systems, Student Projects, System Architecture, System Engineering, Web Performance, Asim Jugo\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#breadcrumblist\",\"itemListElement\":[{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de#listItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/#listItem\",\"name\":\"System Designs\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/#listItem\",\"position\":2,\"name\":\"System Designs\",\"item\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/system-engineering\\\/#listItem\",\"name\":\"System Engineering\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de#listItem\",\"name\":\"Home\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/system-engineering\\\/#listItem\",\"position\":3,\"name\":\"System Engineering\",\"item\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/system-engineering\\\/\",\"nextItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#listItem\",\"name\":\"Von der lokalen Chat-App zur Cloud\"},\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/#listItem\",\"name\":\"System Designs\"}},{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#listItem\",\"position\":4,\"name\":\"Von der lokalen Chat-App zur Cloud\",\"previousItem\":{\"@type\":\"ListItem\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/category\\\/system-designs\\\/system-engineering\\\/#listItem\",\"name\":\"System Engineering\"}}]},{\"@type\":\"Organization\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/#organization\",\"name\":\"Computer Science Blog @ HdM Stuttgart\",\"description\":\"on computer science and media topics\",\"url\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/\"},{\"@type\":\"Person\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/author\\\/asim_jugo\\\/#author\",\"url\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/author\\\/asim_jugo\\\/\",\"name\":\"Asim Jugo\",\"image\":{\"@type\":\"ImageObject\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#authorImage\",\"url\":\"https:\\\/\\\/secure.gravatar.com\\\/avatar\\\/ec7cb0f454852977eee500aad7ad25e2bf8a5f96a98c44dae1d0f31b2a8d156b?s=96&d=mm&r=g\",\"width\":96,\"height\":96,\"caption\":\"Asim Jugo\"}},{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#webpage\",\"url\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/\",\"name\":\"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart\",\"description\":\"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\\u00fcnglich als lokales Projekt. F\\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren\",\"inLanguage\":\"en-US\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/#website\"},\"breadcrumb\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/2026\\\/09\\\/13\\\/von-der-lokalen-chat-app-zur-cloud\\\/#breadcrumblist\"},\"author\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/author\\\/asim_jugo\\\/#author\"},\"creator\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/index.php\\\/author\\\/asim_jugo\\\/#author\"},\"datePublished\":\"2026-09-13T22:51:11+02:00\",\"dateModified\":\"2026-09-13T23:34:45+02:00\"},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/#website\",\"url\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/\",\"name\":\"Computer Science Blog @ HdM Stuttgart\",\"description\":\"on computer science and media topics\",\"inLanguage\":\"en-US\",\"publisher\":{\"@id\":\"https:\\\/\\\/blog.mi.hdm-stuttgart.de\\\/#organization\"}}]}\n\t\t<\/script>\n\t\t<!-- All in One SEO -->\n\n","aioseo_head_json":{"title":"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart","description":"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren","canonical_url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/","robots":"max-image-preview:large","keywords":"","webmasterTools":{"miscellaneous":""},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#article","name":"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart","headline":"Von der lokalen Chat-App zur Cloud","author":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/author\/asim_jugo\/#author"},"publisher":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/#organization"},"image":{"@type":"ImageObject","url":"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#articleImage","width":753,"height":243},"datePublished":"2026-09-13T22:51:11+02:00","dateModified":"2026-09-13T23:34:45+02:00","inLanguage":"en-US","mainEntityOfPage":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#webpage"},"isPartOf":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#webpage"},"articleSection":"Cloud Technologies, DevOps, Scalable Systems, Student Projects, System Architecture, System Engineering, Web Performance, Asim Jugo"},{"@type":"BreadcrumbList","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#breadcrumblist","itemListElement":[{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de#listItem","position":1,"name":"Home","item":"https:\/\/blog.mi.hdm-stuttgart.de","nextItem":{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/#listItem","name":"System Designs"}},{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/#listItem","position":2,"name":"System Designs","item":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/","nextItem":{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-engineering\/#listItem","name":"System Engineering"},"previousItem":{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de#listItem","name":"Home"}},{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-engineering\/#listItem","position":3,"name":"System Engineering","item":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-engineering\/","nextItem":{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#listItem","name":"Von der lokalen Chat-App zur Cloud"},"previousItem":{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/#listItem","name":"System Designs"}},{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#listItem","position":4,"name":"Von der lokalen Chat-App zur Cloud","previousItem":{"@type":"ListItem","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-engineering\/#listItem","name":"System Engineering"}}]},{"@type":"Organization","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/#organization","name":"Computer Science Blog @ HdM Stuttgart","description":"on computer science and media topics","url":"https:\/\/blog.mi.hdm-stuttgart.de\/"},{"@type":"Person","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/author\/asim_jugo\/#author","url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/author\/asim_jugo\/","name":"Asim Jugo","image":{"@type":"ImageObject","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#authorImage","url":"https:\/\/secure.gravatar.com\/avatar\/ec7cb0f454852977eee500aad7ad25e2bf8a5f96a98c44dae1d0f31b2a8d156b?s=96&d=mm&r=g","width":96,"height":96,"caption":"Asim Jugo"}},{"@type":"WebPage","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#webpage","url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/","name":"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart","description":"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren","inLanguage":"en-US","isPartOf":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/#website"},"breadcrumb":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/#breadcrumblist"},"author":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/author\/asim_jugo\/#author"},"creator":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/author\/asim_jugo\/#author"},"datePublished":"2026-09-13T22:51:11+02:00","dateModified":"2026-09-13T23:34:45+02:00"},{"@type":"WebSite","@id":"https:\/\/blog.mi.hdm-stuttgart.de\/#website","url":"https:\/\/blog.mi.hdm-stuttgart.de\/","name":"Computer Science Blog @ HdM Stuttgart","description":"on computer science and media topics","inLanguage":"en-US","publisher":{"@id":"https:\/\/blog.mi.hdm-stuttgart.de\/#organization"}}]},"og:locale":"en_US","og:site_name":"Computer Science Blog","og:type":"article","og:title":"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart","og:description":"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren","og:url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/","og:image":"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp","og:image:secure_url":"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp","og:image:width":753,"og:image:height":243,"article:published_time":"2026-09-13T20:51:11+00:00","article:modified_time":"2026-09-13T21:34:45+00:00","twitter:card":"summary","twitter:title":"Von der lokalen Chat-App zur Cloud | Computer Science Blog @ HdM Stuttgart","twitter:description":"Ausgangspunkt und Tech-Stack Unsere Chat-Anwendung entstand urspr\u00fcnglich als lokales Projekt. F\u00fcr das Cloud-Computing-Projekt wollten wir deshalb nicht die Anwendung neu entwickeln, sondern herausfinden, wie sie sich in der Cloud betreiben l\u00e4sst. Die Anwendung besteht aus einem React-Frontend mit Vite und einem FastAPI-Backend. WebSockets erm\u00f6glichen die Echtzeitkommunikation. MongoDB speichert die Nachrichten, Redis verteilt Ereignisse zwischen mehreren","twitter:image":"https:\/\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/09\/techstack.webp"},"aioseo_meta_data":{"post_id":"29471","title":null,"description":null,"keywords":null,"keyphrases":{"focus":{"keyphrase":"","score":0,"analysis":{"keyphraseInTitle":{"score":0,"maxScore":9,"error":1}}},"additional":[]},"primary_term":null,"canonical_url":null,"og_title":null,"og_description":null,"og_object_type":"default","og_image_type":"default","og_image_url":null,"og_image_width":null,"og_image_height":null,"og_image_custom_url":null,"og_image_custom_fields":null,"og_video":"","og_custom_url":null,"og_article_section":null,"og_article_tags":null,"twitter_use_og":false,"twitter_card":"default","twitter_image_type":"default","twitter_image_url":null,"twitter_image_custom_url":null,"twitter_image_custom_fields":null,"twitter_title":null,"twitter_description":null,"schema":{"blockGraphs":[],"customGraphs":[],"default":{"data":{"Article":[],"Course":[],"Dataset":[],"FAQPage":[],"Movie":[],"Person":[],"Product":[],"ProductReview":[],"Car":[],"Recipe":[],"Service":[],"SoftwareApplication":[],"WebPage":[]},"graphName":"Article","isEnabled":true},"graphs":[]},"schema_type":"default","schema_type_options":null,"pillar_content":false,"robots_default":true,"robots_noindex":false,"robots_noarchive":false,"robots_nosnippet":false,"robots_nofollow":false,"robots_noimageindex":false,"robots_noodp":false,"robots_notranslate":false,"robots_max_snippet":"-1","robots_max_videopreview":"-1","robots_max_imagepreview":"large","priority":null,"frequency":"default","local_seo":null,"breadcrumb_settings":null,"limit_modified_date":false,"ai":{"faqs":[],"keyPoints":[],"schemas":[],"titles":[],"descriptions":[],"socialPosts":{"email":{"subject":"","preview":"","content":""},"linkedin":[],"twitter":[],"facebook":[],"instagram":[]}},"created":"2026-09-13 19:07:38","updated":"2026-09-13 21:34:45","seo_analyzer_scan_date":null,"focus_keyword":null,"additional_keywords":null,"truseo_locale":null},"aioseo_breadcrumb":"<div class=\"aioseo-breadcrumbs\"><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/blog.mi.hdm-stuttgart.de\" title=\"Home\">Home<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/\" title=\"System Designs\">System Designs<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\t<a href=\"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-engineering\/\" title=\"System Engineering\">System Engineering<\/a>\n\t\t<\/span><span class=\"aioseo-breadcrumb-separator\">&raquo;<\/span><span class=\"aioseo-breadcrumb\">\n\t\t\tVon der lokalen Chat-App zur Cloud\n\t\t<\/span><\/div>","aioseo_breadcrumb_json":[{"label":"Home","link":"https:\/\/blog.mi.hdm-stuttgart.de"},{"label":"System Designs","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/"},{"label":"System Engineering","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-engineering\/"},{"label":"Von der lokalen Chat-App zur Cloud","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/09\/13\/von-der-lokalen-chat-app-zur-cloud\/"}],"jetpack-related-posts":[{"id":28011,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2025\/09\/11\/cloud-native-security-scanner\/","url_meta":{"origin":29471,"position":0},"title":"Cloud-native Security Scanner","author":"Tim Ruff","date":"11. September 2025","format":false,"excerpt":"Dieses Projekt wurde im Rahmen der Vorlesung \u201eSoftware Development for Cloud Computing\u201c umgesetzt. Ausgangslage und Projektidee Unser bisheriger Fokus im Studium lag haupts\u00e4chlich auf Themen der IT-Security und Machine Learning, weshalb wir beide bis auf die grundlegenden Vorlesungen zum Thema Software Entwicklung kaum Erfahrungen in diesem Bereich gesammelt haben. Aus\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/allgemein\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2025\/09\/image.jpeg?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2025\/09\/image.jpeg?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2025\/09\/image.jpeg?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2025\/09\/image.jpeg?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2025\/09\/image.jpeg?resize=1050%2C600&ssl=1 3x"},"classes":[]},{"id":25893,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2023\/09\/15\/entwickeln-einer-edge-anwendung-mit-cloudflare\/","url_meta":{"origin":29471,"position":1},"title":"Entwickeln einer Edge-Anwendung mit Cloudflare","author":"Jens Schlegel","date":"15. September 2023","format":false,"excerpt":"Einleitung Englisch spielt eine gro\u00dfe Rolle in meinem Beruf und Alltag, doch immer noch passieren mir Grammatikfehler. Um meine Englischkenntnisse zu verbessern, habe ich eine kleine Webseite entwickelt, auf der das Schreiben von englischen S\u00e4tzen ge\u00fcbt werden kann. Dem Nutzer wird ein Satz pr\u00e4sentiert, der dann in die festgelegte Sprache\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/allgemein\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2023\/09\/SCR-20230817-rdek_1694731446844_0.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2023\/09\/SCR-20230817-rdek_1694731446844_0.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2023\/09\/SCR-20230817-rdek_1694731446844_0.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2023\/09\/SCR-20230817-rdek_1694731446844_0.png?resize=700%2C400&ssl=1 2x"},"classes":[]},{"id":29008,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/07\/31\/frontend-anhand-eines-ultra-large-scale-systems-wie-uber\/","url_meta":{"origin":29471,"position":2},"title":"Frontend anhand eines Ultra-Large-Scale Systems wie Uber","author":"Yinying Shen","date":"31. July 2026","format":false,"excerpt":"Diese Arbeit wurde im Rahmen der Vorlesungsveranstaltung \u201eUltra Large Scale Systems\u201c erstellt. Abstract Ultra-Large-Scale Systems (ULSS) wie Uber stellen aufgrund ihrer hohen Nutzerzahlen, globalen Verteilung, gro\u00dfen Datenmengen und kontinuierlichen Weiterentwicklung besondere Anforderungen an die Frontend-Architektur. Diese Arbeit untersucht zentrale Architekturentscheidungen f\u00fcr das Frontend einer Uber-\u00e4hnlichen Anwendung. Dabei werden Component-based Architecture,\u2026","rel":"","context":"In &quot;System Architecture&quot;","block_context":{"text":"System Architecture","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/system-designs\/system-architecture\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/07\/fe_gesamt_arch-1.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/07\/fe_gesamt_arch-1.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/07\/fe_gesamt_arch-1.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/07\/fe_gesamt_arch-1.png?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/07\/fe_gesamt_arch-1.png?resize=1050%2C600&ssl=1 3x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/07\/fe_gesamt_arch-1.png?resize=1400%2C800&ssl=1 4x"},"classes":[]},{"id":28084,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2025\/09\/14\/springboot-zu-serverless-probleme-und-paradigmen\/","url_meta":{"origin":29471,"position":3},"title":"Springboot zu Serverless: Probleme und Paradigmen","author":"Julian Schniepp","date":"14. September 2025","format":false,"excerpt":"Im Rahmen der Vorlesung \u201eSoftware Development for Cloud\u00a0Computing\u201c sollte jedes Team ein eigenes Cloud\u2011Projekt umsetzen. Unser Projekt Taskflow sollte dabei ein serverloses Todo\u2011Management\u2011System werden. Ziel war es dabei, neue und vor allem industrierelevante Cloud\u2011Technologien praktisch zu erlernen. Der Backend\u2011Teil ist mit Spring\u2011Boot realisiert, welcher \u00fcber AWS\u00a0Lambda und API\u00a0Gateway bereitgestellt modular\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/allgemein\/"},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]},{"id":21693,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2021\/09\/20\/recall-trainer-eine-serverless-web-app-mit-aws\/","url_meta":{"origin":29471,"position":4},"title":"Recall Trainer &#8211;  Eine serverless Web-App mit AWS","author":"lr066","date":"20. September 2021","format":false,"excerpt":"Einleitung Im Rahmen der Vorlesung \u201cSoftware Development for Cloud Computing\u201d habe ich im vergangenen Semester eine Einf\u00fchrung in die Welt des Cloud Computings incl. der relevanten Konzepte und Technologien erhalten. Einige dieser Konzepte habe ich versucht in meinem Abschlussprojekt umzusetzen, das ich im Nachfolgenden vorstellen m\u00f6chte.\u00a0 Idee\/Projekt Die Idee war\u2026","rel":"","context":"In &quot;Cloud Technologies&quot;","block_context":{"text":"Cloud Technologies","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/scalable-systems\/cloud-technologies\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2021\/09\/signup1-150x150.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2021\/09\/signup1-150x150.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2021\/09\/signup1-150x150.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2021\/09\/signup1-150x150.png?resize=700%2C400&ssl=1 2x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2021\/09\/signup1-150x150.png?resize=1050%2C600&ssl=1 3x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2021\/09\/signup1-150x150.png?resize=1400%2C800&ssl=1 4x"},"classes":[]},{"id":28550,"url":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/2026\/02\/21\/entwicklung-einer-verteilten-cloud-anwendung-am-beispiel-eines-multiplayer-spiels\/","url_meta":{"origin":29471,"position":5},"title":"Entwicklung einer verteilten Cloud-Anwendung am Beispiel eines Multiplayer Spiels","author":"Tom Bestvater","date":"21. February 2026","format":false,"excerpt":"Einleitung Den meisten sollte das Spielprinzip von \u201cCookie Clicker\u201d bekannt sein: Ein Klick auf einen Keks erh\u00f6ht den Spielstand um einen Punkt. Das Spiel ist endlos, hat keine Punktegrenze. Es geht darum, im Leaderboard nach oben zu klettern. Im Rahmen der Vorlesung \u201cSystem Engineering and Management\u201d (143101a)\u00a0 erweiterten wir das\u2026","rel":"","context":"In &quot;Allgemein&quot;","block_context":{"text":"Allgemein","link":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/category\/allgemein\/"},"img":{"alt_text":"","src":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/02\/Auth-Flow-Diagram-1.png?resize=350%2C200&ssl=1","width":350,"height":200,"srcset":"https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/02\/Auth-Flow-Diagram-1.png?resize=350%2C200&ssl=1 1x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/02\/Auth-Flow-Diagram-1.png?resize=525%2C300&ssl=1 1.5x, https:\/\/i0.wp.com\/blog.mi.hdm-stuttgart.de\/wp-content\/uploads\/2026\/02\/Auth-Flow-Diagram-1.png?resize=700%2C400&ssl=1 2x"},"classes":[]}],"jetpack_sharing_enabled":true,"authors":[{"term_id":1272,"user_id":1339,"is_guest":0,"slug":"asim_jugo","display_name":"Asim Jugo","avatar_url":"https:\/\/secure.gravatar.com\/avatar\/ec7cb0f454852977eee500aad7ad25e2bf8a5f96a98c44dae1d0f31b2a8d156b?s=96&d=mm&r=g","author_category":"","user_url":"","last_name":"Jugo","first_name":"Asim","job_title":"","description":""}],"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/29471","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/users\/1339"}],"replies":[{"embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/comments?post=29471"}],"version-history":[{"count":7,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/29471\/revisions"}],"predecessor-version":[{"id":29523,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/posts\/29471\/revisions\/29523"}],"wp:attachment":[{"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/media?parent=29471"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/categories?post=29471"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/tags?post=29471"},{"taxonomy":"author","embeddable":true,"href":"https:\/\/blog.mi.hdm-stuttgart.de\/index.php\/wp-json\/wp\/v2\/ppma_author?post=29471"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}