Hi!

==============================================================================================================================================
Anmerkung: dies soll kein Tutorial sein wie man was macht, das würde einfach den Ramen sprengen!
==============================================================================================================================================

Wer hat schon mal versucht schnell und einfach eine Platfromübergreifende App zu entwickeln? Genau, ich!
Das stellte sich (unter c++) allerdings als Monsteraufgabe heraus. Die Frameworks die ich testete wollten unter Win 7 Nicht laufen.

Also nach alternativen für Platformübergreifende Apps gesucht und Electron gefunden.

==============================================================================================================================================

Electron ist eine Platformübergreifende Software die im Grunde aus 2 Teilen besteht:

Der Main-Prozess:
Das ist unser Hauptprozess, das Herz unserer App. Er wird durch NodeJS betrieben.

Die Render-Prozesse:
Solch ein Prozess kann vom Hauptprozess erstellt werden. Es handelt sich hierbei ganz einfach um ein Chromium Fenster.

Im Grunde ist also Electron ein lokaler Webserver der die App "hosted".
Das Grundgerüst für eine Einfache Electron App ist schnell gelegt, allerdings wie sieht es mit der UI aus?

==============================================================================================================================================

Web-UI ist im grunde wie eine GUI, man kann alles selbst machen, oder man greift nach einem Framework.

Eines der bekanntesten ist wohl React, wobei React kein Framework ist sondern nur eine Bibilothek die einem die möglichkeiten für UI's gibt.
Grob gesagt implementiert React Virtueles-DOM und rendert dieses dann als HTML auf deiner Seite.

(Kleine info am rande: Ein Beispiel für die Kombination Electron und React ist z.b. Discord)

Nun haben wir React also kanns losgehen mit der UI oder? Nein, noch nicht ganz, denn React selbst bringt keine Komponenten wie z.b. Buttons usw mit.
Dazu benötigen wir eine Bibilothek (bzw wir schreiben sie uns selber) wie z.b. Blueprint-js.

Nun zu einem der (meiner Meinung nach) größten Probleme von react: die Kommunikation.
Es ist wirklich SCHWIERIG Daten von einem platz an den anderen zu verfrachten.

nun gibt es folgende Möglichkeiten:
- Frameworks die die Kommunikation vereinfachen, bsp Flux
- Callbacks nutzen: reicht Daten In der Hirachie nach oben weiter (child -> parent)
- Context: stellt Daten einem gesamten subtree bereit (also allen child's und deren child's usw.)
- Observer: Ein Programmteil das Veränderungen erkennt und dementsprechend reagiert.

Nun ist natürlich zu überlegen welches die beste lösung für unseren Editor wäre.
Ich habe mich für einen Observer entschieden und nutze dafür PubSub-JS
Hierbei handelt es sich um ein simples publish (herausgeben, veröffentlichen) / subscribe (abonnieren) System.
Komponenten bzw Klassen können ein Topic (Thema) abonnieren. Sollten nun Daten mit diesem Thema an anderer Stelle des Programmes herausgegeben werden, kümmert sich die Bibliothek darum das diese Daten an alle Klassen weitergeleitet wird die eben halt abonniert haben. Einfach und effektiv.

==============================================================================================================================================
Hier ein beispielbild (uii leak!):



==============================================================================================================================================
Wie findet ihr das Programme (oder "apps" wie sie neuerdings auch gerne genannt werden) auf solch einem Webpage-Browser Prinzip basieren?
Oder findet ihr eher das Programme und Projekte dieser Größenordnung nativ, also in c, c++ o.ä. geschrieben werden sollten?

Mfg IT8