Software Product Mastering / Produkt & Projekt / Methoden / Deliberating structures / Werkzeuge & Automatisierung
Architektur & Techstack von Webanwendungen¶
Architekturen¶
Im Kontext von Software bezeichnet Architektur die grundlegende Struktur und Organisation eines Softwaresystems. Sie umfasst Entscheidungen über Komponenten, deren Beziehungen zueinander, die Kommunikationswege und die übergreifenden Entwurfsmuster. Die Softwarearchitektur legt fest, wie die einzelnen Teile des Systems interagieren, welche Technologien und Frameworks eingesetzt werden, und stellt sicher, dass das System wartbar, erweiterbar und effizient bleibt. Architekturentscheidungen berücksichtigen häufig auch nicht-funktionale Anforderungen wie Skalierbarkeit, Sicherheit, Zuverlässigkeit und Performance.
Hier ist eine kurze Zusammenfassung der Architekturen für Webanwendungen:
1. Monolithische Architektur¶
- Beispiel: Traditionelles E-Commerce-System.
- Vorteile: Einfachheit, geringere Infrastrukturkosten.
- Nachteile: Schwer skalierbar, langsame Entwicklung.
2. Microservices-Architektur¶
- Beispiel: Social-Media-Netzwerk mit separaten Diensten.
- Vorteile: Hohe Skalierbarkeit, Flexibilität, Resilienz.
- Nachteile: Hohe Komplexität, Orchestrierung nötig, Datenkonsistenz schwierig.
3. Serverless-Architektur¶
- Beispiel: Echtzeit-Datenverarbeitung (z. B. AWS Lambda).
- Vorteile: Kosteneffizient, automatische Skalierung, schnelle Entwicklung.
- Nachteile: Abhängigkeit von Cloud-Anbietern, Latenzzeiten (Cold Starts).
4. Single-Page Application (SPA)¶
- Beispiel: Projektmanagement-Tool (z. B. Trello).
- Vorteile: Schnelle UX, offline-fähig, leicht auf Mobile übertragbar.
- Nachteile: SEO-Herausforderungen, längere Initial-Ladezeit.
5. Progressive Web Application (PWA)¶
- Beispiel: Twitter Lite.
- Vorteile: Plattformunabhängig, offline-fähig, kosteneffizient.
- Nachteile: Eingeschränkter API-Zugriff, Unterschiede je nach Browser.
6. Jamstack-Architektur¶
- Beispiel: Statischer Blog mit dynamischen Inhalten über API.
- Vorteile: Schnelle Ladezeiten, sicher, gut skalierbar.
- Nachteile: Weniger dynamisch, lange Build-Zeiten.
7. Multi-Page Application (MPA)¶
- Beispiel: CMS-Website wie WordPress.
- Vorteile: SEO-freundlich, einfache Navigation, hohe Browser-Kompatibilität.
- Nachteile: Langsame Benutzererfahrung, hohe Serverlast.
Die Wahl der Architektur hängt von den spezifischen Anforderungen und Einschränkungen der Anwendung ab.
Nochmal zum Nachlesen...
Es gibt verschiedene Architekturansätze für Webanwendungen, die sich in Struktur, Funktionalität und Entwicklungsansatz unterscheiden. Jede Architektur hat ihre eigenen Vor- und Nachteile und eignet sich je nach Anwendungsfall unterschiedlich gut. Hier sind die wichtigsten Architekturen von Webanwendungen:
1. Monolithische Architektur¶
In der monolithischen Architektur sind alle Teile der Anwendung (UI, Business-Logik, Datenbank) in einem einzigen, zusammenhängenden Codebasis vereint und werden als ein einziges Deployment-Paket bereitgestellt.
Beispiel¶
Ein traditionelles E-Commerce-System, bei dem das gesamte System in einer einzigen Anwendung läuft und von einem einzigen Server bereitgestellt wird.
Vorteile¶
- Einfachheit: Einfach zu entwickeln, testen und bereitstellen, da nur eine einzige Anwendung verwaltet wird.
- Geringere Komplexität: Alle Module sind in einem einzigen Code-Repository, was die Verwaltung und das Debuggen vereinfacht.
- Geringere Infrastrukturkosten: Da alle Komponenten auf einem Server laufen, werden oft weniger Ressourcen benötigt.
Nachteile¶
- Skalierbarkeit: Schwer skalierbar, da die gesamte Anwendung repliziert werden muss, selbst wenn nur ein Teil (z. B. die Datenbank) mehr Ressourcen benötigt.
- Deployment: Ein Fehler in einem Teil der Anwendung kann die gesamte Anwendung lahmlegen.
- Langsame Entwicklung: Änderungen an einem Modul können unbeabsichtigte Auswirkungen auf andere Module haben, was zu einer langsameren Entwicklung führen kann.
2. Microservices-Architektur¶
In einer Microservices-Architektur wird die Anwendung in unabhängige, lose gekoppelte Dienste aufgeteilt, die separat entwickelt, bereitgestellt und skaliert werden können. Jeder Service hat in der Regel seine eigene Datenbank und ist für eine bestimmte Funktion verantwortlich.
Beispiel¶
Ein Social-Media-Netzwerk, bei dem die Dienste für Nutzerprofile, Posts, Benachrichtigungen und Suchfunktion separat entwickelt und verwaltet werden.
Vorteile¶
- Skalierbarkeit: Jeder Microservice kann unabhängig skaliert werden, basierend auf seinen Anforderungen.
- Flexibilität: Verschiedene Technologien können für verschiedene Services verwendet werden, die am besten für deren Bedürfnisse geeignet sind.
- Resilienz: Ein Fehler in einem Microservice beeinträchtigt nicht notwendigerweise die gesamte Anwendung.
Nachteile¶
- Komplexität: Erhöhte Komplexität bei der Entwicklung und Verwaltung von mehreren Services, einschließlich der Notwendigkeit eines guten Kommunikationsmechanismus.
- Deployment: Mehrere Services bedeuten oft, dass eine umfassendere Orchestrierung wie Kubernetes oder Docker Swarm notwendig ist.
- Datenkonsistenz: Herausforderungen bei der Aufrechterhaltung der Datenkonsistenz über verschiedene Datenbanken hinweg.
3. Serverless-Architektur¶
In einer Serverless-Architektur wird die Infrastruktur von einem Cloud-Anbieter verwaltet, und der Entwickler konzentriert sich auf das Schreiben der Geschäftslogik. Anwendungen bestehen aus Funktionen, die nur ausgeführt werden, wenn sie benötigt werden (Event-Driven-Architecture).
Beispiel¶
Ein System zur Echtzeit-Datenverarbeitung, das auf AWS Lambda basiert und bei bestimmten Ereignissen (z. B. wenn eine Datei hochgeladen wird) Funktionen ausführt.
Vorteile¶
- Kosteneffizienz: Abrechnung erfolgt nur für die tatsächliche Ausführungszeit, was Kosten spart.
- Skalierbarkeit: Automatische Skalierung, da der Anbieter für die Verwaltung der Infrastruktur sorgt.
- Schnelle Entwicklung: Der Fokus liegt nur auf der Geschäftslogik, wodurch Entwicklungszeit gespart wird.
Nachteile¶
- Abhängigkeit von Cloud-Anbietern: Bindung an bestimmte Cloud-Anbieter und deren API-Struktur.
- Eingeschränkte Kontrolle: Weniger Kontrolle über die Infrastruktur und begrenzte Anpassungsmöglichkeiten.
- Latenzzeit: Bei nicht häufig genutzten Funktionen kann es eine kleine Verzögerung geben, die als „Cold Start“ bezeichnet wird.
4. Single-Page Application (SPA)¶
SPAs laden die gesamte Anwendung in einem einzigen HTML-Dokument, und die Navigation erfolgt durch dynamische Aktualisierungen von Teilbereichen der Seite. SPAs kommunizieren oft über eine API mit dem Backend und nutzen Technologien wie AJAX oder WebSockets.
Beispiel¶
Ein Projektmanagement-Tool wie Trello oder Asana, das in einer einzigen Seite läuft und verschiedene Komponenten (z. B. Boards, Listen, Karten) dynamisch nachlädt.
Vorteile¶
- Benutzererfahrung: Reibungslose, schnelle Benutzererfahrung ohne ständige Nachladen der Seite.
- Offline-Fähigkeit: SPAs können mit lokalen Caches und Service-Worker-Technologien auch offline funktionieren.
- Mobile Anwendungen: Einfacher Übergang zu mobilen Plattformen, da die Logik im Frontend zentriert ist.
Nachteile¶
- SEO: Schwieriger zu optimieren für Suchmaschinen, da der Inhalt dynamisch geladen wird.
- Ladezeit: Initiale Ladezeit kann höher sein, da die gesamte Anwendung geladen wird.
- Browser-Kompatibilität: Komplexe SPAs können je nach Browser Unterschiede im Verhalten aufweisen.
5. Progressive Web Application (PWA)¶
PWAs kombinieren die Vorteile von SPAs mit mobilen Anwendungen. Sie laufen im Browser, können aber wie native Apps auf dem Smartphone installiert und offline verwendet werden.
Beispiel¶
Twitter Lite, eine PWA-Version von Twitter, die im Browser oder als App genutzt werden kann und offline funktioniert.
Vorteile¶
- Plattformunabhängigkeit: PWAs laufen in jedem modernen Browser und funktionieren auf mobilen Geräten wie eine native App.
- Offline-Fähigkeit: Durch Nutzung von Service Workern können PWAs Inhalte auch offline bereitstellen.
- Kostenersparnis: Einmalige Entwicklung für alle Plattformen anstelle von separaten mobilen und Web-Versionen.
Nachteile¶
- Eingeschränkter Zugriff auf Geräte-APIs: Nicht alle Funktionen (z. B. Hardwarezugriff) sind auf allen Geräten oder Browsern möglich.
- Browser-Abhängigkeit: Unterschiedliche Browser können PWAs unterschiedlich unterstützen.
- SEO und Performance: Ähnlich wie bei SPAs können auch PWAs Herausforderungen in der SEO und Performance haben.
6. Jamstack-Architektur¶
Jamstack basiert auf der Trennung von Frontend und Backend, wobei der Frontend-Code statisch generiert wird und Inhalte über APIs und Microservices eingebunden werden. Die Buchstaben „JAM“ stehen für JavaScript, APIs und Markup.
Beispiel¶
Ein Blog oder Content-Website, die auf statischen Seiten basiert und nur für dynamische Inhalte API-Aufrufe durchführt, z. B. mit Next.js oder Gatsby.
Vorteile¶
- Performance: Sehr schnell, da statische Seiten direkt vom CDN bereitgestellt werden.
- Sicherheit: Geringere Angriffsfläche, da kein Backend direkt verfügbar ist.
- Skalierbarkeit: Automatische Skalierbarkeit, da nur statische Dateien ausgeliefert werden.
Nachteile¶
- Einschränkungen bei dynamischen Inhalten: Für häufige Updates oder sehr dynamische Inhalte ist Jamstack weniger geeignet.
- Build-Zeit: Bei großen Websites kann die Build-Zeit, um neue Inhalte zu generieren, hoch sein.
- Komplexität bei hybriden Ansätzen: Die Kombination von statischen und dynamischen Inhalten kann zusätzliche Komplexität erfordern.
7. Multi-Page Application (MPA)¶
Eine Multi-Page Application lädt für jede Seite eine neue HTML-Datei. Jede Interaktion, die eine andere Seite benötigt, führt zu einem vollständigen Neuladen der Seite.
Beispiel¶
Traditionelle CMS-basierte Websites wie WordPress-Seiten, bei denen jede Seite separat geladen wird.
Vorteile¶
- SEO-freundlich: Jede Seite hat eine eigene URL und kann leicht für Suchmaschinen optimiert werden.
- Einfache Navigation: Benutzer können mithilfe der URL gezielt auf jede Seite zugreifen.
- Browser-Kompatibilität: Standardstruktur für Webanwendungen, die in allen Browsern gut funktioniert.
Nachteile¶
- Langsamere Benutzererfahrung: Da die Seite für jede Navigation neu geladen wird, kann die Benutzererfahrung langsamer sein.
- Erhöhter Server-Aufwand: Jede Anfrage erfordert einen neuen Seitenaufruf und kann die Serverlast erhöhen.
- Komplexere Benutzerinteraktionen: Dynamische und interaktive Benutzerinteraktionen können schwerer zu implementieren sein als in SPAs.
Jede Architektur hat ihre Stärken und Schwächen, und die Wahl hängt von den spezifischen Anforderungen der Anwendung, dem erwarteten Nutzerverhalten, den Budget- und Zeitvorgaben ab.
Beliebte Techstacks¶
Ein Techstack im Software-Kontext bezeichnet die Kombination von Technologien, Programmiersprachen, Frameworks, Tools und Diensten, die verwendet werden, um eine Softwareanwendung oder -plattform zu entwickeln, zu betreiben und zu verwalten. Er setzt sich meist aus dem Backend (Server-seitige Logik, z.B. Node.js, Python, .NET), dem Frontend (Client-seitige Darstellung, z.B. React, Angular, Vue.js) und der Datenbank (z.B. PostgreSQL, MongoDB) zusammen. Der Techstack gibt Aufschluss darüber, welche Technologien zusammenarbeiten, um die Funktionalität, Performance und Skalierbarkeit der Software sicherzustellen.
Hier ist eine kurze, stichpunktartige Zusammenfassung der aktuellen beliebten Tech-Stacks:
1. MEAN Stack (MongoDB, Express.js, Angular, Node.js)¶
- Backend: Node.js, Express.js
- Frontend: Angular
- Datenbank: MongoDB (NoSQL)
- Vorteile: Einheitliche Programmiersprache (JavaScript), moderne Architektur, hohe Skalierbarkeit
- Einsatz: Echtzeitkommunikation, Single-Page-Anwendungen, APIs
2. MERN Stack (MongoDB, Express.js, React, Node.js)¶
- Backend: Node.js, Express.js
- Frontend: React
- Datenbank: MongoDB (NoSQL)
- Vorteile: Flexibilität bei der UI, Wiederverwendbare Komponenten, schnelle Datenaktualisierung
- Einsatz: Social Media, Dashboards, interaktive UIs
3. LAMP Stack (Linux, Apache, MySQL, PHP)¶
- Backend: PHP
- Webserver: Apache
- Datenbank: MySQL (relational)
- Betriebssystem: Linux
- Vorteile: Stabilität, Open-Source, bewährte Lösung
- Einsatz: CMS, Blogs, Unternehmenswebsites
4. JAMstack (JavaScript, APIs, Markup)¶
- Frontend: JavaScript
- Backend: APIs (serverlos)
- Markup: Statische Seiten
- Vorteile: Schnelle Ladezeiten, hohe Skalierbarkeit, bessere Sicherheit
- Einsatz: Blogs, Marketingseiten, Portfolio-Seiten
5. .NET Stack (C#, ASP.NET Core, Azure)¶
- Backend: ASP.NET Core
- Programmiersprache: C#
- Cloud: Azure
- Vorteile: Hohe Performance, Cross-Platform, Sicherheitsfunktionen
- Einsatz: Unternehmensanwendungen, APIs, komplexe Backend-Systeme
Fazit:¶
- MERN/MEAN: Für moderne Webanwendungen mit JavaScript.
- JAMstack: Für schnelle, skalierbare, statische Websites.
- LAMP: Für klassische Webanwendungen und Content-Management-Systeme.
- .NET: Für robuste, skalierbare Unternehmenslösungen.
Nochmal zum Nachlesen...
Die Wahl des Tech-Stacks ist eine der wichtigsten Entscheidungen bei der Softwareentwicklung, da sie direkten Einfluss auf die Skalierbarkeit, Wartbarkeit, Sicherheit und Performance einer Anwendung hat. Hier ist eine detailliertere Erklärung der aktuell beliebtesten Tech-Stacks und ihrer Anwendungsfälle:
1. MEAN Stack (MongoDB, Express.js, Angular, Node.js)¶
- Beschreibung:
- MongoDB: Eine NoSQL-Datenbank, die sich durch Flexibilität und Skalierbarkeit auszeichnet. Sie speichert Daten in JSON-ähnlichen Dokumenten und eignet sich hervorragend für dynamische Datenmodelle.
- Express.js: Ein minimalistisches und flexibles Web-Framework für Node.js, das eine einfache Verwaltung von Routen und Middleware ermöglicht.
- Angular: Ein Frontend-Framework von Google, das eine strukturierte Lösung für die Erstellung von Single-Page-Anwendungen (SPAs) bietet. Es verwendet TypeScript und ist bekannt für seine Zwei-Wege-Datenbindung und umfangreiche Entwickler-Tools.
- Node.js: Ein JavaScript-basiertes Backend-Framework, das serverseitige JavaScript-Anwendungen ausführt und aufgrund seiner hohen Performance und Skalierbarkeit oft für Echtzeitanwendungen und APIs verwendet wird.
- Vorteile:
- Einheitliche Sprache: Da sowohl das Frontend als auch das Backend in JavaScript entwickelt werden, müssen Entwickler nur eine Sprache beherrschen, was die Lernkurve reduziert.
- Moderne Architektur: Der Stack ist ideal für moderne Webanwendungen und SPAs, bei denen schnelle Interaktivität und Datenaktualisierungen erforderlich sind.
- Skalierbarkeit: Besonders geeignet für Anwendungen, die schnell skalieren müssen, da Node.js eine hohe Performance in stark parallelen Prozessen bietet.
- Einsatzgebiete: Echtzeitkommunikation (Chats, Benachrichtigungen), Single-Page-Anwendungen (SPAs), RESTful APIs.
2. MERN Stack (MongoDB, Express.js, React, Node.js)¶
- Beschreibung:
- MongoDB: Siehe oben.
- Express.js: Siehe oben.
- React.js: Eine JavaScript-Bibliothek von Facebook, die zur Erstellung von Benutzeroberflächen verwendet wird. React ist komponentenbasiert und ermöglicht es Entwicklern, wiederverwendbare UI-Elemente zu erstellen. React ist bekannt für seine Virtual DOM-Technologie, die die Performance von dynamischen Webanwendungen erheblich verbessert.
- Node.js: Siehe oben.
- Vorteile:
- Flexible UI: Im Vergleich zu Angular bietet React mehr Flexibilität bei der Gestaltung der Benutzeroberfläche. Entwickler können entscheiden, wie sie die Anwendung strukturieren möchten.
- Wiederverwendbare Komponenten: Die komponentenbasierte Struktur von React erleichtert das Wiederverwenden von Code und spart Entwicklungszeit.
- Echtzeit-Datenaktualisierung: React ermöglicht eine schnelle Reaktion auf Datenänderungen ohne komplette Seitenaktualisierungen, was es ideal für dynamische Webanwendungen macht.
- Einsatzgebiete: Social Media Apps, Dashboard-Anwendungen, interaktive Benutzeroberflächen.
3. LAMP Stack (Linux, Apache, MySQL, PHP)¶
- Beschreibung:
- Linux: Ein Open-Source-Betriebssystem, das als Grundlage für Server- und Webanwendungen dient. Es bietet Stabilität und Sicherheit.
- Apache: Ein weit verbreiteter Webserver, der HTTP-Anfragen verarbeitet und mit verschiedenen Programmiersprachen zusammenarbeitet.
- MySQL: Eine der beliebtesten relationalen Datenbanken, die für strukturierte Daten und komplexe Abfragen verwendet wird.
- PHP: Eine serverseitige Skriptsprache, die hauptsächlich für die Entwicklung von dynamischen Webanwendungen und Content-Management-Systemen (wie WordPress) genutzt wird.
- Vorteile:
- Stabilität und Sicherheit: Der LAMP-Stack ist ein bewährtes Setup, das seit vielen Jahren in der Webentwicklung eingesetzt wird. Es bietet Stabilität und viele Tools für die Verwaltung von Webanwendungen.
- Kostenlos und Open-Source: Alle Komponenten des LAMP-Stacks sind Open-Source und kostenlos, was ihn besonders für kleine Unternehmen und Startups attraktiv macht.
- Reife und Community: Es gibt eine riesige Entwicklergemeinschaft, die viele Ressourcen und Tutorials zur Verfügung stellt.
- Einsatzgebiete: Content-Management-Systeme (CMS), Blogs, Unternehmenswebsites, Foren.
4. JAMstack (JavaScript, APIs, Markup)¶
- Beschreibung:
- JavaScript: Wie bei anderen modernen Webtechnologien wird JavaScript für die interaktive Benutzeroberfläche und die dynamische Logik auf der Seite verwendet.
- APIs: JAMstack setzt auf serverlose Architekturen, bei denen alle Backend-Operationen über APIs abgewickelt werden. Dies kann mit verschiedenen externen Diensten wie Datenbanken, Authentifizierung und Zahlungsdiensten erfolgen.
- Markup: Statt dynamischer Seiteninhalte werden statische Seiten mit generierten Markup-Dateien ausgeliefert, was zu schnelleren Ladezeiten führt.
- Vorteile:
- Geschwindigkeit: Da viele Daten statisch vorgerendert und über APIs geladen werden, sind JAMstack-Anwendungen sehr schnell und bieten eine ausgezeichnete Benutzererfahrung.
- Skalierbarkeit: Da statische Seiten auf Content Delivery Networks (CDNs) ausgeliefert werden, lassen sich JAMstack-Anwendungen sehr leicht skalieren.
- Sicherheit: Weniger serverseitige Logik bedeutet weniger Angriffsflächen.
- Einsatzgebiete: Blogs, Marketingseiten, E-Commerce-Seiten, Portfolio-Seiten.
5. .NET Stack (C#, ASP.NET Core, Azure)¶
- Beschreibung:
- C#: Eine objektorientierte Programmiersprache, die von Microsoft entwickelt wurde und sich hervorragend für die Entwicklung von Unternehmenslösungen eignet.
- ASP.NET Core: Ein leistungsstarkes Framework für Webanwendungen, das eine schnelle Entwicklung von APIs und Websites ermöglicht. Es ist plattformübergreifend und kann auf Windows, Linux und macOS betrieben werden.
- Azure: Microsofts Cloud-Plattform, die eine breite Palette von Diensten für Infrastruktur, Datenbanken, Anwendungen und mehr bietet.
- Vorteile:
- Leistung: ASP.NET Core ist bekannt für seine hohe Performance und Skalierbarkeit, was es ideal für große Unternehmen und hochperformante Anwendungen macht.
- Cross-Platform: Mit .NET Core können Anwendungen auf verschiedenen Betriebssystemen ausgeführt werden, was die Flexibilität erhöht.
- Sicherheit: Microsoft bietet robuste Sicherheitsfunktionen für die Entwicklung von sicheren Anwendungen.
- Einsatzgebiete: Unternehmensanwendungen, SaaS-Produkte, APIs, komplexe Backend-Systeme.
Fazit:¶
Die Wahl des Tech-Stacks hängt von verschiedenen Faktoren wie Projektanforderungen, Budget, Team-Erfahrung und Skalierbarkeit ab. Aktuell sind insbesondere MERN (React.js) und MEAN (Angular) für moderne Webanwendungen sehr beliebt, weil sie eine vollständige JavaScript-Lösung für Frontend und Backend bieten. JAMstack gewinnt auch an Popularität, insbesondere für Websites, die schnelle Ladezeiten und einfache Skalierbarkeit benötigen. Für komplexe und skalierbare Unternehmenslösungen bleibt der .NET Stack eine ausgezeichnete Wahl.
Spielerisch eine Architektur wählen¶
Hier ist ein Beispiel, das eine spielerische Entscheidungsfindung für eine Webanwendungsarchitektur ermöglicht. Es enthält eine interaktive, Frage-basierte Auswahl, die den Benutzer durch die wichtigsten Merkmale der Architekturen führt und am Ende eine Empfehlung gibt.
# Architektur-Auswahl-Notebook
# Ziel: Benutzerfreundliche Entscheidungsfindung für eine Webanwendungsarchitektur
# Import notwendiger Bibliotheken
from ipywidgets import widgets
from IPython.display import display, Markdown
# Begrüßung und Einführung
display(Markdown("### Willkommen zur spielerischen Auswahl einer Webanwendungsarchitektur!"))
display(Markdown("Beantworte die folgenden Fragen, um eine Architektur zu finden, die zu deinem Projekt passt."))
# Eingabefragen
questions = [
("Wie wichtig ist die Skalierbarkeit?", ["Sehr wichtig", "Mittelwichtig", "Eher unwichtig"]),
("Welche Kontrolle benötigst du über die Infrastruktur?", ["Vollständige Kontrolle", "Mittlere Kontrolle", "Kaum Kontrolle"]),
("Soll die Anwendung offline funktionieren?", ["Ja", "Nein"]),
("Welche Art von Benutzerinteraktion ist vorgesehen?", ["Interaktiv mit hoher Leistung", "Standard", "Wenig interaktiv"]),
("Wie flexibel muss die Anwendung bezüglich neuer Technologien sein?", ["Sehr flexibel", "Mittel", "Kaum wichtig"]),
("Ist SEO für die Anwendung entscheidend?", ["Ja", "Nicht so wichtig"]),
]
# Antwortverarbeitung
answers = {}
# Fragewidgets erstellen
for i, (question, options) in enumerate(questions):
print(question)
answers[i] = widgets.RadioButtons(
options=options,
description="",
disabled=False
)
display(answers[i])
# Architekturentscheidungslogik
def recommend_architecture(*args):
# Antwortwerte sammeln
user_answers = [answer.value for answer in answers.values()]
# Empfehlung basierend auf Antworten
if user_answers == ["Sehr wichtig", "Vollständige Kontrolle", "Nein", "Interaktiv mit hoher Leistung", "Sehr flexibel", "Nicht so wichtig"]:
recommendation = "Microservices-Architektur"
elif user_answers == ["Mittelwichtig", "Mittlere Kontrolle", "Ja", "Interaktiv mit hoher Leistung", "Mittel", "Nicht so wichtig"]:
recommendation = "Single-Page Application (SPA)"
elif user_answers == ["Sehr wichtig", "Kaum Kontrolle", "Nein", "Wenig interaktiv", "Kaum wichtig", "Ja"]:
recommendation = "Jamstack-Architektur"
elif user_answers == ["Sehr wichtig", "Mittlere Kontrolle", "Ja", "Standard", "Mittel", "Ja"]:
recommendation = "Progressive Web Application (PWA)"
elif user_answers == ["Eher unwichtig", "Vollständige Kontrolle", "Nein", "Wenig interaktiv", "Kaum wichtig", "Ja"]:
recommendation = "Multi-Page Application (MPA)"
else:
recommendation = "Monolithische Architektur"
# Empfehlung ausgeben
display(Markdown(f"**Empfohlene Architektur:** {recommendation}"))
display(Markdown(f"Diese Architektur könnte zu deinem Projekt passen!"))
# Button zur Entscheidung
decision_button = widgets.Button(description="Entscheidung anzeigen")
decision_button.on_click(recommend_architecture)
# Button anzeigen
display(decision_button)
Willkommen zur spielerischen Auswahl einer Webanwendungsarchitektur!¶
Beantworte die folgenden Fragen, um eine Architektur zu finden, die zu deinem Projekt passt.
Wie wichtig ist die Skalierbarkeit?
RadioButtons(options=('Sehr wichtig', 'Mittelwichtig', 'Eher unwichtig'), value='Sehr wichtig')
Welche Kontrolle benötigst du über die Infrastruktur?
RadioButtons(options=('Vollständige Kontrolle', 'Mittlere Kontrolle', 'Kaum Kontrolle'), value='Vollständige K…
Soll die Anwendung offline funktionieren?
RadioButtons(options=('Ja', 'Nein'), value='Ja')
Welche Art von Benutzerinteraktion ist vorgesehen?
RadioButtons(options=('Interaktiv mit hoher Leistung', 'Standard', 'Wenig interaktiv'), value='Interaktiv mit …
Wie flexibel muss die Anwendung bezüglich neuer Technologien sein?
RadioButtons(options=('Sehr flexibel', 'Mittel', 'Kaum wichtig'), value='Sehr flexibel')
Ist SEO für die Anwendung entscheidend?
RadioButtons(options=('Ja', 'Nicht so wichtig'), value='Ja')
Button(description='Entscheidung anzeigen', style=ButtonStyle())
Empfohlene Architektur: Monolithische Architektur
Diese Architektur könnte zu deinem Projekt passen!
Funktionsweise des Notebooks¶
- Fragen: Der Benutzer beantwortet mehrere Fragen, die auf den Anforderungen und Zielen der Webanwendung basieren (z. B. Skalierbarkeit, Kontrolle, SEO).
- Architekturentscheidungslogik: Basierend auf den Antworten wird eine Architektur empfohlen.
- Ausgabe: Der Benutzer erhält eine Empfehlung, die den passenden Architekturansatz für das Projekt vorschlägt.
Dieses Notebook kann leicht angepasst werden, um weitere Kriterien und Architekturen hinzuzufügen.