Kalender in Webapplikation + App

Kazuya91

Commander
Registriert
Nov. 2007
Beiträge
2.190
Hallo Community :),

ich beschäftige mich gerade mit Webapplikation zum ersten Mal weil ich ein Projekt realisieren will. Ich bräuchte mal allgemeine Tipps.

Zum Projekt (ich versuche mich sehr kurz zu fassen, also nur das Wichtigste was ihr wissen müsst):
Es gibt viele Mitarbeiter in einem Unternehmen. Diese sollen per Browser Zugriff auf eine Webapplikation haben. Diese Webapplikation hat einen Kalender, der auch weiß wann in Deutschland Feiertage sind und wann nicht. Die Mitarbeiter können sich einloggen mit Benutzername und Passwort. Nach dem Login findet jeder Mitarbeiter seinen persönlichen Kalender wo er Tage markieren kann. An markierten Tagen soll ein Mikrocontroller eine bestimmte Aufgabe für ihn erledigen. Dabei hat jeder Mitarbeiter seinen eigenen zugewiesenen Mikrocontroller. Die Funktionalität der Web-Applikation soll auch in einer iOS-App umgesetzt werden. Der MikroController braucht also Zugriff auf eine persistente Datenbank und soll HTTP-Requests an den Webserver schicken worauf die WebApplikation läuft. Ich hoffe ich habe nichts vergessen...

Meine Fragen sind jetzt:
1.Welche Tools/Programmiersprachen/Frameworks sind dazu geeignet/kann man/sollte man nutzen?
2.Wie implementiere ich solch einen Kalender in eine WebApplikation? (Ich will keinen Code sondern einen Hinweis auf eine API oder ähnliches)
3. Wie gestalte ich die GUI der Webseite möglichst einfach? Gibt es so ein grafisches Tool zur Webseiten-Erstellung nach dem Motto "What you see is what you get?"

Da ich null mit WebApplikationen zu tun hatte, blicke ich da nicht ganz durch und würde mir gerne etwas Zeit ersparen die richtige Herangehensweise zu finden. Wäre doof wenn ich lange dran sitze und später herausfinde dass es viel leichter gehen würde :).

Ich bedanke mich im Voraus!
 
Deine Fragen kann man grundsätzlich sehr unterschiedlich beantworten, da eine sehr große Vielfalt für Deine Anwendungszwecke herrscht.
Persönlich bin ich ein Fan von Java, in diesem Fall wohl eher des Frameworks JavaEE. Dafür gibt es auch eine Menge an GUI-Elementen, die zwar weniger per WYSIWYG implementiert werden, aber trotzdem sehr einfach zu verwenden sind (Beispiel: https://www.primefaces.org/). JavaEE erlaubt auch eine sehr einfache Anbindung an Datenbanken jeglicher Art. Ob ich als DB-Framework Hibernate nehmen würde, sei dahin gestellt. Etwas leichtgewichtiger und imo für Deinen Kontext ausreichend ist ORMLite (http://ormlite.com/).
Je nachdem wie umfangreich die Applikation in Sachen Kalender werden soll, kannst Du dir vielleicht mal als Einstieg einen "Datepicker" anschauen a la https://www.primefaces.org/showcase/ui/input/calendar.xhtml. Überlegen könnte man sich auch den Vaadin Calendar: https://vaadin.com/directory#!addon/vaadin-calendar. Wie gesagt, kommt stark darauf an, was Du GENAU an Funktionalität brauchst.
 
Ich greife mal das Thema nochmal auf und versuche es genauer zu beschreiben:

Komponenten:
1. Mikrocontroller der per WLAN verbunden ist und mit einem Temperatursensor ausgestattet ist
2. Iphone

Wie sieht das Projekt aus?
Es gibt viele Mitarbeiter in einem Unternehmen. Jedem Mitarbeiter wird ein Microcontroller zugeordnet. Jedem Mitarbeiter sollen Zugangsdaten (Benutzername und PW)
vergeben werden. Mit diesen Daten loggt er sich in eine Webseite ein, wo er seinen persönlichen Kalender vorfindet. In diesen Kalender soll er für jeden Tag im
Jahr _mehrere_ Uhrzeiten eintragen können. Diese sollen natürlich nicht verloren gehen und müssen gesichert werden. Der Mikrocontroller soll sich dann die nächste Uhrzeit/Zeitpunkt
holen, schlafen legen, zu der geholten Uhrzeit aufwachen, den Sensor checken und dann eine Email UND eine Push-Benachrichtigung auf das Iphone senden. Anschließend soll er sich wieder die nächste Uhrzeit holen und wieder schlafen legen.
Das wiederholt sich.
Der User soll auf der Webseite einstellen können ob er eine Benachrichtigung auf dem Iphone bzw. eine Email bekommt oder nicht.
Die gleiche Funktionalität der Webapplikation soll auch nativ auf einem Iphone realisiert werden (das heißt einen Kalender oder ähnliches wo er die Uhrzeiten für jeden Tag bearbeiten kann).
Push-Benachrichtigungen sind eine Anforderung!

Meine Annahmen bis jetzt:

1.ich programmiere den Kalendar. Ich habe mal Beispiele für einen Kalendar rausgesucht. Einmal wurde einer per HTML+CSS+Javascript realisiert
http://www.mrknowing.com/2013/07/25/eigenen-html-kalender-erstellen-html-und-javascript/
und einer mit HTML+CSS+PHP
https://www.startutorial.com/articles/view/how-to-build-a-web-calendar-in-php
ich passe diese natürlich meinen Anforderungen an und überarbeite diese. Diese dienen nur als Beispiel.

2. Diesen Kalender mit Funktionen muss ich ja online zugänglich machen. Also muss ich ja einen Webserver/Application Server aufsetzen...

3. Die Uhrzeiten müssen ja gespeichert werden, also nehme ich an ich komme um eine datenbank nicht herum. Schließlich sind es pro User in einem Jahr mindestens
hunderte von Uhrzeiten.

4. Da die Uhrzeiten gespeichert werden, wird von der WebApplikation aus auf die Datenbank zugegriffen. Also es muss gelesen/geschrieben werden, ergo es werden Funktionen aufgerufen.

5. Für die Umsetzung beim Iphone habe ich die Library "JTAppleCalendar" gefunden. Push-Benachrichtigungen realisiere ich mit Firebase (oder Alternativen von euch).


Meine Fragen jetzt:
Ich verstehe noch nicht den Zusammenhang/Kommunikation zwischen den Technologien/Frameworks/APIs...

1. Wie bringe ich die Webseite online? Was brauche ich dafür? (Ich weiß ich brauche einen Server, aber welche Tools?)

2. Wie mache ich das mit der Kommunikation zwischen der WebApplikation und dem Microcontroller? Es werden ja funktionen aufgerufen... Mach ich das mit JavaScript, der REST API, einem HTTP Request, Austausch einer JSON-Datei? Ich weiß nicht welche Möglichkeiten ich habe.

3. das gleiche für die Umsetzung beim Iphone... JavaScript/REST/HTTP/JSON?

4. Wozu braucht man ein WebFramework? Brauche ich eins?

Ich kenne mich gut in Java aus, möchte aber nicht dass man für den Aufruf der webseite ein Java-Plugin braucht. Viele haben das auf dem Rechner nicht installiert und ich habe bedenken dass man die Webseite mit einem Android Smartphone nicht
aufrufen kann. Ich wäre auch bereit PHP/Javascript anzuwenden.
 
Beim Microcontroller kann ich dir nicht wirklich weiterhelfen, aber mal zu deinen Punkten:

Was brauchst du:

1. Einen Webserver für die Webapplikation. Da kommt es nun darauf an, für welche Sprache du dich entscheidest. Beispielsweise Apache oder Nginx für PHP, Glassfish oder JBOSS für JavaEE, Node.js für Javascript...

Du brauchst auch bei der Verwendung von Java kein Java-Plugin im Browser. Der Java-Code läuft nur auf deinem Server (das Backend). Die eigentliche Benutzeroberfläche (Frontend) baust du in HTML/CSS/JavaScript und kommunizierst per HTTP POST/GET/DELETE/PUT... Requests mit deinem Backend. Deine User füllen dann über das Frontend dein Kalenderformular aus und senden es an deine Java-Applikation (oder welche Sprache du auch immer nimmst).

2. Hier kommt es nun darauf an, was dein Microcontroller kann. Davon habe ich nur sehr eingeschränkt Ahnung. Vermutlich wird das so laufen, dass dein Microcontroller entweder in regelmäßigen Abständen via HTTP-Request bei deiner Serverapplikation anfragt oder andersrum deine Serverapplikation regelmäßig via HTTP-Request an deinen Microcontroller sendet und so die benötigten Daten ausgetauscht und Steuersignale gesendet werden.

3. Dafür gibts Lösungen wie React Native

4. Es vereinfacht die ganze Sache enorm, wenn man das Rad nicht neu erfinden muss. Die Grundlagen für Webanwendungen sind in quasi jeder Sprache schon in Frameworks umgesetzt, die man dann nur noch benutzen muss.
Da landet man dann schnell bei sowas wie Java, Spring, Hibernate, Quartz fürs Backend und Bootstrap und React fürs Frontend. Damit kommt man dann auch relativ schnell zu vernünftigen und wartbaren Ergebnissen.
 
Hallo,

habe ich das so richtig verstanden?

1. Eine Webapplikation (also eine "interaktive Webseite mit definierten Anwendungsfällen und Mandantentrennung") die auf einem "Webserver" läuft und per Browser auf diversen Zielplattformen bedienbar ist.

2. Eine App im App-Store für iOS (ggf. auch Android?), die Funktionen der Webapplikation, z.b. diese Kalenderfunktionen, mit UI-Elementen der Zielplattform abbildet und dabei eine Client-Server-Kommunikation benötigt, da viele Kalenderdaten aus dem Backend kommen bzw. ins Backend geschrieben werden müssen.

3. Ein Backend, welches für die Webapoplikation und die "mobile app's" die Daten und die Benutzeraccounts vorhält und strukturiert speichert?



Falls ja, dann:

zu 1. Für Webapplikationen gibt es moderne Frameworks. Da ist die Frage der Programmiersprache, des Umfangs der Webapplikation usw. eher ausschlaggebend. Momentan wird viel mit Serverseitig interpretierten Javascript (ECMAScript-6) oder Typescript mit Angular 2 gearbeitet.
Das bedingt Serverseitig jedoch einen node.js oder sonst wie gearteten Serverthread, der die Applikation dann auch an die Port bindet usw. Nichts fürs normale Hosting im Web. Für PHP gibt es zum Beispiel Frameworks wie symfony oder Slim Framework. Die Gemeinsamkeiten liegen bei allen im strikt Objektorientierten Ansatz und in der Mehrschichtarchitektur. Mal mehr, mal weniger gut. Ich persönlich habe für REST-APIs eigentlich gute Erfahrungen mit Slim gesammelt, auch wenn Hater jetzt losschreien können, dass PHP eine Erfindung Satans ist und in die Hölle zurück gehört aus der es kam. Ich sage immer: Code ist so gut, wie das, was der Entwickler daraus macht. Man kann auch viel Müll in Java oder C# verzapfen und elegante Anwendungen mit PHP schreiben. Angular wird momentan von vielen bevorzugt, da sie für Webanwendungen nicht immer zwisschen HTML, PHP, JavaScript hin und herspringen müssen. Man bleibt quasi von hinten bis vorne bei "Javascript" - hat auch so seine Vorzüge.

zu 2. Apps im Appstore ist das eine. Ich habe keine Erfahrung mit App-Entwicklung. Ich weiß nur, dass es da mittlerweile auch brauchbare "Baukästen" gibt, mit denen man für verschiedene Plattformen mit Webtechnologie Apps bauen kann, die auch auf die Sensoren und Funktionen vom Smartphone zugreifen können. Was ich jedoch sagen kann ist: Wenn deine App lokal läuft aber die Daten mit dem selben Backend der Webapplikation ausgetauscht werden sollen ist es absolut sinnvoll und angebracht eine Middleware in Form einer REST-API zu entwickeln, die sowohl von der Webapplikation als auch von der oder den Apps genutzt wird. Auch diese REST-API kann man mit den bei Punkt 1 genannten Frameworks realisieren.

zu 3. Das Datenbackend an sich ist sinnvollerweise eine Datenbank. Die Frage ist halt, ob man etwas objektoritiertes oder etwas relationales haben möchte. Je nachdem wird das dann entweder ein MongoDB / CouchDB (ODBMS) oder ein MariaDB(mySQL) oder anderer RDBMS (MS SQL-Server, Postgres, uvm...) Es sollte halt mit einer guten Abstraktionsschicht von den Sprache der oben genannten Frameworks unterstützt werden. Wenn es da keine Vorgaben vom Unternehmen her gibt, würde ich genau danach den passenden Kandidaten auswählen. Ansonsten muss man ohnehin das nehmen, was vorhanden ist oder was erweitert werden soll. Ein Kalender mit Microcontroller weißt ja eigentlich schon auf ein bestehendes System hin... Wird das ebenfalls durch offene Schnittstellen angesprochen? Teilt man sich da ein Datenbackend? (das wäre eigentlich ein Anti-Pattern... Siehe: "Integrationsdatenbank")

Jedenfalls ein interessantes Vorhaben. Machst Du das alleine oder hast Du ein Entwicklerteam?
 
Zuletzt bearbeitet:
proudlyhingeschissenmitphprrrr.PNG

Hallo, ich habe so etwas in der Art, einen Abwesenheitsplaner programmiert für die Firma und einen Partner.
So einen Jahresübersichtskalender und Verwaltungsmethoden (Feiertage als .ical upload, Mitarbeiter etc gibt es auch).

Was ich genutzt habe:

Frontend:
- Bootstrap für responsive Darstellung
- HTML (nur für das Gerüst)
-JavaScript + Framework Jquery für das Forentend, fülllen der HTML-Elemente, geht aber sicher mit AngularJS besser.
- AJAX für die Client-Server Kommunikation.


Backend:
-PHP Klassendefinitionen der einzelnen Datenbank Tabellen (Jede Row entspricht also einem Objekt).
-ZendDB(Framework) Adapter für MySQL anbindung.
-RequestHandler der die Client Request and die Jeweiligen HelperKlassen weiterleitet.

Weiteres:
- PHP gettext für Lokalisierung und eine eigene eigene gettext methode für Javascript.
- Composer Autoload und Require damit ich mir keine sorgen machen muss ob das jeweilige File eingebunden ist
- Grunt(NodeJS) für: css und js min, js uglify


Villeicht hilft es dir ja weiter.
Viel Erfolg.
Ergänzung ()

kalender.PNG

Der Kalender sieht dann am Ende etwa so aus.
 
du kannst php verwenden.. würde dann auf laravel setzen..
es https://laravel.com/ dazu kannst du das paket hier verwenden http://yohan.giarel.li/CalendR/ ist zwar etwas älter aber funktioniert sehr gut.. sind alle feiertage für alle bundesländer abgedeckt..

wenn du hip sein willst.. dann machst du eine api mit einem node js framework wie adonis http://dev.adonisjs.com/ und verwendest im frontend auch eine javascrit lib wie vue js https://vuejs.org/ da gibt es auch einiges an kalender sachen für https://github.com/vuejs/awesome-vue#calendar

musst dann halt aber einige neue sachen lernen..

die api kann natürlich in jeder anderen dafür geeigneten sprache geschrieben werden.. wie python mit jango etc.. aber das sind denke ich was das deployment und verfügbare resourcen wie hilfen im internet.. die einfachsten varianten..

laravel hat zum beispiel eine art eigenes netflix wo sehr viele sachen lernen kannst https://laracasts.com/series/laravel-from-scratch-2017
auch zu vue js gibt es da was https://laracasts.com/series/learn-vue-2-step-by-step
 
Zuletzt bearbeitet von einem Moderator:
Ich will Dir auf keinen Fall den Wind aus den Segeln nehmen, aber als Erstprojekt mit 0 Erfahrungen in dem Bereich und auch keiner Vorstellung darüber, welcher Technologie Stack zum Einsatz kommen kann, ist das über ambitioniert.

Mein Tipp: Zergliedere das Projekt in Pakete. Fang erstmal mit einem Aspekt an und schau ob Du den umgesetzt bekommst. Auch wenn es sein kann, dass Du nachher viel neu schreiben/wegwerfen musst, wenn Du weitere Schnittstellen hinzufügen musst.

Das könnte in etwa so aussehen:
1. Bau das erstmal als Webprojekt, wo jeder einfach manuell was eintragen kann.
2. Füge Deinem Server eine REST oder SOAP Api hinzu.
3. Baue die App fürs Handy mit Kommunikation über die REST/SOAP API
4. Baue was immer noch nötig ist um den Controller einzubinden. Was Der Mikrocontroller wirklich kann, kann ich nichts zu sagen, 0 Erfahrung damit. Was hat der denn überhaupt für Kommunikationsschnittstellen?

Technologien sollten relativ egal sein, gibt zig Möglichkeiten, die Webanwendung zu bauen, PHP/Java/C#/Ruby/Python whatever.
 
Ich danke euch allen für eure Mühe. Hat mir sehr weitergeholfen :). Ich recherchiere mal etwas und melde mich ggf. nochmal.
 
Zurück
Oben