Refine
Document Type
- Bachelor Thesis (12)
- Master's Thesis (2)
Language
- German (14) (remove)
Has Fulltext
- yes (14)
Is part of the Bibliography
- no (14) (remove)
Keywords
- JavaScript (14) (remove)
Institute
Open Access
- Closed Access (10)
- Closed (2)
- Open Access (2)
Zu Beginn dieser Arbeit wurde das Problem beschrieben, dass das Ersetzen von einzelnen Modulen innerhalb TYPO3s durch React bisher nicht möglich war. Dadurch ergab sich die Aufgabe eine Lösung zu finden, mit der die Vorteile von React in TYPO3 eingebracht werden können, möglichst ohne große Veränderungen und Aufwände zu betreiben. Als zusätzliche Anforderung wurde definiert, dass React in TypeScript geschrieben werden soll.
Um dem Leser dieser Arbeit die Möglichkeit zu geben, den angefertigten Code verstehen und interpretieren zu können, wurden zunächst Grundlagen in TypeScript, React und TYPO3 geschaffen. Daraufhin wurde der Ist-Stand beschrieben, welcher ein simples TYPO3-Plugin beschreibt. Dies wurde für die grundsätzliche Umwandlung in React möglichst simpel gehalten, war dennoch mit einigen Grundsätzen wie AJAX und Rerendering ausgestattet, um gewisse Vorteile und Problematiken bei der Umsetzung aufzeigen zu können. Daraus ergab sich ein Soll-Stand, welcher zugleich weitere Anforderungen an die spätere Lösung definierte.
Um ein mögliches Lösungskonzept erarbeiten zu können wurden im Kapitel „Stand der Technik“ 2 verwandte Arbeiten und Möglichkeiten vorgestellt. Daraufhin wurden die beiden zu entwickelnden Plugins beschrieben, zunächst das Dummy-TYPO3-Plugin, gefolgt vom in React entwickelten Äquivalent.
In Kapitel 8 wurde ein Konzept erstellt und daraufhin die Umsetzung Schritt für Schritt durchgeführt. Dabei konnte erfolgreich React in TYPO3 aufgesetzt und zur Entwicklung genutzt werden. Das Dummy-Plugin konnte ohne größere Probleme umgesetzt werden und zeigte somit eine mögliche Lösung für die Umwandlung von TYPO3 zu React auf. Um diese Lösung zu validieren, wurde im Folgekapitel das ProofOfConcept entwickelt. Dabei handelte es sich um ein produktiv eingesetztes Projekt, welches auf einer älteren Version basiert und verschiedene Anforderungen mitbrachte. Dies wurde nach Vorstellung des Projektes und Lösungskonzept Schritt für Schritt umgesetzt.
Evaluierung neuer HTML5- und JavaScript-Technologien bei der Nutzung in heterogenen Umgebungen
(2012)
Die 1&1 Internet AG in Karlsruhe betreibt einen Onlinespeicher, der von Kunden der diversen Tochter- und Schwestergesellschaften hauptsächlich über ein Browserfrontend bedient wird. Dieses kommuniziert mittels einer definierten JSON-Schnittstelle mit der auf Java basierenden Middleware. Da der Client schon vor einigen Jahren entwickelt wurde, nutzt er noch nicht alle Möglichkeiten die HTML5 in aktuellen Browsern bietet. Die Beschreibung und Bewertung dieser Möglichkeiten stellt die Kernaufgabe der Thesis dar. Einer der Schwerpunkt soll dabei auf der Offlinefähigkeit und intelligenten Benutzung von Caching- & Sync-Strategien zwischen Onlineanwendung und Offlineclient bestehen. Desweiteren sollen die Möglichkeiten von aktuellen Browsern ohne Beachtung der Rückwärtskompatibilität zu älteren Browsern genutzt werden. Zu Demonstrationszwecken sollen Beispielanwendungen den Einsatz der neuen Technologien erstellt werden, damit deren praktische Nutzung leichter zu erfassen ist. Das Hauptaugenmerk bei den Beispielanwendungen liegt indes nicht auf der Funktionalität, sondern auf dem Einsatz der jeweiligen Technologie, so dass deren Möglichkeiten getestet werden können. Ebenfalls Teil der Arbeit soll die Erarbeitung von theoretischen Aspekten sowie die Erstellung einer Übersicht über den aktuellen Stand der Fachliteratur darstellen. Dies soll bei weiterer Nutzung der Ergebnisse die Erarbeitung von erweitertem Fachwissen erleichtern. Basis sollen hier die aktuell Erschienenen Fachbücher auf deutsch und englisch sowie - naturgemäß nochmals aktueller - die regelmäßigen Veröffentlichungen im Internet und in Fachzeitschriften bilden. Die zu besprechenden Themen umfassen die grundsätzliche Beschreibung von HTML5 und dem Standardisierungsprozess, die neuen HTML-Element in Bezug auf Formulare, Multimedia-Darstellung, die Möglichkeiten der Offline-Anwendung (Application Cache, Cache Manifest, DOM Storage), die Drag & Drop API zur Nutzung beim Dateiupload sowie die File API. Mögliche Themen für den theoretischen Teil sind gängige Architekturmuster (beispielsweise MVC, MVP, MVVM, PAC), Caching- und Sync-Strategien sowie die Potentiale aktueller Skriptsprachen (ECMAScript 5, Coffeescript, DART).
Diese Arbeit befasst sich mit der Entwicklung von Full-Stack-Anwendungen im Bereich des Internets der Dinge mit JavaScript. Grundlegende Wissensbereiche, die für diese Entwicklung notwendig sind, werden vorgestellt und erklärt. Es werden ausgewählte JavaScript-Frameworks und -Interpreter im Bereich des Internets der Dinge vorgestellt, bewertet und miteinander verglichen. Mikrocontroller und Einplatinencomputer, welche von den vorgestellten JavaScript-Frameworks und -Interpretern unterstützt werden, werden vorgestellt.
Um die Entwicklung von Full-Stack-Anwendungen im Bereich des Internets der Dinge mit JavaScript bewerten zu können wird eine Anwendung zur Erfassung, Speicherung und Darstellung von Umgebungsvariablen mit Moddable SDK und dem MERN-Stack entwickelt. Vor der Entwicklung werden Anforderungen über eine Anforderungsanalyse definiert und die Anwendung konzipiert. Im Anschluss wird die Anwendung anhand der Anforderungen bewertet. Probleme, die während der Entwicklung der Anwendung auftreten, werden zusammen mit möglichen Lösungen vorgestellt und Full-Stack-Anwendungen im Bereich des Internets der Dinge mit JavaScript werden in diesem Schritt evaluiert.
JavaScript ist für die Entwicklung von Mikrocontrollern zum aktuellen Stand noch nicht ausgereift genug, jedoch bestehen aktuelle Anstrengungen die Entwicklung von JavaScript APIs für Embedded Systems zu vereinheitlichen und voranzutreiben. Dadurch hat die Entwicklung von Full-Stack-Anwendungen im Bereich des Internets der Dinge mit JavaScript Zukunftspotenzial.
Egal ob Smart City, Smart Home oder als kleine Alltagshilfen, das Internet der Dinge ist heutzutage allgegenwärtig. Um die Dinge der vernetzten Welt nutzen zu können, benötigt man in der Regel ein User Interface. Es gibt verschiedenste Möglichkeiten für den Menschen, mit vernetzten Dingen zu kommunizieren. Es kann über ein Voice User Interface (VUI) mit der Sprache kommuniziert werden oder sogar bereits nur mit Gedanken über sogenannte Brain User Interfaces (BUI). Eine zentrale Rolle hat momentan vor allem das Smartphone, welches als leistungsstarker, dauerhafter Begleiter im Alltag durch eingebaute Sensoren und Kommunikationsmöglichkeiten wie Wifi, Bluetooth oder NFC, ein ideales Interface zum IoT bietet. Das Smartphone, sowie bereits viele Mikrocontroller, bieten zudem die Möglichkeit mit Internettechnologien wie HTML, CSS und JavaScript programmiert zu werden. Somit sind Webentwickler in der Lage, komplette IoT-Anwendungen zu implementieren. Für die webtechnologienbasierte User-Interfaceentwicklung des Smartphones bieten sich Frameworks wie Ionic, React Native, NativeScript oder Evothings an. Zu diesen vier Frameworks wird ein fundierter Vergleich durchgeführt, der Aufschluss über die Einsetzbarkeit der Frameworks bei einer IoT-Anwendung gibt. Ionic steht bei diesem Vergleich beispielsweise durch eine große Community, oder unzählige UI-Elemente mit hoher Usability, an erster Stelle. Die Möglichkeiten von Ionic werden anhand der App für den smarten Briefkasten Mail-E verdeutlicht.
Die Bachelor-Thesis "Entwicklung eines Web-Portals für M+I-Studierende" befasst sich mit der Entwicklung des Studierendenportals MI-Complete der Fakultät M+I der Hochschule Offenburg. In den üblichen Arbeitsschritten (Analyse, Konzeption, Umsetzung, Evaluation, Ausblick) wird darin der Werdegang des neuen Studierendenportals MI-Practix beschrieben.
In dieser Bachelorarbeit geht es um die Konzeption und Realisierung einer Web-App für das iPad. Zuerst werden allgemeine Themen zu Apps auf Smartphones und Tablets besprochen und Unterschiede zwischen einer nativen App und einer Web-App aufgezeigt. Auf Basis der gängigen Webtechnologien HTML5, CSS3 und JavaScript, sowie mit Hilfe des Frameworks jQuery Mobile werden Grundlagen einer Web-App erklärt. Im Anschluss daran wird erläutert, wie die das praktische Beispiel der "Movie-DB" umgesetzt wurde.
JavaScript-Frameworks (JSF) sind im Bereich der Webentwicklung seit längerem prominent. Jährlich werden neue JSF entwickelt, um spezifische Probleme zu lösen. In den letzten Jahren hat sich der Trend entwickelt, bei der Wahl des JSF verstärkt auch auf die Performanz der entwickelten Webseite zu achten. Dabei wird versucht, den Anteil an JavaScript auf der Webseite zu reduzieren oder ganz zu eliminieren. Besonders neu ist der Ansatz der "Island Architecture", die erstmals 2019 vorgeschlagen wurde. In dieser Thesis soll die Performanz der meistbenutzten und des performantesten JSF mit dem JSF "Astro" verglichen werden, welches die "Island Architecture" von sich aus unterstützt. Der Schwerpunkt liegt beim Vergleichen der Webseitenperformanz, jedoch werden auch Effizienz und Einfachheit während der Entwicklung untersucht. Das Ziel dieser Arbeit ist es, potenzielle Frameworks zu untersuchen, die die Effizienz und Produktivität für den Nutzer und während der Entwicklung steigern können.
Diese Thesis umfasst mit dem hybriden Rendering, Headless CMS und Progressive Web Apps drei moderne technologische Ansätze aus dem Bereich der Webentwicklung. Ziel der vorliegenden Arbeit ist es dabei, auf Basis eines Einblicks in die Grundlagen des modernen Web Developments zunächst die drei Konzepte einzeln zu betrachten, zu analysieren, Vor- und Nachteile herauszustellen und deren technologische Möglichkeiten zu erklären, um schließlich auch das Zusammenspiel dieser, derzeit relevanten Entwicklungsansätze im Hinblick auf die zugrunde liegende Forschungsfrage zu untersuchen: Ist es möglich verschiedene, aktuelle Trends der Webentwicklung sinnvoll miteinander zu kombinieren und so auf Basis eines Headless CMS, einem Frontendframework für verschiedene Renderingmethoden und der Idee der Progressive Web Apps eine performante und benutzerfreundliche protoytpsiche Web-applikation zu implementieren? Um dies zu überprüfen, wurde auf den zuvor erarbeiteten theoretischen Grundlagen mit MovieRec eine WebApp als interaktives Filmportal konzipiert und schlussendlich mit einem entsprechenden Technologiestack implementiert. Diese Schritte sowie die Umsetzung der Kernfunktionen der Anwendung wurden dabei anhand von Codeausschnitten erklärt.
Mit der kontinuierlichen Weiterentwicklung des World Wide Web, der steigenden Anforderungen an beispielsweise Ladege-schwindigkeit (in Millisekunden!) und Nutzungserlebnis und der Einführung moderner Jamstack-Frameworks mit verschiedenen Rendering-Methoden, wird der Prozess bei der Entwicklung von Webanwendungen immer komplexer.
Das Ziel der vorliegenden Arbeit ist es, die Funktionsweise der einzelnen Rendering-Methoden von Webanwendungen und de-ren Vor- und Nachteile zu untersuchen, um anschließend mit dem gewonnenen Wissen entscheiden zu können, welcher Ansatz für bestimmte Projekttypen der richtige ist. Dazu wird die folgende Forschungsfrage gestellt:
Wie kann unter Verwendung neuster Webtechnologien und Ansätze eine performante, nutzungsfreundliche und für Suchmaschinen optimierte Webanwendung erstellt werden, die den heutigen Standards (Core Web Vitals) gerecht wird?
Um die Forschungsfrage zu beantworten, wurde zunächst die Webanwendung selbst und nachfolgend der Stand der Technik bei der Entwicklung von Webanwendungen erläutert. Um ver-schiedene Ansätze und Funktionsweisen bei der Entwicklung einer Webanwendung beurteilen zu können, wurden diese ge-genübergestellt, auf Anwendbarkeit geprüft und die für den Rahmen dieser Arbeit geeigneten Technologien ausgewählt.
Die erarbeiteten theoretischen Grundlagen dienen zur Konzeption und Umsetzung einer interaktiven, multimedialen Präsentations- und Kollaborationsplattform mit dem Namen Collab. Hierbei ist es Benutzer:innen möglich sich über Dienstanbieter:innen und deren Leistungen zu informieren oder sich selbst als Dienstanbieter:in zu registrieren. Zudem können registrierte Personen eigene Projekte erstellen oder an existierenden Projekten teilnehmen, um diese zusammen in Form einer Kollaboration umzusetzen.