Wie kann eine Single Page Application mit dem Architektur Muster MVC umgesetzt werden? Die Antwort erfolgt in dieser Arbeit prototypisch am Beispiel des JavaScript Frameworks AngularJS.
Weltweit verwenden immer mehr Menschen das Internet. Das belegt die Studie von International Telecommunication Union (ITU) die besagt, dass die Anzahl 2005 noch bei 1 Milliarden und 2017 bereits 3,9 Milliarden Benutzern lag. Auch die Nutzungsdauer des Internet ist gestiegen. 2005 lag sie in Deutschland bei 46 Minuten am Tag und hat sich 2018 mit 196 Minuten mehr als vervierfacht. Daraus kann abgeleitet werden, dass die Auslastung der Webserver stetig steigt. Um diese Auslastung zu senken, können Single Page Applications (SPA), welche nur teilweise den Inhalt der Seite nachladen, verwendet werden.
Ein weitere Herausforderung ist, dass die Anforderungen der User an die Webseiten immer größer werden. Schlagwörter sind User Experience (UX) und Usability. Ersteres beschreibt das subjektive Nutzererlebnis, Usability hingegen die Benutzbarkeit der Webseiten. Durch die Umsetzung der Anforderungen, steigt die Komplexität der Webanwendung und in Folge dessen die des Programmcodes. Um einen komplexen Programmcode zu entwickeln, zu testen und zu warten, sollten bestimmte Architekturmuster eingehalten werden. Dies kann durch das MVC Muster erreicht werden, welches die Programmkomponenten in Model, View und Controller unterteilt. Somit ist eine Single Page Applikation mit einem MVC Muster geeignet, um die oben genannten Herausforderungen zu adressieren. Ob die Kombination umsetzbar ist, soll in dieser Hausarbeit herausgearbeitet werden.
Inhaltsverzeichnis
- 1. Einleitung
- 1.1 Problemstellung
- 1.2 Motivation
- 1.3 Forschungsfrage
- 1.4 Ziel und Aufbau der Arbeit
- 2. Einführung in Angular
- 2.1 HTML und CSS
- 2.2 JavaScript
- 2.3 MVC
- 2.4 Single Page Application (SPA)
- 2.5 Angular
- 3. Hauptteil
- 3.1 Methodisches Vorgehen
- 3.2 Implementierungsgrundlagen
- 3.2.1 Ordnerstruktur
- 3.2.2 Extern eingebundene Inhalte
- 3.3 Implementierung View
- 3.3.1 Index.html
- 3.3.2 home.html
- 3.3.3 game.html
- 3.4 Implementierung Controller
- 3.4.1 game.js
- 3.4.2 controller.js
- 3.4.3 service.js
- 3.5 Auswertung und Diskussion
- 4. Schluss
- 4.1 Fazit
- 4.2 Reflektion
Zielsetzung und Themenschwerpunkte
Diese Hausarbeit untersucht die Konzeption und Implementierung einer Single Page Application (SPA) mit AngularJS. Das Ziel ist es, die Herausforderungen der steigenden Internetnutzung und der wachsenden Anforderungen an die User Experience (UX) von Webseiten zu adressieren, indem eine effiziente und gut strukturierte Webanwendung entwickelt wird. Die Arbeit beleuchtet die Anwendbarkeit des MVC-Musters in diesem Kontext.
- Steigende Internetnutzung und Serverauslastung
- Anforderungen an User Experience (UX) und Usability
- Anwendung des MVC-Musters in SPAs
- Implementierung einer SPA mit AngularJS
- Bewertung der entwickelten Lösung
Zusammenfassung der Kapitel
1. Einleitung: Die Einleitung beschreibt die Problemstellung der steigenden Internetnutzung und der damit verbundenen Herausforderungen für Webserver. Die zunehmende Komplexität von Webanwendungen und die Bedeutung von User Experience werden hervorgehoben. Die Arbeit motiviert die Untersuchung der Kombination aus Single Page Application (SPA) und dem Model-View-Controller (MVC) Architekturmuster als mögliche Lösung für diese Herausforderungen. Die Forschungsfrage und die Struktur der Arbeit werden definiert.
2. Einführung in Angular: Dieses Kapitel liefert einen Überblick über die relevanten Technologien. Es werden die Grundlagen von HTML, CSS und JavaScript erläutert, gefolgt von einer Einführung in das MVC-Muster und dem Konzept der Single Page Application (SPA). Abschließend wird AngularJS als Framework für die Entwicklung von SPAs vorgestellt und seine Kernfunktionen werden kurz beschrieben.
3. Hauptteil: Der Hauptteil der Arbeit dokumentiert das methodische Vorgehen bei der Entwicklung der SPA. Es wird detailliert auf die Implementierungsgrundlagen eingegangen, einschließlich der Ordnerstruktur und der Einbindung externer Inhalte. Die Implementierung der View (mit Beispielen wie index.html, home.html und game.html), des Controllers und des Service wird Schritt für Schritt beschrieben. Abschließend erfolgt eine Auswertung und Diskussion der Implementierung.
Schlüsselwörter
Single Page Application (SPA), AngularJS, MVC-Muster, Webentwicklung, User Experience (UX), Usability, JavaScript, HTML, CSS, Implementierung, Webserverauslastung, methodisches Vorgehen.
Häufig gestellte Fragen (FAQ) zur Hausarbeit: Single Page Application mit AngularJS
Was ist das Thema dieser Hausarbeit?
Die Hausarbeit befasst sich mit der Konzeption und Implementierung einer Single Page Application (SPA) mit AngularJS. Sie untersucht die Anwendung des MVC-Musters im Kontext von SPAs zur Bewältigung der Herausforderungen steigender Internetnutzung und wachsender Anforderungen an die User Experience (UX).
Welche Ziele werden in der Hausarbeit verfolgt?
Das Hauptziel ist die Entwicklung einer effizienten und gut strukturierten Webanwendung, die die Herausforderungen der steigenden Internetnutzung und der Anforderungen an die UX adressiert. Die Arbeit beleuchtet dabei die Anwendbarkeit des MVC-Musters in diesem Kontext und bewertet die entwickelte Lösung.
Welche Themenschwerpunkte werden behandelt?
Die Arbeit konzentriert sich auf die steigende Internetnutzung und Serverauslastung, die Anforderungen an User Experience (UX) und Usability, die Anwendung des MVC-Musters in SPAs, die Implementierung einer SPA mit AngularJS und die Bewertung der entwickelten Lösung.
Welche Technologien werden verwendet?
Die Hausarbeit verwendet AngularJS als Framework für die Entwicklung der SPA. Zusätzlich werden die Grundlagen von HTML, CSS und JavaScript behandelt.
Wie ist die Hausarbeit strukturiert?
Die Arbeit ist in vier Kapitel gegliedert: Einleitung (Problemstellung, Motivation, Forschungsfrage, Ziel und Aufbau), Einführung in Angular (HTML, CSS, JavaScript, MVC, SPA, AngularJS), Hauptteil (methodisches Vorgehen, Implementierung – View, Controller, Service, Auswertung und Diskussion) und Schluss (Fazit, Reflektion).
Was wird im Hauptteil der Arbeit beschrieben?
Der Hauptteil dokumentiert detailliert das methodische Vorgehen bei der Entwicklung der SPA. Es wird die Implementierungsgrundlagen (Ordnerstruktur, externe Inhalte), die Implementierung der View (index.html, home.html, game.html), des Controllers und des Service Schritt für Schritt erläutert. Eine abschließende Auswertung und Diskussion der Implementierung wird ebenfalls präsentiert.
Welche Schlüsselwörter beschreiben den Inhalt der Arbeit?
Schlüsselwörter sind: Single Page Application (SPA), AngularJS, MVC-Muster, Webentwicklung, User Experience (UX), Usability, JavaScript, HTML, CSS, Implementierung, Webserverauslastung, methodisches Vorgehen.
Wo finde ich detaillierte Informationen zur Implementierung?
Der Hauptteil der Hausarbeit beschreibt detailliert die Implementierung der SPA, inklusive der Ordnerstruktur, der Einbindung externer Inhalte und der Implementierung von View, Controller und Service mit konkreten Beispielen (z.B. game.js, controller.js, service.js, index.html, home.html, game.html).
Welche Probleme werden in der Einleitung angesprochen?
Die Einleitung thematisiert die steigende Internetnutzung und die damit verbundenen Herausforderungen für Webserver, die zunehmende Komplexität von Webanwendungen und die Bedeutung der User Experience.
Welche Schlussfolgerungen werden gezogen?
Das Fazit und die Reflektion im Schlusskapitel fassen die Ergebnisse der Arbeit zusammen und reflektieren den Entwicklungsprozess und die erzielten Ergebnisse.
- Quote paper
- Dominik Horwath (Author), 2019, Konzept und Implementierung einer Single Page Application mit AngularJS, Munich, GRIN Verlag, https://www.grin.com/document/501302
