Meine Lieben hier wieder aus Hamburg heute andere Stimme am
Anfang der Burka fängt heute mal an.
Ich freue mich, dass ihr dabei seid und heute zuhört wir heute
ein ziemlich spannendes Thema in Folge 29 die jetzt schon ist du
ein ziemlich wichtiges Thema, weil es wirklich ganz ganz
viele. Entwickler betrifft aber auch
ganz, ganz viele Nutzer betrifft.
Wir sprechen heute über Reacted Reactive, ein sogenanntes Web
Framework, und ist das also mit einem Web Framework erstelle ich
quasi Web Auftritte, also nicht nur langweilige statische
Seiten, sondern alles das, was das moderne Internet heute
bietet, h. Und eines der der aller
bekanntesten ist Red und wir wollen heute ein bisschen
gucken, was das so kann, wie das so funktioniert, warum das
funktioniert, warum es cool ist und so weiter aber ich möchte
euch natürlich wieder ein bisschen Kontext auch geben.
Auch wenn ihr einen seid. Jetzt habe ich ganz viel
Monolog. Am Anfang erzählt, man könnte
meinen, Ich bin hier ganz alleine im Podcast.
Aber Nein, Gerrit ist auch dabei, der lacht, das seht ihr
nicht, aber ich sag mal Hallo Gerrit, bist du da?
Ja Hallo Burkhard, Ich bin auch da sehr gut, aber du hast das
super gemacht, genau, ich gar nicht sagen.
Wusstest du, dass du red. Die Zweitbeliebteste Library für
Java Script ist das wusste ich nicht.
Ich weiß aber, dass React das aller beliebteste Web Framework
ist in 2023. OK.
Ich habe auch noch ein bisschen, ich hab mich ganz bisschen
vorbereitet, also außer, dass ich natürlich jeden Tag benutze.
Selber hab ich gefragt, vor gut Bart ist ja die AI von Google
und ich hab bald mal gefragt, welches denn das bekannteste und
beliebteste Web Framework ist. In 2023 und React mit 40%,
danach Angola. Mit 22 die 23% ungefähr, dann
View mit 19% stellte, mit 11% etwa und ASP.
Net mit ungefähr 7%. Ja, also wir sehen hier also das
ist der Klassenkampf, WIG REACT und deswegen ist es auch
sinnvoll da mal rüber in Tiefe zu sprechen, vielleicht mal eine
Folge mit ein bisschen mehr Dive ist auf jeden Fall ein riesiges
Thema und richtig cool, ja. Dann lass mich doch kurz sagen,
welches die beliebteste javascript Library ist und das
ist J query. Kennst du die oder query würde
wahrscheinlich sagen. Ne ja klar kenn ich die ich bist
du. Ich hab das so ist 2023, denn
das nimmt das absteigenden Ast so ja, also die das wird sich.
Ja, und kommt immer drauf an. Ne beliebteste nicht beliebteste
das n Downloads sind das Stack over Flow Umfrage gewesen oder
irgendwas ja keine Ahnung. Das stimmt, hab ich.
Jetzt hab ich jetzt häufiger gefunden.
Genau dann lass uns doch mal ins Thema einsteigen.
Ich glaube wir haben das irgendwann mal erwähnt, dass
React aus dem Hause Meta, damals noch Facebook kommt, also wurde
dort entwickelt, ich glaube 2013 ging es los.
Ja, das ist auch meine Kenntnis, ja.
Und ja, und dann ging es aber irgendwann über in die Open
Source Community. Ja, haben auch schon darüber
gesprochen wie das funktioniert, Folge Open Source gemacht und
die pflegt das seitdem, da ist wohl eine ganze Menge los in der
Community und auch meta ist natürlich schwer beteiligt.
Ja schätze mal, dass die dann einfach benutzen.
Und daher ein großes Interesse haben, dass das Ganze nicht
weiterentwickelt und. Ja, neue neue Features bekommen
Stabiles und Wachs gelöst werden etwa.
Auf jeden Fall also, das ist richtig gewaltig, das fühlt sich
an wie ein professionelles Produkt, führt, dass man
eigentlich ganz viel Euro zahlen müsste.
Es gibt ganz viele Dokumentationen und sicherlich
ist das natürlich vor allem Metall Konzern selber, auch über
alle meinen Satz ja. Lass mal so starten, weil ich
hatte zuerst gedacht, das ist vielleicht auch so eine Art
Programmiersprache React es nicht, hab ich jetzt
rausgefunden, ist Java Script und dafür ist eine Library oder
du hast jetzt gesagt net Framework klar das doch mal
kurz. Auf oder wie hängt das zusammen?
Eine Programmiersprache und eine Bibliothek?
Ich meine, wir haben schon angerissen, anderen Folge, aber
vielleicht stellst du nochmal Zusammenhang, dass man das
einordnen kann. Wie diese Technologie sich
verhält zu einer Programmiersprache.
Ja, wenn ich das tue, sind die unsere Zuhörer, glaube ich,
verwirrt. Ich würde, ich würde n bisschen
anfangen, ich komme auf den Punkt zurück, Gerrit, was ist
nämlich tatsächlich Bibliothek, ich etwas später, wenn wir da
ankommen, wo es wichtig wird, hab dich nicht vergessen, ich
würde n bisschen einziehen, ich würde versuchen erstmal zu
erzählen, wie funktioniert das überhaupt ne also wenn wir ne
wenn wir ins Web gehen und sehen so ne tolle Anwendung eine Web
Anwendung was passiert da eigentlich?
Ja ich glaube darüber können wir besseren Einstieg machen ne und
ich fang nochmal ein Level ich überleg ich erzähl doch mal kurz
was der Browser überhaupt ist. Ja, der Browser ist quasi.
Man kann sich erst mal. Also wir sind einfach komplexer.
Also ich vereinfache jetzt gerade sehr stark, aber wir
wollen ja recht verstehen, also ja, seit bei mir seitdem ich ein
bisschen zu vereinfachen, aber für mich also erst mal ganz grob
gesprochen, ist der Browser einfach eine Rendering Engine.
So, und der ist ziemlich der überhaupt nicht dumm, aber was
das angeht relativ dumm, denn der kriegt einfach ein
sogenanntes Dom, ein n Document Object Model und das ist, das
kennt man wenn man ihr könnt ja auch Rechtsklicken auf folgender
Seite im Browser, dann sieht man Quelltext, also kann man sich
den Text anzeigen lassen und dann typischerweise HTML, aber
es ist nicht nur HTML, denn das ist wichtig, es gibt im Prinzip
diese 3 wichtigen Dinge die der Browser bekommt um eine tolle
Website anzuzeigen und das zu ändern, ja, das ist nämlich
tatsächlich das HTML heute im Standard HTML 5.
Das sind diese ganzen Text. Haben wir schon gesprochen, also
ein P für Paragraph h 1 für ne für n heading 1 h 2 heading 2
und so weiter so das ist quasi die Semantik der Seite, also
HTML, das ist gespickt mit CSS Scaling Style sheets, die
cascading Style sheets sagen quasi wie dieses H 1 h 2 oder
das D oder Irgendsowas auszusehen hat, mit welchem mit
welcher Farbe, Schrift, Farbe, Hintergrundfarbe, Schatten,
Animationen und so weiter das steckt alles in CSS und das
Dritte ist Java Script und das ist dann einfach die
Programmiersprache Java Script, die auch.
Mit von dem Browser quasi geladen wird und ausgeführt
wird. Das ist wichtig, ja.
Diese 3 Komponenten sind das ja und und und.
Hier kommt dann schon gleich der Haken zu zu zu React, weil
Javascript quasi runtergeladen werden kann von einem Server und
ausgeführt werden kann vom Browser und weil javascript
Programmiersprache ist, kann man jetzt ganz schön viele Sachen
damit machen und sich überlegen. Ja und hier auch noch mal kurz,
das ist wichtig wenn wir verstehen wollen müssen wir
verstehen wie kommt denn quasi die Information die der Browser
ändern soll quasi zu uns auf unseren Lokalen.
Auf unseren lokalen Browser. Wir sind im Web, Wir haben ja
erst mal einen Server, den wir kontaktieren, wir geben UL ein.
Example.com oder irgendwas und dann und dann passiert da was
und der Browser zeigt uns an, was passiert.
Wir fragen dem Server, Wir machen eine Anfrage an den
Server und der schickt was an den Browser zurück und früher
war wir hatten auch schon früher war es einfach so, dass der
Server einfach fertig gerendertes HTML geschickt hat,
ja dann kann sich vorstellen der Server kriegt ne Anfrage der
macht alles fertig und dann kriegen wir ne Seite zurück und
der Browser rendert das einfach nur noch hin und fertig wie n
Bild ja wenn ich dann immer klicke dann macht er jedes Mal
neues Bild oder sowas ganz grob gesprochen ne.
So, und dann sprechen wir von Multi Page Applications, war bei
jedem Klick wieder ne Server request passiert und der was
neues macht. Ja React ist für Single Page
Applications und für das kann auch Server Side Rendering aber
es ist hauptsächlich dafür gedacht für Client Side
Rendering sagt man so schön ne und das müssen wir jetzt erstmal
verstehen gleich ja aber Gerrit Ich mach mal Pause trink Schluck
Kaffee du hast vielleicht ein Paar.
Ne, soweit noch nicht, aber jetzt würde ich einfach kurz
wiederholen, dass letzten Endes React immer vom Client.
Verstanden werden muss in dem Fall der Browser.
Ja und und der Server das erstmal.
Das ist nicht die Aufgabe des Servers.
Red zu interpretieren und irgendwas damit zu machen.
Genau das ist richtig. Das ist sogar ziemlich krass.
Der Server macht fast gar nichts, wenn man sich, wenn man
sich überlegt was passiert, der Server gibt eigentlich ein
Bundle zurück, also wenn ich jetzt ne REACT Web Anwendung
Anfrage bei einem Server dann bekommt dann kommt sogenanntes
Bundle zurück, das ist quasi sehr komprimiertes Javascript,
das heißt sogar Punkt s Punkt oder irgendwie.
Und das lässt sich dann quasi der Browser rein.
Ja und fängt damit dann an und dann führt er quasi im Prinzip
lädt ein Programm runter, ein javascript Programm.
Ja der Klient, der Browser und der führt dann dieses Programm
aus und jetzt beantworte ich die Frage warum ist React eine
Software Bibliothek, das ist nämlich Software Bibliothek.
Mit React schreibe ich quasi oder React hilft mir quasi das
Programm zu schreiben. Das spezifische Programm für
meine eigene Webseite ja in diesem javascript Code was der
Client versteht. Ja das ist zwar javascript, aber
das ist jetzt kompliziert, kann sich jeder vorstellen, wir
müssen ja irgendwelche Buttons ändern und so weiter und sofort,
es gibt ganz viele Low Level Details auf die ich keine Lust
mehr habe mich zu kümmern, das nimmt mir das alles weg und ich
kann auf einer sehr hohen Flug ebene.
Aber immer noch sehr genau sagen und explizit was ich haben will
und wie und wie was auszusehen hat.
Aber diesen ganzen, den ganzen Detail Kram den der da hilft mir
Reactor. Jetzt hab ich irgendwas auf
meiner Website was ich bewegen soll, zum Beispiel, ich schätze
mal statische Sachen ist erstmal bräuchte man nicht zwingend
vermutlich jetzt mal, sondern es muss irgendwie schon was
anspruchsvolleres sein oder etwas anspruchsvollerem, spielt
es seine Stärken aus und aber in dem Fall ist es dann einfach mit
React einfacher, also mit diesem mit dieser Library React diese
Dinge so zu gestalten und zu entwickeln, dass genau das
passiert was ich möchte, irgendwas rein pflegt das
irgendwie was sich kalkulator auf der Website ist.
Vielleicht n Contact Form. Oder irgendwie so Sachen, die ja
schon eine gewisse Logik. Brauchen ja voll gute Frage.
Gerät genau wenn sich was bewegt.
Ja wenn sich was animieren soll im Browser, das lass uns ruhig
auseinandernehmen und was machen was da geht.
Also wenn ich jetzt zum Beispiel statischen Kontext runterladen
von dem Server, dann kann sich immer noch was bewegen.
Denn das CSS heutzutage, das kennt auch sowas wie Animationen
und so weiter. Das bewegt sich dann zwar, aber
das ist im Prinzip bewegt sich das immer, immer gleich, weil
weil das CS es wird quasi auch festgelegt, fest programmiert
und kann dann nachdem ich es runtergeladen werde nicht mehr
sich ändern, so, denn dann sind die dann ist es zwar beweglich,
aber die Bewegungen sind quasi statische Animationen sag ich
mal ja und das liegt daran, dass der das dem Prinzip der Dom,
also die Informationen die ich vom Server dann geladen, wenn
ich nicht benutze, dass die sich nicht ändern können, sie können
sich erst dann wieder, wenn ich wieder neuen Kontakt zum Server
mache. So und jetzt der riesige
Unterschied ist. Und was macht das?
Muss man einmal verstanden haben, ist.
Das nennt sich auch Virtual Dom im Prinzip.
Wenn dieses React Programm läuft, dann kann ich mit Java
Script beliebige Änderungen an diesem Document Object Model,
was quasi der Baum ist, quasi der Auftrag ist.
Was der Browser zu ändern hat, den kann ich einfach ändern.
Unterm Hintern sag ich mal unterm Arsch von vom Browser ja
so der der Browser ist. Ich habe ja gesagt der ist
relativ dumm so der der sieht was neues und dann ändert er das
und er ist total gut darin, das kann extrem schnell extrem
flicker frei und so weiter das ist das was die Browser
Entwickler. Ständig versuchen, sich zu
bemühen, ja, dass dass wir, auch wenn das geht, richtig schnell
dann 60 sein oder irgendwas, dass sich der dieses, diese
Anleitung was zu ändern ist. Was besteht aus HTMLCSS und in
Java Script, das kann der Browser immer schnell ändern.
Javascript läuft halt unverändert quasi die ganze Zeit
als würde ich wahnsinnig schnell Server Anfragen verändert quasi
dieses Document Object Model. Ja und da hinten und hier
Browser, Browser, Browser wieder hier Browser, Browser und die
Veränderungen können dann halt getriggert werden weil ich auf
so jetzt müssen wir überlegen wie, warum und wie.
Überhaupt war aktiv. Ja, ich habe immer 2 Events
Quellen ne. Entweder klickt der User
irgendwas Dreck and Drop Klick Knopf oder sowas ja dann dann
fordere ich ja quasi den Browser heraus etwas Neues zu tun oder
ich bekomme vom Server vom Backend irgendwelche Daten,
irgendwas hat sich geändert Datenbank oder als Reaktion auf
Multi wenn wir hier heavy Multi online playing machen oder
irgendwas ne du machst irgendwas und in meinem Browser ändert
sich was ja du kriegst ja nicht in meinem Browser, du hast dann
quasi was im im Backend auf dem Server Datenquelle verändert.
Die sich React zieht als Event und darauf reagiert.
Ja, ja, was soll ich jetzt? Muss ich mal in meinem Kopf hat
sich Grad Knoten gelöst. Ich hab natürlich bei Webseiten
einfach wieder in Webseiten gedacht ne also heisenberg.com
oder irgendeine Website. Ist natürlich Quatsch.
Ja, wir sprechen hier über SARS Anwendungen, über Online Games,
über diese Dinge, wo React dann ziemlich viel Sinn ergibt.
Richtig, du kannst mir doch Webseite machen, hatte ich auch
unsere erste Version der Webseite war mit, dann hast du
ne ziemlich dicke Kanone rausgeholt für n ziemlich
statisches Erlebnis, geht aber ja, also.
Ja, ja, verstehe OKOK alles klar, aber da spielt dann
beziehungsweise anders gesagt wenn das wirklich online
Anwendungen sind Drag und Drop oder sowas oder halt online
Gaming hast du jetzt gerade genannt, da stehst du denn
einfach. An Grenzen beziehungsweise macht
es dir dann recht einfacher, weil du das mit Javascript alles
machen kannst. Recht dann einfacher und
schneller. Du hast vorgefertigte Module,
wie auch immer und kannst diese manipulieren, so ungefähr.
Ja genau, richtig und und der der unglaubliche Speed kommt aus
2 Gründen erstmal, weil weil wir alles klein seitig also wenn der
Nutzer einen Event abfeuert, in dem n Knopf drückt indem er was
dropt oder ein Slider bewegt, dann ist es so, dass wenn es
nicht muss direkt abfängt wieder im Client javascript.
Versteht quasi o. Und der hat den Slider 10 nach
10 nach rechts gemacht. Ich muss jetzt hier was Neues
anzeigen und wenn dafür keine Daten neu benötigt werden, wenn
das alles schon da ist und ne neue Anzeige da sein muss.
Dann mach das React direkt quasi, dann rendert das direkt
den neuen, den neuen Document Object Model hin und es passiert
sofort. Da gibt es überhaupt keinen
keinen Traffic, entsteht kein Netzwerk Traffic zum.
Server in der Tabelle. Oder irgendwie sowas.
Genau so ne, wenn die Daten zum Beispiel wir ihr wisst ja, es
gibt ganz viele Caches im Browser ne, also ich hab es,
kann ja sein, dass die Daten schon quasi mit runtergeladen
hab auf meinen Klienten und dann arbeitet React einfach nur noch
mit diesen Daten, filtert die manipuliert, die zeigt die
anders an und so weiter und der Server ist gar nicht mehr im
Game ja das macht es ja aus ne Single Page application.
Vielleicht schon mal gesehen, manchmal sogar, dass wenn die
richtig gut gemacht sind, viel gemacht haben.
Dann kannst du quasi mit seiner Anwendung noch arbeiten, obwohl
schon längst kein Internet mehr. Ja wunderst dich dann irgendwie
so wirklich tatsächlich eine Datenbank Update kommen soll,
dann kriegst du ein Timeout. Ja, aber die Anwendung
funktioniert eigentlich ganz hervorragend, ist nicht sofort
weg, ja weil halt das Internet gar nicht gebraucht wird, weil
es quasi wie ein lokales Programm ist.
Ja und der Browser ist halt die Rendering Engine, also so läuft
es, ist jetzt auch noch total hohe Flug Ebene funktioniert und
ich muss noch eine Sache sagen, ist auch wichtig, das ist glaube
ich ziemlich einmalig. Bei React dieses Konzept des
virtuellen Doms, also im Prinzip ist es so, du hast ja immer das,
was du den Browser hingelegt hast, das führt, das kriegt er
gefüttert und dann zeigt er was an.
Ja, und jetzt wollen wir was verändern.
Und was jetzt React macht als als Software Library, sie baut
quasi einen einen virtuellen, einen virtuelle Version wie ein
Zwilling, einen virtuellen Zwilling von dieser Renner, von
diesem Rendering Dom auf. Und macht einen sehr cleveren
Abtausch nur für die Sachen, die sich geändert haben.
Also es wird nicht ständig alles neu angezeigt, sondern es wird
quasi nur das schnell ausgetauscht, was sich gerade
geändert hatte. Und damit kriegst du extrem
krassen Speed. Ja, also weil ne, dann kannst
du, kannst du die wildesten Sachen machen.
Ja und der Browser, der kriegt das alles nicht mit, ja der
kriegt immer nur vorgelegt, so hier, hier, hier, hier, hier und
zeigt dann quasi an. OK, sind UJS und Angela JS ich
glaube, das waren die anderen beiden berühmten Libra Ries für
den gleichen Zweck funktionieren die auch so ist das der gleiche
Anwendungsfälle bei denen. Ja, im Prinzip ist das der
gleiche Anwendungsfall. Es ist halt ne andere Art.
Und jetzt, da sind die halt unterschiedlich.
Ne. Also reactivity ist halt ne
Bibliothek und die hat ne interne API, also die hat eine
interne Vorstellung wie man sowas macht, dass man zum
Beispiel irgendwie ne andere Farbe setzt an den Knopf
überhaupt einmal und so weiter das ist halt unterschiedlich in
den verschiedenen Frameworks, aber an sich von der Technologie
sind die sehr ähnlich, ja. Und ich sage auch noch was, wenn
man jetzt quasi React eine Anwendung programmiert und dann
baut man sich irgendwas hin. Erzähl doch mal, wie das
funktioniert. Ja, dann kann man das auch immer
live testen auf seinem Laptop, das ist ziemlich ziemlich toll.
Du kennst das Gerät, wenn du siehst, dass manche, also ich,
ich kann quasi im Quellcode tippen und live wetten, dass ich
meinen Browser quasi mit dem, was ich gerade getippt hab, das
alles ganz cool das ist. Solange ich entwickle, kann ich
das so machen und wenn ich das jetzt quasi produktiv einsetzen
möchte, dann passiert so ne Art Compilation.
Also jetzt wird jetzt quasi dieser ganze React Code, den man
sehr gut lesen kann, als Quellcode mit mit Identizierung
und so weiter und mit Kommentaren, der wird genommen
und da muss ich auch noch einen fallen lassen, da gibt es Tools
wie Web Pack und Babel. Die sind jetzt wichtig, weil die
nehmen jetzt quasi diesen React Quellcode, der für mich als
Entwickler sehr einfach und klar da liegt.
Und das wird jetzt quasi zu javascript Paketen gebündelt.
Von diesen sehr sehr mächtigen Tools.
Und Dennis ist ja so, dass wir ja nicht nur einen Browser in
der Welt haben, ja und auch nur eine Version von diesem Browser,
es gibt ja unglaublich viele Browsers und die sind verhalten
sich auch unterschiedlich, je nachdem wo sind n Desktop
Browser ist nur ein bisschen anders als ein Mac Browser im
oder Safari da auf dem Telefon und so weiter und sofort und
dann guckst du Versionen 1615 14 Safari und beim Chrome auch und
weiter das ist ja auch ein Moving Target so das ist ja die
ganze Zeit ist das ja sich andauernd am Ende dann ne und da
wirst du ja völlig bekloppt. Wenn du als Entwickler das alles
wissen musst, so und dann für jeden Browser da irgendwie eine
entsprechende Ausnahme weiche und so weiter programmieren
muss. Ja, so war es früher übrigens
ja. Früher.
Musst du das genau wissen und du musst deinen Quellcode und sagen
hier, wenn das Safari ist, dann mach das ja wenn das Opera ist,
dann aber das ja und wenn das Internet Explorer ist, vergiss
es kannst du gar nicht machen, ja musst du irgendwie sagen,
hier tut mir leid. Ja, die Zeiten kenne ich sogar
auch noch ne, das dann auch manche einfach gesagt Pass mal
auf nutzt das jetzt in Chrome oder nutzt es halt in in in in
was weiß ich Mozilla und Internet Explorer Support und.
Und das war es dann. Genau, also ganz streng genommen
ist dann quasi nicht mehr React selber, also dieses Web Pack und
dieses Baby, das sind ja quasi verpackungs Tools, aber die sind
halt dieses Ökosystem um React, das kommt halt mit als
Entwickler. Du sagst am Anfang immer create
React App und dann bekommst du dies alles mit und das ist
javascript Krams mit diesen ganzen javascript Sachen und
dann sagst du eigentlich noch mehr zusammen als als als
Produktions Paket und dann passiert diese ganze Magie, also
dann wird dieses Javascript was du da geschrieben hast React
aufgepumpt, sodass das quasi für jeden Browser optimal läuft.
Ja, und dass du das wird dann auch kondensiert, das wird
aneinander gehängt, dass das ein ganz kleines Paket noch ist ja
auch total relevant, du willst ja, und das ist nämlich einer
der wichtigen Punkte, du lädst ja quasi, wenn du SPA eingepackt
application hast, die ganze Anwendung runter, wenn du das
allererste mal da bist. Wenn du noch nie gesehen hast
vorher, dann musst du das ganze Programm runtergeladen werden,
das heißt, es ist wichtig, dass dieses Programm nicht zu groß
wird, also wir wollen jetzt keinen 20 Gigabyte Programm
haben, weil dann müsstest du ja, wenn du auf diese Webseite
gehst, auf den Server gehst, erstmal 20 Gigabyte runterladen,
ne, wir haben die Leute auf abbrechen gedrückt bevor du
irgendwas ankommt, ne? Und deswegen ist dieses wichtig,
dass dieser diese bundling Tools und so weiter das schaffen
deinen Code so schlank zusammen zu bündeln.
So ein bisschen wie ein zip, ja. Also das stimmt wieder nicht
technisch also so ne Art kann man sich vorstellen, ne und dann
hast du noch 23 Megabyte oder irgend sowas, ist dann quasi das
Programm, das man gar nicht sieht, das passiert hier alles
so, aber es ist quasi ein Programm, das wird dann live
runtergeladen, dann ist schnell da und dann rendert und dann
geht es los ja und sobald es runtergeladen ist den Speed von
von von lokalem Krams so. Klein ist so n Programm 23
Megabyte. Genau.
Vielmehr ist das meistens nicht, also wenn es größer wird, sagt
so, Oh, da musst du mal, da gibt es Mittel und Wege, das klar zu
machen, aber genau tatsächlich ist unsere selbst unser Tool
ist. Wenn du initial runterlädst auch
glaube ich nur 3 oder 4 Megabyte.
Tatsächlich sehr krass. Das hätte ich nicht gedacht.
Und dann wird nachgeladen. Ne, also da gibt es also
manchmal braucht man auch ein bisschen mehr Platz quasi und
weil es ein großes Programm ist, das können wir auch, da gibt es
sogenannte Lazy loading und so weiter Code Splitting nennt sich
das tatsächlich auch total schick?
Ja, das kann man, muss man als Entwickler n bisschen sagen, du
kannst sagen OK wenn der Nutzer das erstmal runterlädt, dann
bist du ja quasi auf einer bestimmten Landing Page und du
willst quasi du musst ja nicht gleich jede Ecke und jede Ecke
und jedes Detail deiner ganzen Software da zeigen.
Kann ja gar nicht. Du zeigst immer nur einen Teil
an irgendwie. Du hast ja meistens irgendwie
Menüs und was nicht alles so, ja dann kannst du sagen, OK, ich
bitte den Code und das erste was runterladen ist erstmal nur die
andere Page und erst wenn ich davon weg navigiere, dann wird
irgendwie überhaupt nachgeladen beziehungsweise ist noch
cleverer. Es wird quasi die ein minimales
Paket gemacht, damit du ne gute Experience hast als User um
gleich irgendwas zu sehen. Und während du dann da rum
klickst, wird im Hintergrund nachgeladen, weil dann haben wir
ganz viel Zeit. Ja dann hat der User, der
orientiert sich erstmal was hier los und bevor der in den
nächsten Knopf drückt ist der ganze Rest schon im Hintergrund
nachgeladen worden und dann hast du ne fließende fließenden UX,
also eine User Experience richtig gute.
Und ne richtig schnelle Loading Time und alles das sind alles so
Sachen, so dass das erreichst du halt einfach nicht bei bei
diesen klassischen Webdings und das ist alles sind alles Sachen
die bietet die React als Frameworks alles mit drin so es
hat ziemlich mächtig ja. Kein Wunder, dass das von ich
hab nachgeguckt 18 mindestens 18000000 Websites genutzt wird.
Ja, wir wollen wir noch weiter in die Tiefe gehen, jetzt
technisch, ja was das bedeutet, ich kann es mir nicht so richtig
vorstellen, was man da noch so erörtern müsste.
Ja und wissen müsste als Laie jetzt über React, weil mal
ehrlich, ich benutzen werde ich nicht.
Sehen tu ich's nicht. Wie weit müssen wir da noch
rein? Ich hätte schon ganz gerne
vollgemacht, ein bisschen tiefer einzugehen.
Gibt vielleicht Leute, die. Nicht selber mit etwas spielen
wollen und so weiter da kann man klar, das ist ein bisschen, wir
können aber auch gern, wir haben jetzt schon bisschen einer 2.
Folge machen und n bisschen vertieft.
Ansprechen, dann eine Detailfrage React, Deep Dive
oder irgend sowas. Was mich jetzt noch
interessieren würde, ist wieder zurückzukommen auf die anderen
Frameworks Angular und Future. Es ist dann Geschmackssache was
ich nehme oder ist es dann wirklich n harter technischer
Vergleich oder wie kommt man dazu ein bestimmtes Framework
auszuwählen oder eine bestimmte Library?
Ne woran orientiere ich mich an den Kollegen?
Kriege ich eine Vorgabe? Du darfst jetzt entscheiden als
als als nicht nur.de aber auch technischer Leiter der Firma du
machst einfach wie kommst du drauf und wie lief das?
Möglicherweise woanders gibt es verschiedene Meinungen und und
wird dann verglichen. Ne wenn ich jetzt über Marketing
und Sales nachdenke und wieder neues Tool einführen wollen,
dann mal schöne und vergleichen ja und gucken uns alles mal ein
bisschen rum, hast ja meistens 14 Tage gratis Zeiträume oder
sowas und dann entscheidest du dich ne und wie kommt man da im
wie ist das Programmieren? Und das ist eine eine ganz
entscheidende, kritische, krasse Frage.
So, ja, das ist da gibt es Diskussionen, die sind richtig
lang und haarig, denn das ist ja, also, ich sag mal, wenn du
dich für Anwendungsprogramme entscheidest, für Sales, dann
hast du natürlich auch. Gut, dann siehst du alles um,
posiert vielleicht den Kontakt und so weiter und wenn du dann
doch nicht so toll findest. Aber wenn du natürlich irgendwie
im schlimmsten Fall sogar selber eine Software Company bist und
und und willst ein digitales Produkt rausbringen, ist das ja
sowas von essentiell für was du dich am Anfang entscheidest.
Das ist eine eine ganz wichtig und krasse Entscheidung, welches
Web Framework du nimmst, weil es überhaupt nicht klar und
einfach, wenn du dich einmal für React oder oder View oder Angela
entschieden hast und hast, dann. Ordentlich mannstunden da
reingepackt, dann kommst du nicht mehr raus, so schnell.
Ja das, also das Regieren auf ein anderes Framework, die sind
sehr unterschiedlich, das ist der Wahnsinn, so, ja da muss man
360 Grad Frage stellen, so ja da muss man alles angucken, was
einem wichtig ist. Wie groß ist das Projekt?
Was will ich damit machen und so weiter man muss sich genau
angucken, wo sind diese Frameworks unterschiedlich, ja
welche haben was für Vorteile, wie ist die Community, ist der
Support wie Dokumentation, wo finde ich am meisten Entwickler.
Ich sage immer es ist schlecht wenn das nimmt was am Markt am
häufigsten vertreten ist, dass es wirtschaftlich sinnvoll, weil
dann findest du auch die meisten Entwickler, zum Beispiel ja die
meisten Leute die sich auskennen und wenn es am meisten genutzt
wird, dann hast du auch die typischerweise Dokumentation und
als Open Source schnellsten Lösungen, wenn es Probleme gibt.
Das ist aber auch nur das ist kann nur ein Argument sein
dafür, was ich sagen kann. Ich muss sagen, ich bin selber,
ich mach schon lange recht, ich liebe das, für mich kommt nichts
anderes in frage, ich bin aber auch gar nicht so tief drin in
den anderen, ich hab en bisschen Angela mal gemacht und weiß
ungefähr was da los ist. Wie uns Welte in mich nur
informiert, aber nicht selber genutzt.
Man kann aber sagen, von diesen Frameworks React das wenige, was
dir am meisten Spielraum lässt, verrückte Sachen zu tun.
Denn also Frameworks haben ja manchmal ne, ja, die haben ja ne
Idee wie du was zu tun hast, wie du was umzusetzen hast.
Und reacts Idee lässt ja am meisten Freiräume.
Damit kannst du echt bildest. Die wildesten.
Also du kannst ja einfach hinsetzen und überlegst dir was
ganz krasses, so wie du es gerne hättest im Web und du kriegst
direkt umgesetzt. Ja, also Angela ist zum Beispiel
mehr Geist. Ja, da gibt es genaue
Splittings, da musst du HTML TRENNEN vom CSS, vom vom
javascript Code, da gibt es bestimmte Art und Weise wie du
das A wie du den wie du den Code aufbereiten musst und wie Sachen
passieren. Da wird es dann schwieriger
auszubrechen. Wenn du jetzt nicht den ganz
klassischen Standard Webcams machst, sag ich mal so und bei
kann immer ausbrechen, ohne dass sie sich schlecht anfühlt.
So ja und wir sprechen zum Beispiel auch ziemlich krass aus
so. Also ich würde sagen, wir machen
ja so low Code Plattform, das ist jetzt weg von diesen ganz
klassischen Standard Webanwendung, also wir haben wir
haben alles drinne Drop und und und kann was und was nicht alles
so ja und das geht mit Recht besonders gut.
Aber am Ende ist es Geschmackssache.
Gut Geschmackssache und dann musst du auch gucken, was hör
ich jetzt zumindest aus der technischen Anforderungen sind
und sind sie überhaupt Bilder? Ja, wenn wenn sich Angela zum
Beispiel in. Ja, gewisse Schranken oder
gewisse, Ja Leitplanken. Leitplanken.
Wenn du jetzt, wenn du jetzt Angela dich ins Leitplanken
packt und du willst vielleicht ja n Plattform bauen, gehst du
nicht zum OK. Cool, schöner Einblick.
Das heißt, wenn jemand bei uns ins Team kommt und für Frontend
zuständig ist, dann ist es recht, ja.
Das ist ja genau ja genau alles klar.
Ja, wir sind tatsächlich auch gerade dabei, wir suchen für
nächstes Jahr jemand, der vielleicht sogar den schwarzen
Gürtel, sag ich immer den schwarzen Gürtel trägt
irgendwie, ich weiß nicht, ob ihr auch mal Entwickler zuhört.
Wahrscheinlich ist das eigentlich zu High Level für
diejenigen, die, die wir jetzt hier ansprechen wollen.
Aber ja, vielleicht spricht sich's rum oder sowas.
Jemand der sehr sehr gut wirkt kann, der darf gerne mal hier
sogar anrufen, bin ich sehr interessiert.
Ja, wir machen keine Werbung, aber aber das darf man ruhig mal
sagen, ja. Ich denke auch, ja.
Genau cool. Dann würde ich jetzt uns den
Rest aufheben für die Folge eines Tages dann ne, wir haben
noch ne gute Liste an Themen, aber das können wir auch
mitnehmen. Ja, das machen wir.
Ich glaube, das kann man auch mal erklären, selbst wenn man
nicht entwickelt. Ja, ich bin gespannt, weil so ne
ne Software Bibliothek auf der Tonspur.
Wenn manche Leute, so wie ich, ja nicht mal irgendwie so, also
wir haben alle schon mal gesehen, aber so sagt mir halt
nicht, druckt die Matrix. Die Matrix ja genau, ja mal
gucken, vielleicht auch nicht, aber insofern haben wir heute
eine gemacht, die auch schon ein bisschen Erleuchtung gegeben
hat. Was das so ist.
Absolut nicht gut, ja richtig gut.
Ja, danke, Burkhard und dann machen wir zu und sagen wir bis
nächste Woche dann bei einfach. Jetzt kommt diese schöne Musik,
es klar machs gut, Tschüss Hamburg ciao.