Dies ist ein Beispiel für eine Browser App, die ohne einen Server im Hintergrund komplett im Browser läuft. Es handelt sich dabei um eine so genannte Single Page App, da die App nur einmal durch Aufrufen der HTML-Datei gestartet und dann bis zum Verlassen der App nicht wieder neugeladen wird.
Die Anwendung kann an folgender Stelle online betrachtet werden: https://www.wpvs.de/my-songbook/
Die App nutzt den Node Package Manager npm als Paketverwaltung. Auf diese Weise werden der Application Bundler ParcelJS sowie eine Hand voll externe Bibliotheken für die Anwendung installiert. Jedoch wird kein übergreifendes Framework wie Angular oder React verwendet, da diese für eine allgemeine Einführung zu speziell sind und viele wesentliche Details verbergen.
Folgende Entwicklungswerkzeuge kommen stattdessen zum Einsatz:
- Atom: Spezieller Texteditor für Webentwickler und Programmierer
- git: Versionsverwaltung zur gemeinsamen Arbeit am Quellcode
- npm: Paketverwaltung zum automatischen Download abhängiger Bibliotheken
- Parcel: Web Application Bundler und Entwicklungsserver
Zusätzlich werden folgende Bibliotheken genutzt:
- Navigo: Single Page Router zur Vereinfachung der Navigation innerhalb der App
- PouchDB: Clientseitige NoSQL-Datenbank zum Speichern der Songtexte
- lyric-get: Kleine Bibliothek zur Suche von Songtexten im Internet
- Quill: WYSIWYG-Editor zum Nachbearbeiten der Songtexte
Die App richtet sich an Musiker, die anhand eines Lead Sheets neue Lieder üben oder diese auf der Bühne vortragen wollen. Hierfür bietet sie eine einfache Verwaltung von Songtexten mit der Möglichkeit, neue Texte online zu suchen und der eigenen Sammlung hinzuzufügen.
|
|
|
| Mobile Darstellung | Übersicht der Songtexte | Anzeige eines Songtexts |
Dieses Projekt ist lizenziert unter Creative Commons Namensnennung 4.0 International
© 2018 Dennis Schulmeister-Zimolong
E-Mail: [email protected]
Webseite: https://www.wpvs.de
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent