WEBVTT

NOTE
Podcast: Wo wir sind ist vorne.
Episode: 8 magische Entwickler-Momente
Publishing Date: 2020-05-31T13:01:18+02:00
Podcast URL: https://wowirsindistvorne.show
Episode URL: https://wowirsindistvorne.show/8-magische-entwickler-momente/

00:00:00.000 --> 00:00:06.140
 Wo wir sind, ist vorne, Folge 8. Heute geht's um x Dinge, die früher Magie waren und heute zum Alltag gehören.

00:00:06.140 --> 00:00:25.180
 Herzlich willkommen bei Wo wir sind, ist vorne. Frontend-Fakten-Frotzelein.

00:00:25.180 --> 00:00:29.240
 Der Late-Night-Frontend-Talkshow rund um Webdesign und Entwicklung.

00:00:30.000 --> 00:00:40.900
 Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und JavaScript-Jongleur Konstantin Groß.

00:00:56.860 --> 00:01:05.620
 Herzlich willkommen bei Wo wir sind, ist vorne. Jetzt habe ich das Intro nochmal wiederholt, aber wir sind ja ganz gut im Wiederholen immer, haben wir auch schon mal festgestellt.

00:01:05.620 --> 00:01:08.760
 Wir machen ganz gern Echo, auch bei unseren Jingles.

00:01:08.760 --> 00:01:16.480
 Ja und mit mir, also mein Name ist Moritz Gießmann, das kann man ja auch irgendwie auch nochmal sagen und mit mir heute am Steuer Konstantin Groß.

00:01:16.480 --> 00:01:17.760
 Hi, aber nur heute.

00:01:17.760 --> 00:01:25.600
 Nur heute und früher auch und in der Zukunft vielleicht auch nochmal. Immer.

00:01:25.600 --> 00:01:29.560
 Also es gibt ja schon, du musst mich loswerden.

00:01:30.040 --> 00:01:33.940
 Nein, nein, nein, nein. Ich finde, nein, ohne dich wäre das ja gar nicht möglich hier alles.

00:01:33.940 --> 00:01:36.400
 Was trinkst du denn heute?

00:01:36.400 --> 00:01:39.040
 Moment, ich trinke noch gar nichts. Ich mache aber mal kurz auf.

00:01:39.040 --> 00:01:44.880
 Wir haben übrigens, wir haben Feedback bekommen zum Bier trinken. Jetzt muss ich gerade den Öffner noch suchen.

00:01:46.340 --> 00:01:54.000
 Also ich habe ganz konkret Feedback bekommen von einem Hörer, der gesagt hat, immer wenn wir das Bier aufmachen, wird er ein bisschen neidisch.

00:01:54.000 --> 00:02:06.180
 Und von daher möchte ich hier Bier mit WWS IV als neue Aktion starten. Also ihr könnt euch jetzt auch ein Bier holen. Wir geben euch mal irgendwie so, weiß ich nicht, so ein paar Sekunden Zeit.

00:02:06.180 --> 00:02:07.660
 Jetzt noch eine halbe Minute und dann.

00:02:07.660 --> 00:02:18.540
 Nee, nee, also ihr könnt jetzt, ihr könnt jetzt zum Kühlschrank gehen und ich verspreche euch, in den nächsten 20 Sekunden, 30 Sekunden kommt wirklich nichts Interessantes. Da könnt ihr einfach weiterlaufen lassen.

00:02:18.540 --> 00:02:29.620
 Und dann könnt ihr einfach, jetzt warte doch mal, warte doch mal. Und dann, ja genau, holt euch ein Bier und dann machen wir das gleich gemeinsam auf. So, und jetzt kommt.

00:02:32.400 --> 00:02:36.540
 Müssen wir dafür, ja nicht zu viele Takte, nicht zu viele, sonst müssen wir dafür noch was zahlen.

00:02:36.540 --> 00:02:39.380
 Ist mir egal.

00:02:39.380 --> 00:02:48.540
 Nein, Spaß, okay, so ist es jetzt vorbei.

00:02:48.540 --> 00:02:54.400
 Ja genau, ich trinke heute ein Augustiner Lagerbier Hell.

00:02:54.400 --> 00:02:56.760
 Ich mache es gerade mal auf, Moment.

00:02:56.760 --> 00:02:57.140
 Ich auch.

00:03:00.400 --> 00:03:03.100
 Bei mir gibt es ein Hasseröder Premium-Pilz.

00:03:03.100 --> 00:03:04.400
 Schon mal getrunken?

00:03:04.400 --> 00:03:05.820
 Das hätte ich jetzt nicht gesagt.

00:03:05.820 --> 00:03:07.060
 Ich weiß nicht, nee.

00:03:07.060 --> 00:03:08.360
 Ich glaube, das gehört so.

00:03:08.360 --> 00:03:13.740
 Ich bin letztens einkaufen gewesen und habe mal ein bisschen Biervorrat eingekauft für unsere Aufnahmen.

00:03:13.740 --> 00:03:19.900
 Also ich bin jetzt eingedeckt für die nächsten Folgen und habe einfach mal geschaut, was hatte ich denn schon lange nicht mehr und was hatte ich denn noch nie.

00:03:19.900 --> 00:03:25.960
 Und dann habe ich irgendwie gedacht, Mensch, Hasseröder Premium-Pilz, das kenne ich irgendwie noch so aus der Fernsehwerbung, aus den 90ern.

00:03:26.960 --> 00:03:29.340
 Da wäre das ein Begriff, aber getrunken habe ich es noch nie, jetzt habe ich es mal.

00:03:29.340 --> 00:03:30.800
 Ich würde sagen, wir stoßen mal an.

00:03:30.800 --> 00:03:31.880
 Ja, Moment.

00:03:31.880 --> 00:03:34.580
 Dazu brauche ich natürlich noch das Extra-Gerät, okay?

00:03:34.580 --> 00:03:35.900
 Oh, das war jetzt mal.

00:03:35.900 --> 00:03:39.800
 Wir sind natürlich mal wieder remote und können nicht miteinander anstoßen.

00:03:40.600 --> 00:03:43.800
 Aber wir simulieren die Geräusche trotzdem für euch.

00:03:43.800 --> 00:03:48.540
 Aber so, Hasseröder, ich will so eine Marke ja gar nicht aussprechen.

00:03:48.540 --> 00:03:56.200
 Also jemand, der schon mal im Fernsehen irgendwie Werbung gemacht hat, ich wüsste es jetzt bei Augustiner nicht, weiß ich gar nicht, ob man dafür ...

00:03:56.200 --> 00:03:57.760
 Ich habe es aber, glaube ich, auch noch nie getrunken.

00:03:57.760 --> 00:04:02.420
 Also die Werbung bei mir, bei dir hat sie funktioniert, du hast es jetzt irgendwie 20 Jahre später gekauft.

00:04:02.420 --> 00:04:03.060
 Ja, richtig, ja.

00:04:05.480 --> 00:04:09.160
 Vielleicht sind das auch noch die Restbestände von damals, vielleicht gibt es die Brauerei gar nicht mehr.

00:04:09.160 --> 00:04:09.220
 Wahrscheinlich.

00:04:09.220 --> 00:04:10.940
 Seit 1872.

00:04:10.940 --> 00:04:15.540
 Ja, Augustiner habe ich erst entdeckt, seit ich in Karlsruhe bin, das ist ja ein bayerisches Bier.

00:04:15.540 --> 00:04:23.520
 Aber ich finde das einfach, also das macht, es hat eine gute Wirkung auf mich, sage ich mal so.

00:04:23.520 --> 00:04:28.640
 Also wenn mich jemand mal abfüllen will, Augustiner ist dafür auf jeden Fall gut geeignet.

00:04:30.140 --> 00:04:34.320
 Also mich erinnert das ein bisschen an, es ist sehr geschmeidig, sage ich mal.

00:04:34.320 --> 00:04:36.660
 So ein bisschen Tannenzäpfle.

00:04:36.660 --> 00:04:39.300
 Ja, kann man trinken.

00:04:39.300 --> 00:04:41.380
 Ob es jetzt Premium ist, naja.

00:04:41.380 --> 00:04:45.880
 Also da ist schon mehr Premium, ist noch was anderes, was ich habe, und zwar was nicht Alkoholisches.

00:04:45.880 --> 00:04:49.160
 Ich halte das mal in die Kamera.

00:04:49.160 --> 00:04:50.840
 Ah, nein.

00:04:50.840 --> 00:04:55.540
 Ja, Almdudler Hanf, weil die Hörer und Hörerinnen sehen das natürlich jetzt nicht.

00:04:55.540 --> 00:05:07.100
 Almdudler Hanf gibt es und es gibt auch Almdudler Grapefruit und diverse andere Sorten, irgendwie noch light und kohlensäurefrei und was weiß ich.

00:05:07.100 --> 00:05:13.740
 Seit letztem Jahr habe ich das im Urlaub entdeckt in Österreich und ja, gibt es hier in Deutschland noch nicht.

00:05:13.740 --> 00:05:16.880
 Die testen das wahrscheinlich jetzt erstmal so aus, was sich wie gut verkauft.

00:05:16.880 --> 00:05:18.320
 Im Onlineshop kann man es nämlich bestellen.

00:05:18.320 --> 00:05:20.760
 Almdudler Hanf verkauft sich bestimmt super.

00:05:20.840 --> 00:05:24.860
 Und es schmeckt also tatsächlich, also es schmeckt wohl so, wie Hanf schmeckt.

00:05:24.860 --> 00:05:28.160
 Schmeckt wie Hanf schmeckt.

00:05:28.160 --> 00:05:31.740
 Wenn man so auf so einer Hanftüte rumkauen würde, ich weiß es nicht.

00:05:31.740 --> 00:05:34.340
 So, wie Almdudler Hanf.

00:05:34.340 --> 00:05:39.360
 Also nee, was heißt, ich weiß es nicht, also ab und zu mal so einen legalen Hanftee trinke ich tatsächlich ganz gerne.

00:05:39.360 --> 00:05:41.760
 Und so schmeckt das mit Almdudler vermischt.

00:05:41.760 --> 00:05:43.060
 Was ist denn legaler Hanftee?

00:05:43.060 --> 00:05:45.000
 Es gibt Hanftee zu kaufen, ohne THC.

00:05:45.000 --> 00:05:48.040
 Aber wir schweifen jetzt, also schon wieder extrem.

00:05:48.040 --> 00:05:51.200
 Nee, nee, nee, nee, nee, da müssen wir jetzt kurz drauf eingehen.

00:05:51.200 --> 00:05:52.920
 Was bringt der dann?

00:05:52.920 --> 00:05:56.060
 Willst du da jetzt wirklich in die Details gehen?

00:05:56.060 --> 00:06:03.940
 Also es gibt ja THC und CBD in Hanf und das THC ist das Berauschende und das CBD ist das, was so ein bisschen eher runterbringt.

00:06:04.480 --> 00:06:11.400
 Und der THC-Gehalt darf halt irgendwie maximal 0,5 Prozent oder was sein in legal vertriebenen Hanfprodukten.

00:06:11.400 --> 00:06:15.100
 Und dementsprechend ist in dem Tee halt mehr CBD als THC.

00:06:15.100 --> 00:06:18.980
 Also ist nicht null, aber ist irgendwie noch was drin und das reicht wahrscheinlich auch schon.

00:06:18.980 --> 00:06:24.440
 Wahrscheinlich müsstest du irgendwie 500 Badewannen voll trinken, damit du was spürst oder so.

00:06:24.440 --> 00:06:25.020
 Ich weiß es nicht.

00:06:25.020 --> 00:06:26.560
 Challenge exzentriert.

00:06:29.360 --> 00:06:32.840
 Okay, ja, sollen wir mal in die Retro starten?

00:06:32.840 --> 00:06:34.460
 Ja, gehen wir mal in die Retro.

00:06:34.460 --> 00:06:49.360
 Ja, wir sind heute ja drei Wochen eigentlich auseinander zur letzten Folge.

00:06:50.640 --> 00:06:56.420
 Ich denke, dass wir jetzt den Zwei-Wochen-Rhythmus wieder beibehalten und nicht nächste Woche gleich schon wieder die nächste raushauen werden.

00:06:56.420 --> 00:07:00.900
 Ich bin ja eh überrascht, dass wir das tatsächlich geschafft haben, diesen Zwei-Wochen-Rhythmus so einzuhalten.

00:07:00.900 --> 00:07:05.300
 Und dementsprechend war das jetzt ein relativ langer Zeitraum, auf den wir zurückblicken.

00:07:05.300 --> 00:07:09.060
 Und ich werde trotzdem versuchen, mich ein bisschen kürzer zu fassen.

00:07:09.060 --> 00:07:12.180
 Responsive Design ist 10 geworden.

00:07:12.180 --> 00:07:13.580
 Responsive Web Design.

00:07:13.580 --> 00:07:17.660
 Beziehungsweise nicht Responsive Design selbst, sondern der Be...

00:07:17.660 --> 00:07:18.020
 Ja, bitte.

00:07:18.020 --> 00:07:18.020
 Ja, bitte.

00:07:20.640 --> 00:07:22.980
 Moritz kann jetzt auch Knöpfchen drücken.

00:07:22.980 --> 00:07:26.260
 Ja, ich sage nicht mehr Moment.

00:07:26.260 --> 00:07:27.740
 Ich spiele die einfach ein.

00:07:27.740 --> 00:07:29.740
 Gnadenlos, egal ob du gerade was sagst.

00:07:29.740 --> 00:07:33.160
 Genau, also der Begriff, das Responsive Web Design ist 10 geworden, genauer gesagt.

00:07:33.160 --> 00:07:37.740
 Geprägt wurde der von Ethan Marcotte, wenn ich das richtig ausspreche.

00:07:37.740 --> 00:07:39.300
 Ja, da frage ich mich auch immer.

00:07:39.300 --> 00:07:43.400
 Der stand ja mal bei der Beyond Tellerrand mit mir im Aufzug.

00:07:43.400 --> 00:07:45.940
 Aber das tut nichts zum Namen, zur Sache.

00:07:45.940 --> 00:07:48.400
 Der hat mir da auch nicht gesagt, wie er ausgesprochen wird, seinen Namen.

00:07:50.640 --> 00:07:54.520
 Ja, also fragst du dich, wie er ausgesprochen wird, oder was...

00:07:54.520 --> 00:07:55.120
 Ja, ich weiß es nicht.

00:07:55.120 --> 00:07:56.320
 Er weiß tatsächlich nicht genau.

00:07:56.320 --> 00:07:57.660
 Ethan Marcotte oder so.

00:07:57.660 --> 00:07:58.400
 Ethan Marcotte.

00:07:58.400 --> 00:07:58.900
 Egal.

00:07:58.900 --> 00:08:06.160
 Jedenfalls hat er jetzt auch am 25. Mai einen Artikel veröffentlicht, wo er darüber spricht,

00:08:06.160 --> 00:08:08.580
 wie er damals diesen Begriff geschaffen hat.

00:08:09.480 --> 00:08:15.580
 Allerdings muss man sagen, also bereits 2001 wurde Audi.com gelauncht und war die erste

00:08:15.580 --> 00:08:17.840
 Seite, die sich an die Browserbreite adaptiert hat.

00:08:17.840 --> 00:08:20.300
 Aber das war natürlich noch ziemlich limitiert.

00:08:20.300 --> 00:08:22.720
 Irgendwie EA hat das tatsächlich dynamisch geschafft.

00:08:22.720 --> 00:08:27.020
 In Netscape musste dann jedes Mal beim Resizing die Seite wohl neu geladen werden.

00:08:27.020 --> 00:08:32.220
 Aber 2010 war es dann soweit, dass man Media Queries tatsächlich auch einsetzen konnte.

00:08:32.360 --> 00:08:38.580
 Und Ethan Marcotte hat den Begriff eben geprägt als Fluid Grid, Flexible Images und Media Queries.

00:08:38.580 --> 00:08:43.540
 Und den Originalartikel und diesen Jubiläumsartikel verlinke ich natürlich auch entsprechend in

00:08:43.540 --> 00:08:44.240
 den Shownotes.

00:08:44.240 --> 00:08:45.960
 Ja, dann habe ich jetzt...

00:08:45.960 --> 00:08:46.200
 Ja, Moment.

00:08:46.200 --> 00:08:47.900
 Darf ich da kurz einhaken?

00:08:47.900 --> 00:08:48.540
 Aber selbstverständlich.

00:08:48.540 --> 00:08:51.300
 Ich weiß nicht genau.

00:08:51.300 --> 00:08:56.060
 Ich finde die Seite gerade nicht mehr, die mir dazu einfällt, weil du sagst, die haben

00:08:56.060 --> 00:09:01.560
 irgendwie schon ein Design gehabt damals, das sich an die Breite des Browsers anpasst.

00:09:01.560 --> 00:09:06.720
 Ich meine, dass diese Demo noch irgendwo tatsächlich sogar gibt, aber...

00:09:06.720 --> 00:09:09.720
 Wichtig ist, also da gab es mal eine Seite, ich habe sie gerade gesucht, die gibt es glaube

00:09:09.720 --> 00:09:10.120
 ich nicht mehr.

00:09:10.120 --> 00:09:15.600
 Das hieß glaube ich mal liquiddapsive.com, weil das, was du gerade ansprichst, ist Liquid

00:09:15.600 --> 00:09:16.220
 Design.

00:09:16.220 --> 00:09:17.700
 Das gibt es schon sehr, sehr lange.

00:09:17.700 --> 00:09:18.960
 Das konnte man auch mit Tables machen.

00:09:18.960 --> 00:09:22.300
 Die Begrifflichkeiten sind glaube ich erst später dann tatsächlich dazugekommen.

00:09:22.300 --> 00:09:25.000
 Also Responsive Web Design war so der ursprüngliche Begriff, den ihr eben gebringt.

00:09:25.000 --> 00:09:29.060
 Genau, das wurde später Liquid Design genannt, das, was du gerade angesprochen hast, also

00:09:29.060 --> 00:09:32.440
 das, was sich so auf 100% aufspannt und dann irgendwie anpasst.

00:09:32.440 --> 00:09:36.600
 Dann gibt es Adaptive Design.

00:09:36.600 --> 00:09:41.460
 Das ist mit festen Breakpoints, wo die Breite dann aber normalerweise genau fest ist.

00:09:41.460 --> 00:09:45.680
 Das heißt, du springst dann ab einem bestimmten Breakpoint zum kleineren und hast keine Zwischenschritte

00:09:45.680 --> 00:09:45.900
 mehr.

00:09:46.720 --> 00:09:49.200
 Und dann das Responsive Design ist so ein Mischmasch da draus.

00:09:49.200 --> 00:09:53.720
 Das wollte ich nur noch mal kurz, weil die Begriffe oft irgendwie durcheinander geworfen

00:09:53.720 --> 00:09:56.000
 werden und mir das irgendwie immer so ein bisschen auf die Nerven geht.

00:09:56.000 --> 00:10:01.880
 Deswegen mal ganz kurz das nochmal erklärt, dass es da irgendwie diese drei gibt es, die mir

00:10:01.880 --> 00:10:03.140
 da einfallen und ja.

00:10:03.140 --> 00:10:05.120
 Um unserem Lehrauftrag gerecht zu werden.

00:10:05.120 --> 00:10:05.860
 Unsere.

00:10:06.740 --> 00:10:08.940
 Ja, hallo, hallo an Fabian an der Stelle.

00:10:08.940 --> 00:10:11.760
 Er weiß, wer gemeint ist.

00:10:11.760 --> 00:10:13.360
 Jetzt aber keine Insider mehr.

00:10:13.360 --> 00:10:14.160
 Gut.

00:10:14.160 --> 00:10:14.400
 Genau.

00:10:14.400 --> 00:10:16.460
 So, damit bin ich eigentlich durch.

00:10:16.460 --> 00:10:19.180
 Ach nee, eine Sache wollte ich noch sagen, auch wenn es eigentlich nicht retro ist, eigentlich

00:10:19.180 --> 00:10:21.240
 gehört es noch zum Getränk der Woche.

00:10:22.160 --> 00:10:26.580
 Du hast gestern wieder ein bisschen über WordPress geflucht und weil wir es von Almdudler

00:10:26.580 --> 00:10:29.260
 hatten, die Almdudler-Seite ist mit WordPress gemacht.

00:10:29.260 --> 00:10:34.800
 Also auch so große Firmen und bekannte Marken setzen immer wieder auf WordPress.

00:10:34.800 --> 00:10:41.500
 Es gibt eine Menge, also, naja, nur weil es viele benutzen muss, es ja nicht gut sein.

00:10:41.500 --> 00:10:42.640
 Nee, natürlich nicht.

00:10:42.640 --> 00:10:45.640
 Leute ist scheiße, Millionen fliegen können nicht irren.

00:10:45.640 --> 00:10:49.140
 Genau.

00:10:50.000 --> 00:10:54.540
 Ich kann auch mal ganz kurz sagen, vielleicht gibt es dafür eine ganz leichte Lösung oder

00:10:54.540 --> 00:10:55.660
 vielleicht bin ich auch einfach zu blöd.

00:10:55.660 --> 00:10:59.160
 Ich will das nicht ausschließen, aber ich kann mal ganz kurz sagen, was unser Problem

00:10:59.160 --> 00:10:59.360
 war.

00:10:59.360 --> 00:11:03.960
 Also, falls einer von den Hörern irgendwie das gleiche Problem schon mal hat und das gelöst

00:11:03.960 --> 00:11:08.580
 hat oder sagt, ihr seid doch alle doof und riecht nach Lulu, hier, guck mal, da den einen

00:11:08.580 --> 00:11:11.380
 Knopf hätte zu drücken müssen, dann gerne her damit.

00:11:11.380 --> 00:11:16.900
 Also, das Problem ist bei unserer Seite, naja, wir haben die Performance.

00:11:16.900 --> 00:11:21.660
 Also, letzten Endes geht es darum, dass irgendwie so Cache-Header richtig gesetzt werden und

00:11:21.660 --> 00:11:24.860
 ja, das ist es im Prinzip weitestgehend schon.

00:11:24.860 --> 00:11:26.380
 Und dafür hatte ich halt ein Plugin installiert.

00:11:26.380 --> 00:11:31.560
 Es hat aber eine andere Menge, eine andere, eine Menge, andersrum, eine Menge anderer Quatsch

00:11:31.560 --> 00:11:33.220
 verursacht, der irgendwie genervt hat.

00:11:34.220 --> 00:11:39.540
 Also, es war so ein Caching-Plugin und dann waren da irgendwie veraltete Stände irgendwie

00:11:39.540 --> 00:11:39.980
 auf der Seite.

00:11:39.980 --> 00:11:43.160
 Manchmal gingen irgendwelche Links nicht mehr und das haben wir dann wieder rausgeworfen und

00:11:43.160 --> 00:11:45.080
 erst gedacht, oh ja, geht ja immer alles immer noch toll.

00:11:45.080 --> 00:11:51.320
 Aber dann, wenn du das Ding dann nochmal durch den Chrome Performance Audit geschickt

00:11:51.320 --> 00:11:54.160
 hast, hat es gesagt, naja, es ist nicht so gut.

00:11:55.920 --> 00:11:59.300
 Ich habe das Gefühl, diese WordPress-Templates, die laden eine Menge Kram, den man eigentlich

00:11:59.300 --> 00:12:01.380
 gar nicht will, also den man gar nicht braucht im Template.

00:12:01.380 --> 00:12:02.700
 Also, so WordPress-eigene Sachen.

00:12:02.700 --> 00:12:06.200
 Und wieso ist das überhaupt?

00:12:06.200 --> 00:12:08.680
 Gibt es, warum gibt es da nicht einfach irgendeinen Knopf, den ich drücken kann und sagen

00:12:08.680 --> 00:12:12.440
 kann, hey, das ist jetzt, also, was hat das alles im Template verloren?

00:12:12.440 --> 00:12:13.180
 Wieso brauche ich das?

00:12:13.180 --> 00:12:16.320
 Das ist doch bestimmt nur für irgendwelche bestimmten Standard-Templates gedacht.

00:12:16.580 --> 00:12:19.380
 Aber wenn ich ein Custom-Template habe, dann brauche ich das nicht.

00:12:19.380 --> 00:12:22.440
 Also, ich hätte am liebsten gar kein WordPress, sondern irgendwie was anderes.

00:12:22.440 --> 00:12:28.500
 Aber wir sind, ich bin derzeit sehr dankbar, dass uns ganz viel von der Podcast-Geschichte

00:12:28.500 --> 00:12:32.880
 durch das Podlove-Projekt abgenommen wird und das basiert nun mal momentan noch auf WordPress.

00:12:32.880 --> 00:12:35.100
 Deswegen sind wir da gelandet.

00:12:35.100 --> 00:12:39.840
 Vielleicht steigen wir da irgendwann auf die neuere Variante davon um, aber ich glaube, die

00:12:39.840 --> 00:12:42.920
 ist noch sehr am Anfang, wenn ich das richtig mitbekommen habe.

00:12:44.940 --> 00:12:46.920
 Genau, meine Retro.

00:12:46.920 --> 00:12:50.980
 Es sind verschiedene, mehrere Punkte.

00:12:50.980 --> 00:12:54.380
 Der erste ist, ich habe mich ein bisschen mit Tastaturen beschäftigt.

00:12:54.380 --> 00:12:58.780
 Ich habe überlegt, ich hätte gerne eine neue Tastatur für mich bei mir zu Hause.

00:12:58.780 --> 00:13:05.720
 Und ich bin da so in so ein Rabbit Hole reingeklettert und bin bis heute nicht wieder rausgekommen.

00:13:05.720 --> 00:13:10.540
 Und es ist irgendwie, naja, ich mache das ja öfter mit verschiedenen Sachen, aber das war

00:13:10.540 --> 00:13:12.940
 irgendwie ein bisschen frustrierend mal wieder.

00:13:14.100 --> 00:13:16.140
 Na ja, was will man denn haben?

00:13:16.140 --> 00:13:19.220
 Oder ich meine, dann guck, also wie gehe ich an sowas ran?

00:13:19.220 --> 00:13:22.220
 Ich gucke mal im Netz, was gibt es denn so?

00:13:22.220 --> 00:13:27.840
 Und das kann schon immer ein paar Tage dauern, bis ich mir dann so einen Überblick verschafft

00:13:27.840 --> 00:13:30.920
 habe, was ist denn so der Stand der Technik?

00:13:31.440 --> 00:13:37.740
 Und dann kommt man so drauf, naja, vielleicht will man eine mechanische Tastatur haben, weil

00:13:37.740 --> 00:13:38.860
 das hat man halt heute so.

00:13:38.860 --> 00:13:41.160
 Ich glaube, der Konstantin hat auch eine, aber die ist relativ laut.

00:13:41.160 --> 00:13:41.940
 Ich habe eine, die ich habe immer so schön, ja.

00:13:41.940 --> 00:13:45.280
 Kannst du mir mal sagen, weißt du, was für Switches du da drin hast?

00:13:45.280 --> 00:13:46.400
 Äh, nee.

00:13:47.060 --> 00:13:52.480
 Es gibt ja irgendwie so Red Cherry und Brown Cherry und nee, müsste ich jetzt nachgucken,

00:13:52.480 --> 00:13:53.180
 weiß ich gar nicht.

00:13:53.180 --> 00:13:54.560
 Das ist so verrückt.

00:13:54.560 --> 00:13:59.280
 Ich bin da auf Seiten gelandet, wo dann stand, ja, diese Tastatur, die gibt es mit roten

00:13:59.280 --> 00:14:02.220
 Switches, mit blauen Switches und mit braunen Switches.

00:14:02.300 --> 00:14:07.540
 Und ich dann so, äh, Moment mal, äh, bei dem Bild, äh, wenn ich mir die andere Tastatur

00:14:07.540 --> 00:14:10.620
 angucke, mit deinen, an den Farben unterscheidet sich da gar nichts.

00:14:10.620 --> 00:14:14.620
 Bis ich dann rausgefunden habe, das ist das innen drin und das spielt irgendwie eine Rolle

00:14:14.620 --> 00:14:15.800
 mit, wie taktil ist das und wie laut ist das am Ende.

00:14:15.800 --> 00:14:18.500
 Also das siehst du auch gar nicht, wenn ich jetzt mal eine Tastatur hier rausziehe.

00:14:18.500 --> 00:14:19.500
 Doch, man sieht's.

00:14:19.500 --> 00:14:19.960
 Blau.

00:14:19.960 --> 00:14:21.160
 Ah, ist, hast du?

00:14:21.160 --> 00:14:21.720
 Okay, dann.

00:14:21.720 --> 00:14:23.480
 Was, was hast du in deiner?

00:14:23.480 --> 00:14:24.360
 Blau.

00:14:24.360 --> 00:14:25.300
 Blau.

00:14:25.300 --> 00:14:25.720
 Blau, okay.

00:14:25.720 --> 00:14:29.920
 Ja, also ich hab, ich, was ich irgendwie gehört habe, so rot ist irgendwie ein bisschen leiser und

00:14:29.920 --> 00:14:34.300
 Blau ist irgendwie schon relativ laut und, äh, ach, was weiß ich, ich hab's ja noch nie

00:14:34.300 --> 00:14:38.380
 ausprobiert, ich hab mich da nur mit, mit der Theorie quasi beschäftigt, ähm, dann

00:14:38.380 --> 00:14:43.680
 möchte man vielleicht, ähm, eine Tastatur haben, die besonders klein ist und dann landet

00:14:43.680 --> 00:14:48.640
 man mal bei so Layouts, ähm, die nicht mal mehr Pfeiltasten haben, das sieht super schick

00:14:48.640 --> 00:14:52.440
 aus, aber ist halt nicht benutzbar, wenn man Developer ist, meiner Meinung nach.

00:14:52.440 --> 00:14:55.960
 Ja, vor allem auch keine spitzen Klammern, du hattest mir eins, ein Layout geschickt ohne

00:14:55.960 --> 00:14:56.920
 spitze Klammern, also.

00:14:57.320 --> 00:15:00.860
 Doch, doch, die haben die spitzen Klammern woanders, weil das amerikanische Layouts sind.

00:15:00.860 --> 00:15:01.700
 Ah, okay.

00:15:01.700 --> 00:15:05.120
 Da ist ja nämlich, ähm, die spitze Klammern-Taste, ich, ich weiß gar nicht, wo die auf dem amerikanischen

00:15:05.120 --> 00:15:09.100
 Layout ist, aber da, ähm, wo die spitze Klammern-Taste ist, bei, bei, bei diesen, bei diesen Tastaturen

00:15:09.100 --> 00:15:12.000
 oder wäre, haben die einfach eine sehr breite Shift-Taste.

00:15:12.000 --> 00:15:15.580
 Äh, ja, genau, das, das ist was, äh, eine, die ich dir da geschickt hab, genau.

00:15:15.580 --> 00:15:20.400
 Ähm, ja, also, die sehen halt super schick aus, diese kleinen Tastaturen, aber da fehlt halt

00:15:20.400 --> 00:15:24.360
 zum Beispiel, äh, meistens halt die kompletten Pfeiltasten, ähm, und dann auch sowas wie

00:15:24.360 --> 00:15:30.240
 Drucken, Einfügen, Post 1, Bild hoch, runter, Ende und sowas, ähm, wo ich dann auch mal

00:15:30.240 --> 00:15:33.000
 überlegt hab, welche von den Tasten benutze ich denn eigentlich regelmäßig, ich hab dann

00:15:33.000 --> 00:15:34.140
 gemerkt, ich benutze nicht alle.

00:15:34.140 --> 00:15:37.900
 Ah ja, genau, ah, und da fällt mir noch was ein, die F-Tasten fehlen da oft auch.

00:15:37.900 --> 00:15:42.380
 Die sind dann irgendwie doppelt belegt mit den, mit den normalen Zahlentasten und dann hast

00:15:42.380 --> 00:15:47.380
 du da, wo du normal die Tilde hast, äh, nee, Quatsch, nicht die Tilde, das Dach und das

00:15:47.380 --> 00:15:52.460
 Gradzeichen, also links von der 1 hast du dann die Escape-Taste, also, nee, äh, damit komm

00:15:52.460 --> 00:15:59.320
 ich nicht klar. Äh, sieht schick aus, aber damit komm ich nicht klar. Ähm, genau, also ich

00:15:59.320 --> 00:16:03.220
 hab, ich hab da mir sehr, sehr viel angeschaut, äh, ich, ich werde, glaub ich, nicht glücklich

00:16:03.220 --> 00:16:07.180
 werden, weil am Ende möchte ich das vielleicht auch noch drahtlos haben, dann, und das soll

00:16:07.180 --> 00:16:11.780
 eine möglichst lange Akkulaufzeit haben und da wird's dann schon schwierig, irgendwie was

00:16:11.780 --> 00:16:17.700
 zu finden, also, äh, die Kombination aus allem, irgendwie leise, äh, mechanisch, taktiles,

00:16:17.700 --> 00:16:22.180
 gutes Feedback, minimalistisches Aussehen, drahtlos, vielleicht auch noch beleuchtet, drahtlos

00:16:22.180 --> 00:16:27.540
 und beleuchtet, mit langer Akkulaufzeit, vergiss, das geht einfach nicht. Also, ich möchte Dinge

00:16:27.540 --> 00:16:32.400
 mal wieder, die in der Kombination nicht funktionieren, ähm, das werden wir vielleicht in dem Podcast

00:16:32.400 --> 00:16:37.080
 noch öfter hören, mit anderen Sachen, das ist, ja. Also, wenn drahtlos, wenn du dich tatsächlich

00:16:37.080 --> 00:16:41.080
 dafür entscheidest, dann, äh, sag mal bitte Bescheid, wie das heutzutage funktioniert, weil die

00:16:41.180 --> 00:16:45.600
 letzte drahtlose Tastatur, die ich selber benutzt hab, die war, das war bestimmt auch schon

00:16:45.600 --> 00:16:50.140
 irgendwie 15 Jahre oder so her und da hab ich mir geschworen, nie wieder, weil das irgendwie

00:16:50.140 --> 00:16:54.700
 damals noch so frickelig war mit der Verbindung, dass da ständig dann irgendwie Zeichen ausgefallen

00:16:54.700 --> 00:16:59.700
 sind oder Zeichen mehrfach, äh, aufgetaucht sind und das ist beim Programmieren total ätzend.

00:17:00.980 --> 00:17:05.440
 Aber das ist mit Sicherheit mittlerweile ganz anders. Ich hab nur keine Erfahrungswerte, weil

00:17:05.440 --> 00:17:09.940
 ich seitdem immer, auch Mäuse, immer, äh, kabelgebunden, gekauft habe.

00:17:09.940 --> 00:17:16.200
 Ja, ähm, genau. Also, ähm, ich weiß nicht genau, wie stabil diese Bluetooth-Geschichte

00:17:16.200 --> 00:17:21.420
 ist, ähm, das scheint aber mittlerweile auch, obwohl, nee, das stimmt gar nicht, ähm, ich

00:17:21.420 --> 00:17:24.860
 hab eine Bluetooth-Tastatur und die funktioniert, also, die hab ich, die benutze ich eigentlich

00:17:24.860 --> 00:17:28.240
 immer nur mit dem iPad, ähm, die funktioniert aber eigentlich ganz gut. Also, da hatte ich

00:17:28.240 --> 00:17:32.300
 jetzt selten irgendwie Ausfälle, aber programmiert hab ich mit der nicht. Also, ich hab auch nicht

00:17:32.300 --> 00:17:39.520
 wirklich viel geschrieben mit der. Ähm, was aber heute der Stand der Technik ist, ist, ähm,

00:17:39.520 --> 00:17:44.320
 dass, also, gerade, es gibt auch drahtlose Gaming-Tastaturen und die können natürlich, das darf natürlich

00:17:44.320 --> 00:17:47.560
 gar nicht passieren, da darf nichts ausfallen, du darfst auch eigentlich keine Verzögerung

00:17:47.560 --> 00:17:51.640
 haben. Ja. Und, äh, wie das funktioniert, ist, die haben halt, die funktionieren nicht über

00:17:51.640 --> 00:17:55.600
 Bluetooth, sondern du hast so ein kleines, äh, so ein kleines USB-Nupsi, was du an deinen

00:17:55.600 --> 00:17:59.840
 Rechner dran steckst und die bauen ihre eigene Funkverbindung auf in einem bestimmten, in einem

00:17:59.840 --> 00:18:04.800
 äh, äh, Funk, äh, Bereich und dann, äh, scheint das, das scheint sehr, sehr schnell

00:18:04.800 --> 00:18:09.800
 zu funktionieren, also, ist wohl genauso, fast, weiß ich nicht, genauso oder fast genauso

00:18:09.800 --> 00:18:13.720
 gut wie Kabel. Das ist wohl der Stand der Technik bei drahtlos, also, das gibt's mittlerweile

00:18:13.720 --> 00:18:16.880
 und es gibt's auch für Mäuse, also, wenn du auch willst, dass das besonders zuverlässig

00:18:16.880 --> 00:18:20.620
 und schnell ist mit hoher Abtastrate und so, hast du das auch für Mäuse schon, das gibt's

00:18:20.620 --> 00:18:25.520
 auf jeden Fall. Genau. Ähm, ja, damit möchte ich das Tastaturen-Thema abschließen, das geht,

00:18:25.520 --> 00:18:28.780
 das ist eigentlich auch schon viel zu lange, ähm, weil es geht noch weiter.

00:18:29.820 --> 00:18:33.400
 Ähm, genau das mit dem, äh, genau, hatte ich in der Retro noch das Bier-Opening, das

00:18:33.400 --> 00:18:38.020
 haben wir jetzt schon gemacht. Ähm, das ist dann kein Teil mehr der Retro, aber was noch

00:18:38.020 --> 00:18:44.320
 Teil der Retro ist, ist, äh, wir hatten die Tage einen kleinen Spike in unseren Downloads

00:18:44.320 --> 00:18:47.760
 äh, und ich hab mich in der Statistik dann gefragt, Mensch, wo kommt denn der her?

00:18:47.760 --> 00:18:51.140
 Wir haben doch grad, äh, gar nicht unseren Freunden eine Mail geschrieben oder wir haben

00:18:51.140 --> 00:18:55.140
 doch grad, äh, irgendwie gar keine besondere Werbung oder irgendwas gemacht, äh, für den

00:18:55.140 --> 00:19:00.720
 Podcast, wo kommt denn jetzt dieser Spike her? Und, ähm, dann bin ich zufällig drauf gestoßen,

00:19:00.720 --> 00:19:03.340
 dass wir jetzt, äh, Bestandteil eines

00:19:03.340 --> 00:19:21.260
 T3N-Artikels sind, äh, auf der T3N-Seite, den verlinken wir dann auch, ähm, der, der Podcasts listet, die zum Thema Web-Development, äh, was sagen. Ähm, und offenbar, obwohl dieser Artikel schon etwas älter ist, äh, wird der immer wieder geupdatet.

00:19:21.260 --> 00:19:33.780
 Und es hat wohl tatsächlich das Update gereicht, um, äh, in diversen, äh, weiß ich nicht jetzt, Feedreadern oder sonst irgendwo zu landen oder keine Ahnung, vielleicht gibt's auch Leute, die manuell jeden Tag auf den Artikel gehen und gucken, ob, ob, ob der aktualisiert wurde.

00:19:33.780 --> 00:19:43.300
 Auf jeden Fall sind wir da jetzt mit dabei. Ähm, und, äh, ja, das, das hat offenbar dafür gesorgt, dass ein paar Leute, ein paar mehr Leute uns gefunden haben und wir freuen uns sehr.

00:19:43.300 --> 00:19:54.660
 Ja, und, äh, da wurde auch sehr nett über uns geschrieben. Also, da steht auch was von Flöten-Solo drin, das hab ich nie gespielt. Also, wer, wer, wer euch erzählt, dass wir hier schon mal Blockflöte gespielt haben in, äh, bei Wo wir sind, ist vorne, das ist eine glatte Lüge.

00:19:54.660 --> 00:19:55.060
 Das wäre doch verrückt.

00:19:55.060 --> 00:19:57.040
 Das soll mir, da soll mir mal einer das Gegenteil beweisen.

00:19:57.040 --> 00:20:05.020
 Also, herzlich willkommen an, an alle Neuhörer und Neuhörerinnen, die noch nicht während unserer halbstündigen Retro eingeschlafen sind.

00:20:05.300 --> 00:20:12.120
 Gut, das war, das war der kurze Applaus, der kurze stürmische.

00:20:12.120 --> 00:20:18.080
 Okay, ähm, dann würde ich sagen, kommen wir jetzt zur...

00:20:18.080 --> 00:20:21.260
 Oh, ich hätte vielleicht selbst kicken sollen.

00:20:21.260 --> 00:20:22.560
 Sollen wir es nochmal machen?

00:20:22.560 --> 00:20:24.360
 Sag mir mal an, ich drücke, okay.

00:20:24.360 --> 00:20:30.080
 Okay, du, du drückst und ich sage, jetzt kommen wir zur...

00:20:30.080 --> 00:20:32.440
 Die Property der Woche.

00:20:34.600 --> 00:20:37.980
 Die Property der Woche, auch nochmal schön geechoet.

00:20:37.980 --> 00:20:39.340
 Zur, zur, der Property der Woche.

00:20:39.340 --> 00:20:41.360
 So ein Quatsch.

00:20:41.360 --> 00:21:00.980
 Ja, diesmal inspiriert von csstrix.com und zwar haben die auf ihrer Seite, ich muss grad nochmal, äh, selber aufmachen, mit meiner schönen, laut klappernden Tastatur, ähm, auf den Überschriften und auch auf diversen anderen Links haben die so einen schönen, ja, nicht Regenbogen, aber so einen schönen Farbverlauf, den man sieht.

00:21:00.980 --> 00:21:06.600
 Also wenn man die Headlines von den Artikeln hovert oder auch diesen Read-Article-Link, da ist so ein Farbverlauf drauf.

00:21:07.420 --> 00:21:10.000
 Und ich hab das gesehen und hab gedacht, okay, wie haben die das denn gemacht?

00:21:10.000 --> 00:21:24.380
 Äh, früher hat man das, äh, gab's da JavaScript, äh, Libraries dafür, die dann nix anderes gemacht haben als Startwert, Endwert in Farbe und dann wird jedes, jeder Buchstabe, jedes Wort in ein eigenes Span gehauen und die, die Fontfarbe angepasst.

00:21:25.280 --> 00:21:38.280
 Aber, ja, aber dann, da hat dann wirklich jeder Buchstabe, richtig, jeder Buchstabe hat eine eigene Farbe und bei deren Effekt sieht man halt wirklich innerhalb eines Buchstabens auch, dass da ein Verlauf drin ist.

00:21:38.780 --> 00:21:45.640
 Und dann hab ich mir das angeschaut, wie das gemacht ist und bin dabei auf drei Properties, na gut, eigentlich sind es sogar vier Properties, ähm, gestoßen, die man dafür braucht.

00:21:45.640 --> 00:21:49.260
 Ähm, das sind also vier Properties der Woche sogar, wenn man so will.

00:21:50.260 --> 00:22:02.140
 Und ich hab dazu eine kleine Demo gebastelt, den Link, den gibt's natürlich auch in die Shownotes, der Moritz kann auch mal schon mal draufklicken, weil ich glaube, es macht, es macht immer Sinn, wenn man die tatsächlich nebenher offen hat.

00:22:02.140 --> 00:22:08.700
 Das wurde uns auch als Feedback gegeben, dass es manchmal schwierig ist, da zu folgen, ähm, ja, aber das liegt irgendwie in der Natur der Sache.

00:22:08.700 --> 00:22:19.940
 Also wir können natürlich immer nur beschreiben, was man denn theoretisch sieht, weil nicht jeder die Gelegenheit hat, das nebenher zu verfolgen, aber es macht auf jeden Fall Sinn, wenn man die Gelegenheit, die Möglichkeit hat, beim Hören auch die Links zu öffnen.

00:22:20.260 --> 00:22:37.640
 Und wer das offen hat, äh, für die anderen beschreibe ich es mal so gut es geht, der sieht, äh, unsere, unsere Namen, wo wir sind, ist vorne, eben genau mit so einem Verlauf, natürlich angepasst mit unseren Farben und ich hab auch zur Demonstration einen Border drumherum gemacht, damit man das eine Property noch besonders gut nachvollziehen kann.

00:22:37.640 --> 00:22:41.180
 Und wer das offen hat, der klickt am besten mal alle drei Checkboxen kurz weg.

00:22:41.720 --> 00:22:50.680
 Und dann sieht man Kästchen um die Worte, das ist auch zweizeilig, extra groß geschrieben, dass es zweizeilig umbricht und im Hintergrund ist ein Verlauf.

00:22:50.680 --> 00:22:56.280
 Das heißt, der eigentliche Verlauf, den man sieht, der Gradient, das ist wirklich nur ein ganz normaler Background-Gradient.

00:22:56.700 --> 00:23:01.340
 Also das wäre so die, ja, die nullte Property, sag ich mal, weil den Gradient brauchen wir natürlich auf jeden Fall.

00:23:02.480 --> 00:23:12.040
 Und wenn ich dann, äh, Webkit Text-Fill-Color transparent aktiviere, dann verschwindet der Text komplett, weil eben die Text-Fill-Farbe transparent wird.

00:23:12.040 --> 00:23:16.080
 Äh, warum Text-Fill-Color und nicht einfach nur Color?

00:23:16.080 --> 00:23:20.820
 Es funktioniert, soweit ich das getestet habe, auch mit Color, wenn ich einfach Color auf Transparent setze.

00:23:20.820 --> 00:23:28.600
 Ähm, ich kann nur davon ausgehen, dass es vielleicht als Fallback gedacht ist, weil Color wird eben überall in allen Browsern akzeptiert.

00:23:28.720 --> 00:23:33.800
 die Text-Fill-Color nur in manchen, vor allem denke ich natürlich auch wieder Can-I-Use, wie gewohnt.

00:23:33.800 --> 00:23:38.020
 Ähm, vielleicht gab es aber auch Probleme in bestimmten Browsern, ich weiß es nicht, ich kann es nicht nachvollziehen.

00:23:38.020 --> 00:23:42.120
 Also hier macht wird es auf CSS-Trix, jedenfalls mit Webkit Text-Fill-Color.

00:23:42.120 --> 00:23:50.060
 Interessant ist dabei, dass das wiederum ein Attribut ist, äh, ein Attribut ist, ähm, da hatten wir es schon mal drüber,

00:23:50.060 --> 00:23:54.600
 dass überall mit Prefix, mit Webkit Prefix eingesetzt wird.

00:23:54.600 --> 00:24:07.560
 Also egal ob Chrome oder Firefox oder, äh, der neue Edge, der jetzt auch auf Chromium basiert, ähm, auch Safari, überall brauche ich das Webkit Text-Fill-Color, äh, weil das nämlich ein Non-Standard-Attribut ist.

00:24:07.560 --> 00:24:15.800
 Also das ist in keinem Standard so festgeschrieben, aber es wird in den ganzen schönen Evergreen-Browsern, die wir heutzutage haben, unterstützt.

00:24:16.760 --> 00:24:23.220
 Also IE natürlich nicht, der ist da explizit mit ausgenommen. Ähm, Unterstützung über 93 Prozent, also das ist schon ganz ordentlich.

00:24:23.220 --> 00:24:24.860
 Dann.

00:24:24.860 --> 00:24:28.740
 Ja, ich hab's mir, ich hab's mir, ich hab mich schon gewundert, dass es funktioniert, weil ich hab's im Firefox offen.

00:24:28.740 --> 00:24:29.960
 Ja.

00:24:29.960 --> 00:24:37.520
 Aber das ist, das wurde ja, da irgendwann gab's ja mal diesen Switch, wo die Mozilla-Entwickler gesagt haben, ähm, wir wollen jetzt auch die Webkit-Geschichten.

00:24:37.520 --> 00:24:46.300
 Genau, also es gibt ja noch diverse Mods, Prefix-Sachen, aber ich glaube, gerade bei den neueren Sachen ist es eigentlich immer inzwischen auch Webkit, wenn's noch nicht im Standard ist.

00:24:46.740 --> 00:24:57.180
 Jedenfalls kommt als nächstes dann das Attribut, äh, Webkit-Background-Clip oder auch nur Background-Clip, je nach Browser, das aktuell als experimentell eingestuft ist.

00:24:57.180 --> 00:25:13.560
 Und, äh, das wird gesetzt auf den Wert Text und dadurch wird der Hintergrund zugeschnitten, eben ein Clipping, wie man das ja auch vom Clip-Attribut schon kennt, wo man Pfade angeben kann, äh, wird beschnitten, der Hintergrund auf den Text und dann sieht man schon ganz schön den Verlauf über den Font.

00:25:14.080 --> 00:25:17.600
 Ich versuch's jetzt auch mal wieder zu beschreiben, weil man's natürlich beim Hören nicht sehen kann.

00:25:17.600 --> 00:25:25.360
 Das Problem ist dabei, das ist ein Inline-Element, auf das ich das jetzt gesetzt habe, das so groß ist, dass es zweizeilig wird.

00:25:25.900 --> 00:25:47.780
 Und dann sieht man, der Verlauf ist von links nach rechts, äh, pink nach blau und das W von wo wir sind, ist vorne, ist schön pink und das vorne ist aber quasi komplett blau, also es bricht um und der Verlauf geht aber nicht von links nach rechts über das Wort vorne, sondern das vorne wäre ja eigentlich ganz rechts am Bildschirmrand, wenn's nicht umbrechen würde und wäre dann blau und bricht aber komplett blau um.

00:25:47.780 --> 00:26:00.120
 Und da gibt's jetzt, äh, genau, äh, zu Background-Clip hab ich noch vergessen was zu sagen, äh, dieser Text-Wert, der ist erst in, ähm, im CSS-Backgrounds-and-Borders-Module-Level-4 definiert.

00:26:00.360 --> 00:26:25.180
 Ähm, genau, und für dieses, dieses Umbruch-Problem, und das ist auch der Grund, warum ich den Border gesetzt hab jetzt für die Demo, es ist so, wenn ein Inline-Element mit Border oder sonstigen Styles umbricht, dann bricht der Border in der Mitte durch.

00:26:25.180 --> 00:26:40.220
 Also, bei, bei der Zeile ist es jetzt so, wo wir sind, ist, ist in einer Zeile, vorne ist das zweite, die zweite Zeile, wo wir sind, ist, da ist rechts kein Border, der hört, der ist einfach nicht da und in der zweiten Zeile geht's dann, äh, links ohne Border weiter und der Border endet erst ganz rechts.

00:26:40.220 --> 00:26:42.500
 Weiß nicht, ob man das jetzt sich vorstellen kann.

00:26:42.500 --> 00:26:44.180
 Jedenfalls wird der Border kaputt gemacht.

00:26:44.180 --> 00:26:45.100
 Wenn ich jetzt aber...

00:26:45.100 --> 00:26:48.020
 Link anklicken, Shownotes benutzen.

00:26:48.020 --> 00:26:54.680
 Ja, richtig, also es macht einfach in dem Fall Sinn und es ist eigentlich immer bei den Properties so, dass es, äh, schon sinnvoll ist, sich das anzuschauen.

00:26:55.180 --> 00:26:59.900
 Wenn ich das jetzt aktiviere, dann hab ich wunderschön um beide Zeilen außenrum einen Border.

00:26:59.900 --> 00:27:07.800
 Und ich könnte mir vorstellen, dass das auch in einigen anderen Situationen sehr hilfreich ist, jetzt nicht nur für dieses fancy, äh, Regenbogen-Gradient-Gedöns.

00:27:07.800 --> 00:27:10.260
 Ähm, genau.

00:27:10.840 --> 00:27:20.780
 Also man sieht einerseits den Border, der jetzt um beide Zeilen drumherum ist, aber auch der Verlauf ist jetzt schön in beiden Zeilen gleichmäßig verteilt, von Pink nach Blau, von links nach rechts, bei beiden Worten.

00:27:20.780 --> 00:27:26.280
 Und das in der Kombination ergibt eben diesen tollen Regenbogen, äh, ja, Gradient-Effekt.

00:27:27.280 --> 00:27:31.220
 Und das fand ich einfach irgendwie schick und das hab ich auch so noch nirgends anders gesehen.

00:27:31.220 --> 00:27:35.720
 Und das waren gleich drei Attribute auf einmal, die ich noch nicht kannte.

00:27:35.720 --> 00:27:38.460
 Und das fand ich toll, deswegen wollte ich's teilen.

00:27:38.460 --> 00:27:40.660
 Ja, super, echt gut.

00:27:40.660 --> 00:27:42.840
 Also ich find's, also ich, auf jeden Fall.

00:27:45.400 --> 00:27:49.120
 Wir sollten's mit dem Selbstbeklatschen, glaub ich, nicht übertreiben.

00:27:49.120 --> 00:27:50.580
 Was, warum?

00:27:50.580 --> 00:28:00.900
 Äh, also, wer, also wer, wer den, wer den Titel und, und die Beschreibung von unserem Podcast gelesen hat und dann noch zuhört und dann sich darüber aufregt, dass wir uns selbst beklatschen, der ist wirklich selbst schuld.

00:28:00.900 --> 00:28:04.140
 Außerdem sind die Leute auch selber schuld, wenn's halt nie negative Kritik gibt.

00:28:04.140 --> 00:28:06.680
 Also, dann fühlen wir uns halt einfach geil.

00:28:06.680 --> 00:28:11.420
 Damit kommen wir zum Geil-Teil.

00:28:11.420 --> 00:28:13.100
 Nee, Spaß, das, äh, noch, noch nicht.

00:28:13.100 --> 00:28:13.440
 Noch nicht.

00:28:13.440 --> 00:28:15.380
 Äh, hast du noch, hast du noch was dazu?

00:28:15.400 --> 00:28:16.320
 Konstantin.

00:28:16.320 --> 00:28:18.800
 Hattig.

00:28:18.800 --> 00:28:22.100
 Das darfst du nicht rausschneiden.

00:28:22.100 --> 00:28:24.680
 Nee, wir haben, wir haben noch nicht mal, noch nicht mal unser Tagesthema.

00:28:24.680 --> 00:28:27.360
 Bist du, hast du noch eine Anmerkung zu dem, zur Property?

00:28:27.360 --> 00:28:37.240
 Äh, ich, ich wollte nur sagen, ähm, also dieses Box-Decoration-Break-Clone, das ist, das ist das, ähm, genau.

00:28:37.240 --> 00:28:40.320
 Genau, den Wert hatte ich noch gar nicht genannt, glaub ich, hab ich vergessen.

00:28:40.320 --> 00:28:45.380
 Also, Box-Decoration-Break-Clone sorgt dafür, dass eben die, die, ja, das sagt ja auch.

00:28:45.380 --> 00:28:51.500
 Ist ja eigentlich der Name, wenn man's übersetzt, dass diese Dekorationsbestandteile eben geklont werden auf die nächste Zeile, auch bei Umbruch.

00:28:51.500 --> 00:28:55.440
 Äh, ich glaube, das hätte ich das ein oder andere Mal schon gebraucht.

00:28:56.160 --> 00:29:01.800
 Ähm, das wurde, das kannte ich nicht, also, ich bin mir jetzt grad nicht sicher, ich glaube, äh, Background-Clip, das hab ich schon mal gehört.

00:29:01.800 --> 00:29:05.460
 Ähm, Text-Fill-Color bin ich mir relativ sicher, dass ich das noch nicht kenne.

00:29:05.460 --> 00:29:14.780
 Ähm, aber das, das Box-Decoration-Break-Clone, das hätte ich definitiv schon mal gebraucht.

00:29:14.880 --> 00:29:20.220
 Aber das ist wahrscheinlich, ich glaube, so der letzte Anwendungsfall, wo ich mir das gewünscht hätte, ist wahrscheinlich so acht oder zehn Jahre her.

00:29:20.220 --> 00:29:28.660
 Ähm, und seit, dann hab ich halt, dann, ja, dann hab ich beschlossen, ähm, das, das gibt's nicht, das, äh, also, äh, geht nicht, weil ist nicht.

00:29:29.280 --> 00:29:34.620
 Ähm, und hab das abgehakt, aber sehr gut zu wissen, dass es sowas jetzt gibt, also, ich mein, äh, ist ja schon unglaublich.

00:29:34.620 --> 00:29:37.180
 Also, funktioniert das vielleicht auch mit Hintergrundbildern, wollte ich noch, noch kurz hinzufügen.

00:29:37.180 --> 00:29:40.060
 Also, nicht nur Gradients, sondern einfach so den Hintergrund irgendwie durchscheinen lassen.

00:29:40.060 --> 00:29:45.060
 Und auch dieses, äh, ja, dieses Text-Clipping, also, fand ich einfach cool.

00:29:45.060 --> 00:29:48.780
 Also, schöner Effekt, auch, wenn man dafür drei unbekannte Properties braucht.

00:29:48.780 --> 00:29:55.700
 Aber wie gesagt, die Browser-Abdeckung, also, was ich geschaut habe in den aktuellen Browsern, ich mein, klar, IE darf man sich jetzt gar nicht erst anschauen, IE11.

00:29:56.220 --> 00:30:04.940
 Ähm, aber jetzt mit, mit, mit Edge, seit der auch Evergreen ist, also, in den aktuellen Browsern, ja, funktioniert das und da hat man einen Großteil der User abgedeckt.

00:30:04.940 --> 00:30:09.260
 Geht das im aktuellen Edge, also, ich mein, in, in Edge nicht Chromium?

00:30:09.260 --> 00:30:13.640
 Ähm, kann ich den nicht mehr sagen, weil ich den nicht mehr hab.

00:30:13.640 --> 00:30:14.240
 Du hast den schon?

00:30:14.240 --> 00:30:18.220
 Ich hab, der ist schon, der hat sich bei mir schon aktualisiert auf, auf, äh, Chromium.

00:30:18.220 --> 00:30:19.300
 Ach, von ganz alleine?

00:30:19.300 --> 00:30:19.600
 Mhm.

00:30:19.600 --> 00:30:24.040
 Das find ich ja interessant, weil da warte ich drauf seit ewigen Zeiten.

00:30:24.040 --> 00:30:33.900
 Ja, das erzähl ich auch grad irgendwie Käse, aber, äh, ich öffne mal ganz kurz das CodePen noch in, in dem Edge, der nicht auf dem Dev-Channel ist, ähm, und da funktioniert's jedenfalls.

00:30:33.900 --> 00:30:46.580
 Äh, okay, aber warte mal einen Moment, das kann ich, das kann ich kurz auch machen, ähm, weil ich find das, äh, ich, ich hab eigentlich gedacht, irgendwann, das war mal angekündigt für Anfang des Jahres, dass der automatisch mit dem Windows-Update kommt, der neue Edge.

00:30:46.580 --> 00:30:52.600
 Äh, äh, aber es geht auch mit dem alten, ich hab nämlich den alten hier, da bin ich mir sehr, sehr sicher, dass das noch der alte Edge ist.

00:30:52.600 --> 00:30:58.700
 Ja, ich bin mir jetzt inzwischen auch recht sicher, dass das doch der alte Edge ist, ich hab nämlich den zweimal, äh, in der Taskleiste, ich dachte nur, der hätte sich aktualisiert.

00:30:58.700 --> 00:31:01.480
 Ne, also, es scheint tatsächlich auch schon in Edge zu funktionieren.

00:31:01.480 --> 00:31:05.860
 Oh, was? Pro? CodePen Unlock All of...

00:31:05.860 --> 00:31:09.320
 Was da nicht funktioniert, ist das, äh, Box-Decoration-Break-Clone.

00:31:09.320 --> 00:31:18.840
 Das ist vielleicht so der einzige Abstrich, das heißt, ähm, der Regenbogeneffekt bei CS-Asterix dürfte dementsprechend auch bei Mehrzeihlichkeit nicht funktionieren.

00:31:18.840 --> 00:31:21.960
 Ähm, ja, da seh ich das Problem jetzt aber nicht.

00:31:21.960 --> 00:31:27.460
 Vielleicht haben die auch noch irgendwie ein Fallback für den, für den alten Edge, ich weiß es nicht, aber, äh, ja.

00:31:27.460 --> 00:31:35.180
 Was ich in deinem Beispiel auf jeden Fall, was ich dazu noch sagen wollte, ist, ähm, da kann man auch ein bisschen View lernen, weil ich hab grad gesehen, du hast es mit View.js gebaut.

00:31:35.180 --> 00:31:37.020
 Das wollte ich noch sagen, gut, dass du's sagst.

00:31:37.020 --> 00:31:43.620
 Das hatte ich nämlich eigentlich, ich hatte das schon angedacht ursprünglich auch in unserem, in so einem Trello als, äh, eigenes Geil-Teil.

00:31:43.620 --> 00:31:49.440
 Und dann dachte ich, na komm, ich bastel das jetzt eh wieder mit View, die Demo, äh, dann, dann erwähnst du's mal.

00:31:49.440 --> 00:31:55.980
 Es gibt nämlich jetzt bei CodePen die Möglichkeit, View-Single-File-Components direkt zu bearbeiten.

00:31:55.980 --> 00:31:59.760
 Und aktuell funktioniert das nur über einen Link, wenn man den kennt.

00:31:59.760 --> 00:32:00.500
 Ach.

00:32:00.500 --> 00:32:05.480
 Und zwar CodePen.io slash Pen slash Editor slash View.

00:32:06.100 --> 00:32:12.200
 Und dann kommt man zu einem speziellen Editor, äh, in dem man, wie gesagt, Single-File-Components direkt bearbeiten kann.

00:32:12.200 --> 00:32:16.160
 Und das ist für mich als, als, äh, View-Entwickler ist das natürlich super.

00:32:16.500 --> 00:32:21.500
 Also, ähm, ich hab mich grad noch gefragt, wo ist denn das, wie, wo ist denn der CSS-Tab?

00:32:21.500 --> 00:32:22.120
 Genau.

00:32:22.120 --> 00:32:22.720
 Und wo ist denn der HTML-Tab?

00:32:22.720 --> 00:32:24.500
 Und da ist alles drin.

00:32:24.500 --> 00:32:34.580
 Also, wer das nicht kennt, View-Single-File-Components, ähm, das ist eine Datei, in der ist ein Template-Tag, in der ist, äh, mindestens ein Script-Tag und in der kann ein Style-Tag sein.

00:32:35.540 --> 00:32:45.400
 Und dann hab ich eben eine Datei, meistens .view, in der alles drin ist, äh, da gibt's jetzt wahrscheinlich welche, die das noch nicht kennen und gleich sagen hier so, äh, Separation of Concerns und so.

00:32:45.400 --> 00:32:53.940
 Ähm, aber die, die, die, die Concerns sind ja trotzdem abgekapselt, ich hab ja keine Durchmischung, sondern ich hab ja trotzdem alles an seiner eigenen Stelle, aber eben in eine Datei.

00:32:53.940 --> 00:33:12.860
 Ähm, und alles, was zu einer Komponente gehört, und View ist ja eben component-driven, ähm, ist in einer Datei drin und ich find das sehr sinnvoll und ich arbeite sehr gerne mit View, hab ich schon tausendmal gesagt, und ich arbeite sehr gerne mit Single-File-Components und, äh, das, äh, Code-Pen, das jetzt, ähm, zeigt, ähm, anbietet, zeigt mir, dass ich da nicht der Einzige bin und ich find's toll.

00:33:12.860 --> 00:33:23.920
 Lass uns mal ein View-Projekt bauen, ich hab da, also ich hab da nur ganz, ganz, ganz, äh, naives Basiswissen. Ähm, das können wir sehr gerne mal machen und dann hier darüber,

00:33:23.940 --> 00:33:27.980
 berichten. Wie das für dich so als, äh, Einsteiger quasi dann.

00:33:27.980 --> 00:33:53.560
 Genau, also ich, äh, vielleicht, das wär, ah, warte mal, ich, ich weiß genau, wie wir das machen. Äh, wenn wir, wenn wir nochmal, wenn wir nochmal irgendwie was haben, was, was wir gemeinsam bauen wollen, was jetzt nicht grad, äh, ein WordPress-Template ist, ähm, das kommt ja vielleicht nochmal, dass wir vielleicht eine Demo mal gemeinsam bauen oder so, ähm, dann lass uns das mal über, ähm, das Faust-Code, äh, Remote-Sharing, ich hab keine Ahnung, ich hab, ich hab vergessen, wie's heißt, ähm, machen, dann können wir das,

00:33:53.560 --> 00:34:14.220
 können wir das auch, äh, in, in, in der Quarantäne-Zeit, so, solange wir irgendwie noch, äh, zu Hause sitzen, irgendwie auch mal gemeinsam machen und dann lass uns mal was mit View bauen, ich hab richtig Bock drauf. Äh, ich bin da aber wirklich sehr, sehr, sehr unbedarft und neu, ich glaub, ich versteh die Grundkonzepte, aber ich hab's nie benutzt, nie so richtig benutzt, also ich hab halt mal so, so ein kleines Tutorial gemacht, aber da lernt man ja nicht wirklich, wie so ein Framework funktioniert.

00:34:14.640 --> 00:34:17.480
 Würde mich sehr freuen, wenn ich da meine Begeisterung weitergeben kann.

00:34:17.480 --> 00:34:19.400
 Ja, dann, dann machen wir das doch mal.

00:34:19.400 --> 00:34:19.860
 Sehr schön.

00:34:19.860 --> 00:34:23.740
 Aber vorher muss ich, glaub ich, noch diesen, diesen View-Film gucken, den du mal gefeatured hast, den ich danach nicht geguckt hab.

00:34:23.740 --> 00:34:26.420
 Hast du auch noch nicht geschaut? Mensch, ist aber auch keine gute Voraussetzung.

00:34:26.420 --> 00:34:30.020
 Vielleicht mach ich das, ich hab jetzt dann heute zwei Bier im Kopf, ich kann den, kann den mal im Anschluss dann vielleicht.

00:34:30.020 --> 00:34:30.760
 Alles klar.

00:34:30.760 --> 00:34:32.040
 Ähm, gucken.

00:34:32.580 --> 00:34:55.320
 Dann würde ich sagen, machen wir als nächstes, äh, ein kleines bisschen Werbung und dieses Werbung in, in Airquotes, äh, es wurde uns nahegelegt, äh, dass wir das immer dazu sagen, unsere Spam-Spots, dass das nicht echte Werbung ist, sondern dass das tatsächlich echte Spam-Mails sind, die wir bekommen, ähm, steckt ja eigentlich auch schon im Namen, ähm, die wir vertonen.

00:34:55.320 --> 00:35:08.580
 Genau, das hat man, das war tatsächlich mal Feedback, wir haben tatsächlich mal Feedback, das greifen wir natürlich dann auch sofort hier auf in der Sendung, also wer hier mal, äh, erwähnt werden will, äh, namentlich jetzt so nicht, weil ich wieder vergessen habe, wo das, äh, herkam, ähm, ja, dann, äh, gebt uns Feedback.

00:35:08.580 --> 00:35:09.840
 Wir reagieren da auch drauf.

00:35:09.840 --> 00:35:15.720
 Wenn ihr namentlich erwähnt werden wollt, müsst ihr dazu sagen, dass ihr damit einverstanden seid, dass ihr namentlich erwähnt werdet, sonst werdet ihr nicht namentlich erwähnt.

00:35:15.720 --> 00:35:17.740
 Und wir schicken euch dann ein DSGVO-Formular.

00:35:17.740 --> 00:35:21.820
 Zwei, äh, ich würde sagen, wir schicken einfach zwei.

00:35:21.820 --> 00:35:22.680
 Genau.

00:35:22.680 --> 00:35:23.900
 So schön.

00:35:23.900 --> 00:35:25.340
 Schon kriegen wir kein Feedback mehr.

00:35:25.340 --> 00:35:26.760
 Mist.

00:35:26.760 --> 00:35:30.920
 Nein, äh, genau, äh, Spam-Spot.

00:35:30.920 --> 00:35:35.040
 Echte Spam-Mail vertont von Konstantin Groß, dem wunderbaren Sprecher.

00:35:35.040 --> 00:35:36.020
 Oh, Mensch.

00:35:36.020 --> 00:35:37.520
 Ja, das ist so.

00:35:37.520 --> 00:35:39.200
 Graues Haar.

00:35:39.200 --> 00:35:41.560
 Verjüngungsbalsam.

00:35:41.560 --> 00:35:42.960
 Wahnsinn.

00:35:42.960 --> 00:35:44.820
 Mit der neuen Haarfärber.

00:35:44.820 --> 00:35:46.180
 Graue Haare weg.

00:35:46.180 --> 00:35:48.660
 Graue Locken im Haar.

00:35:48.660 --> 00:35:50.280
 Keine Panik.

00:35:50.280 --> 00:35:52.940
 Wasche es mit Mittel gegen Ergrauen.

00:35:53.900 --> 00:35:55.620
 Grau Haare.

00:35:55.620 --> 00:35:57.200
 Weg damit so.

00:35:57.200 --> 00:36:00.540
 Hier können sie sich problemlos abmelden.

00:36:00.540 --> 00:36:05.380
 Ehemalige dich wiedergewinnen, Selbstvertrauen zurückgewinnen.

00:36:05.380 --> 00:36:07.680
 Neues Haar.

00:36:07.680 --> 00:36:12.340
 Zu Risiken und Nebenwirkungen lesen Sie die Dokumentation oder fragen Sie Ihren Systemadministrator.

00:36:13.920 --> 00:36:17.440
 Du siehst so aus, als wolltest du vor dem Tagesthema Jingle noch was sagen.

00:36:17.440 --> 00:36:19.100
 Ja, auf jeden Fall.

00:36:19.100 --> 00:36:23.400
 Du hast so eine wahnsinnig geile Stefan-Rab-Jingle-Stimme.

00:36:23.400 --> 00:36:25.060
 Also, wirklich.

00:36:25.060 --> 00:36:28.160
 Jetzt haben wir sogar verraten, wo ich das abgekupfert habe, Mensch.

00:36:28.880 --> 00:36:33.760
 Ja, ich meine, ich würde nicht sagen abgekupfert, sehr gut imitiert.

00:36:33.760 --> 00:36:36.720
 So würde ich, also das muss man ja erst mal hinkriegen.

00:36:36.720 --> 00:36:39.600
 Eigentlich spreche ich ja tatsächlich so.

00:36:39.600 --> 00:36:44.800
 Ich bemühe mich nur immer sehr, hier eine professionelle Podcast-Stimme an den Tag zu nehmen.

00:36:44.800 --> 00:36:50.040
 Genau, wenn ihr dem Konstantin mal in echt begegnet, der spricht eigentlich so wie dieser komische Sprecher bei Stefan Raab.

00:36:50.040 --> 00:36:50.360
 Genau.

00:36:50.440 --> 00:37:11.420
 Und da wir jetzt schon irgendwie über 40 Minuten reden, glaube ich, hat der Konstantin mich jetzt dazu gezwungen, dass wir mit dem Thema anfangen.

00:37:11.420 --> 00:37:12.380
 Und nein, das ist nicht geschnitten.

00:37:12.380 --> 00:37:15.660
 Er hat einfach jetzt das Jingle abgespielt, dann kann ich gar nichts mehr anderes machen.

00:37:15.660 --> 00:37:17.140
 Jetzt sind wir nämlich tatsächlich beim Thema.

00:37:17.140 --> 00:37:18.940
 Reicht jetzt auch mal, Mensch.

00:37:18.940 --> 00:37:20.640
 Danke, mit Gewalt.

00:37:20.640 --> 00:37:26.980
 Also genau, das Thema wurde ja ganz am Anfang schon genannt.

00:37:26.980 --> 00:37:33.280
 Also es geht um Dinge, die mal einem als Magie erschienen sind und irgendwann dann zum Alltag gehört haben.

00:37:33.280 --> 00:37:43.740
 Beziehungsweise irgendwann hat man so hinter den Vorhang geschaut und dann, ich hatte da in meiner Karriere so mehrere so Aha-Erlebnisse, wo ich dann so dachte,

00:37:43.740 --> 00:37:56.800
 Ach Gott, das ist ja viel einfacher, als ich gedacht habe, wie soll ich das sagen, ja doch meistens war der Gedanke, ach so einfach ist das.

00:37:57.480 --> 00:38:08.560
 Man vermutet hinter irgendwas oder ist es irgendwas, wo man nicht genau weiß, wie es funktioniert und man vermutet da irgendwie ganz, ganz verrückte Sachen dahinter und jedes Mal, wenn man dann dahinter guckt, merkt man dann so, oh, da steckt gar nicht so viel dahinter.

00:38:08.560 --> 00:38:10.320
 Das ist ja nur, das ist ja nur das.

00:38:11.280 --> 00:38:12.520
 Darum geht es heute.

00:38:12.520 --> 00:38:15.000
 Hol dir schon mal ein Bier, es gibt 17 Punkte.

00:38:15.000 --> 00:38:16.480
 Was?

00:38:16.480 --> 00:38:17.620
 Nein, das war schon.

00:38:17.620 --> 00:38:21.360
 Wir haben extra vorher nicht gesagt, wie viele Punkte sind.

00:38:23.100 --> 00:38:29.340
 Diese 17 Punkte geheimer Webmagie werden dich zum Staunen bringen.

00:38:29.340 --> 00:38:31.120
 Bei Punkt vier habe ich geweint.

00:38:31.120 --> 00:38:32.200
 Genau.

00:38:32.200 --> 00:38:37.100
 Genauso wie dieser Clickbait-Artikel, den ich da vorhin offen hatte.

00:38:37.100 --> 00:38:42.900
 Der als erstes, egal, nein, darüber sprechen wir jetzt nicht.

00:38:42.900 --> 00:38:44.800
 Wir haben schon viel zu lange geredet.

00:38:44.800 --> 00:38:47.700
 Wieder zwei Minuten Match seit dem Themen-Jingle.

00:38:47.700 --> 00:38:52.100
 Ja, dann, wir brauchen vielleicht noch ein, jetzt fängt es wirklich an, Themen-Jingle.

00:38:52.100 --> 00:38:54.440
 Dabei ist der schon so ernst.

00:38:54.440 --> 00:38:56.620
 Okay, jetzt werden wir jetzt ernst.

00:38:56.620 --> 00:39:02.900
 Mein erster Punkt auf dieser Liste ist, Webseiten sind reine Textdateien.

00:39:02.900 --> 00:39:10.240
 Wenn du hier zuhörst und noch irgendwie halbwegs folgen kannst, dann weißt du das wahrscheinlich schon.

00:39:10.320 --> 00:39:23.440
 Aber für mich war das eine extrem große Erleuchtung, als ich gemerkt habe, das ist nicht irgendwie irgendwas Magisches, irgendein binäres Format oder irgendeine Datei, in die ich nicht reingucken kann, was es ist.

00:39:23.440 --> 00:39:29.600
 Sondern letzten Endes habe ich da eine ganz einfache Textdatei vor mir, die ich mit meinem Editor bearbeiten kann.

00:39:30.440 --> 00:39:35.040
 Und die dann einfach unter einer bestimmten Dateiendung abspeichere.

00:39:35.040 --> 00:39:39.280
 Also statt txt mache ich einfach daraus .html.

00:39:39.280 --> 00:39:43.360
 Und dann ist das plötzlich eine Datei, die ich im Browser öffnen kann.

00:39:43.360 --> 00:39:47.740
 Das heißt, also ich meine, das simpelste Beispiel wäre, ich schreibe einfach nur irgendwas in eine Textdatei rein.

00:39:47.740 --> 00:39:49.420
 Also irgendwas, hallo.

00:39:50.600 --> 00:39:58.120
 Und nenne die dann irgendwas .html oder test.html und öffne die dann im Browser und dann steht da plötzlich hallo.

00:39:58.120 --> 00:40:09.500
 Also das war für mich ein großer Moment, als mir klar wurde, ich brauche dafür auch keine verrückte Software oder irgendwas, sondern Textdateien, die begegnen einem ja immer mal wieder.

00:40:09.500 --> 00:40:10.860
 Wann war das? Letzte Woche?

00:40:10.860 --> 00:40:13.500
 Gestern.

00:40:16.020 --> 00:40:19.840
 Und heute habe ich mir gedacht, wir machen mal einen Podcast über Webdesign.

00:40:19.840 --> 00:40:24.960
 Und verkünden die große Neuigkeit, hey, das sind Textdateien, was ihr da schreibt.

00:40:24.960 --> 00:40:27.040
 Die Frage war wahrscheinlich ernst gemeint, wann das war.

00:40:27.040 --> 00:40:30.100
 Nein, ja tatsächlich, ich wollte nicht drauf hinaus, doch, ja.

00:40:30.100 --> 00:40:36.300
 Das war, also das genaue Datum kann ich dir jetzt nicht mehr sagen.

00:40:36.300 --> 00:40:42.200
 Ich sage auch keinem das Ergebnis, das man im Webarchive vielleicht noch finden könnte aus dieser Ära.

00:40:43.020 --> 00:40:46.840
 Es war Anfang der 2000er, es war vielleicht 2000, 2001.

00:40:46.840 --> 00:40:48.540
 Da bin ich mir jetzt nicht ganz genau sicher.

00:40:48.540 --> 00:40:49.640
 Wahrscheinlich 2001.

00:40:51.960 --> 00:40:59.160
 Und das war der Moment, als ich in Frontpage mal diesen Quelltext-Tab gefunden habe.

00:40:59.160 --> 00:41:07.900
 Und dann, ich meine, wenn man das, wenn man zum ersten Mal Quelltext sieht, auch wenn es nur HTML ist, in Anführungsstrichen, und damals halt noch wirklich sehr, sehr simples HTML.

00:41:07.900 --> 00:41:10.180
 Da gab es ja ganz viel noch nicht, was wir heute haben.

00:41:11.340 --> 00:41:19.880
 Und dann auch noch generiertes HTML von Frontpage eben, also Microsoft Frontpage, die sehr viel Älteren werden sich erinnern, dass es sowas mal gab.

00:41:22.560 --> 00:41:26.780
 Dann ist auch das erst mal so ein bisschen Magie für einen.

00:41:26.780 --> 00:41:31.960
 Man sieht das irgendwie und man versteht aber auch nicht jetzt, wie funktioniert denn das jetzt.

00:41:31.960 --> 00:41:36.160
 Also da ist einem dann noch nicht klar, dass es da irgendwie ein HTML-Element gibt.

00:41:36.160 --> 00:41:37.580
 Oder wie funktionieren überhaupt Elemente?

00:41:37.580 --> 00:41:38.540
 Was ist überhaupt ein Element?

00:41:38.540 --> 00:41:39.640
 Was ist denn ein Attribut?

00:41:39.640 --> 00:41:41.220
 Das weiß man ja in dem Augenblick noch nicht.

00:41:41.700 --> 00:41:48.660
 Also da war dann so der Weg, ich mache das mal auf und ändere mal eine Zahl und gucke, was passiert.

00:41:48.660 --> 00:41:51.440
 Also so hat das bei mir einfach angefangen.

00:41:51.440 --> 00:41:57.420
 Und das war aber dann so schon diese Revelation, okay, da ist jetzt einfach tatsächlich doch nur Text.

00:41:57.420 --> 00:41:59.960
 Und wenn man sich Mühe gibt, kann man da auch irgendwie was rauslesen.

00:41:59.960 --> 00:42:03.960
 Und ich kann, also es ist aber menschenlesbar.

00:42:03.960 --> 00:42:07.540
 Es ist zwar, es ist so eine Mischung zwischen Maschinen- und Menschen-Kram.

00:42:07.540 --> 00:42:10.280
 Und das, ja, das war für mich eine große Erkenntnis.

00:42:11.220 --> 00:42:12.940
 Und ja, war gestern.

00:42:12.940 --> 00:42:18.920
 Ja, interessant, weil wir da auch irgendwie, glaube ich, aus einer anderen Richtung jeweils kommen.

00:42:18.920 --> 00:42:23.760
 Also du hast angefangen mit Frontpage und da irgendwie halt mit dem Interface die Sachen zusammenzuziehen.

00:42:23.760 --> 00:42:32.920
 Ich bin halt direkt eingestiegen in, also mit diesem, wir hatten es ja in der, glaube ich, allerersten Folge oder in der nullten Folge, glaube ich sogar, davon, wie wir dazu gekommen sind.

00:42:32.920 --> 00:42:36.160
 Und ich habe halt direkt angefangen mit dem Data-Backer-HTML-Buch.

00:42:36.160 --> 00:42:39.060
 Ja, also da war für mich dann, ja klar, was passiert.

00:42:39.360 --> 00:42:42.560
 Aber klar, wenn man aus der anderen Richtung kommt, dass man visuelle Editoren nutzt.

00:42:42.560 --> 00:42:44.400
 Und ich meine, die gibt es ja heute auch noch.

00:42:44.400 --> 00:42:48.040
 Und viele Leute, die so ins Web einsteigen, nutzen vielleicht auch tatsächlich die am Anfang.

00:42:48.040 --> 00:42:52.540
 Für die ist das tatsächlich vielleicht eine Erleuchtung, auch heute noch.

00:42:54.340 --> 00:43:08.760
 Ja, ich meine, ich habe ja vorher, bevor ich irgendwie Webkram gemacht habe oder bevor ich da mit Frontpage romantiert habe, habe ich auch schon mal ein ganz kleines Programm auf einem C64 geschrieben.

00:43:09.480 --> 00:43:14.360
 Aber das war für mich, das habe ich nicht miteinander verknüpft.

00:43:14.360 --> 00:43:15.220
 Das war mir nicht so klar.

00:43:15.220 --> 00:43:16.680
 Das war auch damals so simpel.

00:43:16.680 --> 00:43:22.380
 Ich meine, da hast du irgendwie eine Endlosschleife mal eben gebaut, weil du hast einfach nur irgendwas abgeschrieben, was in irgendeinem Buch stand.

00:43:22.380 --> 00:43:23.560
 Zumindest war das bei mir so.

00:43:23.680 --> 00:43:25.180
 Ich habe was abgeschrieben, was im Buch stand.

00:43:25.180 --> 00:43:35.300
 Und da stand dann halt irgendwie wahrscheinlich 10 Print Hallo oder sowas und dann 20 Go to 10.

00:43:35.300 --> 00:43:39.200
 So, und damit war es das dann schon erledigt.

00:43:39.200 --> 00:43:44.620
 Und das habe ich aber also in meinem Kopf nicht verknüpft mit, naja, wahrscheinlich ist irgendwie Quellcode so.

00:43:44.740 --> 00:43:49.540
 Für mich war das irgendwie so ein unbekannter Nimbus, keine Ahnung, irgendwas, irgendeine Magie eben.

00:43:49.540 --> 00:44:00.080
 Und das ist halt auch wieder der Unterschied zwischen, da hatten wir auch schon mal drüber, richtige Programmierung in Anführungsstrichen, ja, und eben halt einer Mark-Absprache, die halt im Browser eben anders gerendert ist als das, was ich da reinschreibe.

00:44:00.080 --> 00:44:02.780
 Ja, genau.

00:44:02.780 --> 00:44:05.460
 Jetzt habe ich auch mal wieder genau gesagt.

00:44:05.460 --> 00:44:08.500
 Ich finde, das sagen wir eigentlich viel zu selten, weil das wird in Podcasts viel zu selten.

00:44:08.500 --> 00:44:10.760
 Äh, sollten wir auch noch mehr streuen, als wir das tun.

00:44:10.760 --> 00:44:13.200
 Wir sollten noch ein bisschen mehr äh und ein bisschen mehr genau sagen.

00:44:13.720 --> 00:44:17.740
 Dann sage ich jetzt, genau, dann komme ich jetzt zu meinem ersten Punkt.

00:44:17.740 --> 00:44:25.860
 Ähm, und der ist noch ein bisschen mehr Meta, gar nicht Frontend, Computer-Hardware generell und im Speziellen das BIOS-Setup.

00:44:25.860 --> 00:44:39.840
 Das war irgendwie so als Kind so bei den ersten Rechnern, also mein, der erste Computer, den wir hier im Haus hatten, bei meinen Eltern im Haus, ähm, das war so ein Riesenröhrenbildschirm und schwarz mit gelbem Text.

00:44:39.840 --> 00:44:41.680
 Also er war nicht mal weiß, sondern gelber Text.

00:44:42.700 --> 00:44:46.640
 Äh, irgendwie, ja, das war halt für mich, ja, das war wirklich Magie, ne.

00:44:46.920 --> 00:44:57.900
 Damals war ich halt wirklich auch noch ein Kind und, äh, da macht man sich ja gar nicht so Gedanken, was steckt da dahinter und dann konnte man da irgendwie, da gab's schon so eine Art Grafikprogramm, ne, unter DOS alles noch, da gab's auch noch kein Windows bei uns.

00:44:58.560 --> 00:45:04.340
 Und, äh, da konnte man dann so halt diese Pipe-Symbole und was weiß ich was rumschieben und das war schon, wow, Wahnsinn, wie das funktioniert.

00:45:04.340 --> 00:45:10.880
 Und, ähm, ja, BIOS war auch immer lange Zeit so, oh Gott, geh da bloß nicht rein, mach da bloß nichts kaputt, sonst funktioniert am Schluss nichts mehr.

00:45:11.200 --> 00:45:25.860
 Und ich mein, da hat sich ja auch viel getan, ja, also wenn ich jetzt das BIOS von meinem, äh, ASUS-Mainboard anschaue, das ist ja wie so ein kleines, richtiges Operating-System, ja, wo ich mit der Maus inzwischen bedienen kann, nicht mal irgendwie mit, mit der Tastatur, sondern du kannst da draufklicken.

00:45:26.360 --> 00:45:37.180
 Und, äh, auch dieses, ähm, ja, wenn da mal irgendwie beim, wenn der beim, beim, beim Hochbooten dann abstürzt und dann ist das BIOS für immer kaputt und dann, äh, ja, was ist ein Problem, da musst du den Chip austauschen oder was weiß ich.

00:45:37.180 --> 00:45:45.800
 Heute ist das so, da sind zwei Chips drauf und wenn du einen BIOS irgendwie zerbrezelst, dann, äh, gibt's nur ein Backup und dann, äh, spielst du das halt wieder ein und dann funktioniert das.

00:45:45.800 --> 00:45:54.640
 Wusste ich gar nicht, dass das heute so ist. Also bei meinem altmodischen Rechner gibt's nur einen BIOS, glaub ich, und da ist das nur so mit, mit, äh, du musst die richtigen Shortcuts kennen, um reinzukommen und dann da drin zu navigieren.

00:45:54.640 --> 00:45:56.500
 Also du kannst sogar zum, also ich hab noch was sehr altmodisches.

00:45:56.500 --> 00:46:05.940
 Zum Firmware-Update kannst du direkt im Dateisystem auf deinen Festplatten die, die Firmware-Datei auswählen, die Bener-Datei und dann wird das direkt im Interface, äh, eingespielt.

00:46:05.940 --> 00:46:21.180
 Und wenn dabei was kaputt geht, dann gibt's wie gesagt ein BIOS. Also es ist wahrscheinlich jetzt auch nicht auf jedem Board so, das ist jetzt halt so ein, so ein Gaming-PC, äh, Board, ähm, wo das halt der Fall ist, aber es geht jedenfalls und hat diese, diese Angst vor irgendwas im BIOS machen, die ist halt inzwischen echt verloren gegangen.

00:46:21.380 --> 00:46:29.660
 Also grad kürzlich hatte ich das wieder den Fall, als ich da in Laravel, Laravel, ich kann das nicht aussprechen, Laravel, mit jedem Bier wird's, wird's schlechter, ich weiß auch nicht.

00:46:29.660 --> 00:46:37.720
 Ähm, als ich da eingestellt bin und muss ich dann die Virtual Machine erst irgendwie deaktivieren, äh, aktivieren, die, die Funktionalität, äh, für die CPUs.

00:46:38.260 --> 00:46:48.100
 Und dann gehst du halt da schnell rein und setzt ein Häkchen und, und startest neu. Und früher war das so, oh nein, äh, allein schon dieses gefährliche Blau, das dich ja angeleuchtet hat, wenn du da auf F2 gekommen bist beim Hochfahren.

00:46:48.100 --> 00:46:49.240
 Ähm, genau.

00:46:49.240 --> 00:46:51.260
 Ja, aber gut so, aber gut so.

00:46:51.260 --> 00:46:52.800
 Ja, man sollte natürlich da nicht einfach so.

00:46:52.800 --> 00:46:55.140
 Ich glaub, das war schon, das war schon, das war schon, das war schon gut so, dass das so war.

00:46:55.140 --> 00:46:59.020
 Ja, vor allem, als ich noch kleiner war, war das gut so, dass ich da nicht irgendwie, ja.

00:46:59.020 --> 00:47:00.680
 Ja, aber Hardware generell so.

00:47:00.680 --> 00:47:03.040
 Ja, aber konnte man da noch kein BIOS-Passwort setzen, also.

00:47:03.040 --> 00:47:04.520
 Doch, doch, doch, doch, das ging.

00:47:04.520 --> 00:47:11.260
 Dann hätte, das hätte man ja, das hätte man ja setzen können, um den kleinen Konstantin da draußen zu halten oder hätte der dann halt eins, zwei Titten, Titten.

00:47:11.260 --> 00:47:15.480
 Ja, das ist wie, äh, Kindersicherung am Fernseher, das hält nicht lang.

00:47:15.480 --> 00:47:20.320
 Du, du findest den Zettel, auf dem's aufgeschrieben ist dann wahrscheinlich.

00:47:20.320 --> 00:47:21.920
 Oder halt ausprobieren.

00:47:21.920 --> 00:47:29.460
 Ja, und, äh, auch Hardware generell, dann, wenn man irgendwie angefangen hat, seine, seine, seine Rechner dann selber zu bauen oder halt auch mal wirklich selber was zu reparieren, wenn irgendwas kaputt war und so.

00:47:29.820 --> 00:47:31.340
 Das hat alles irgendwie so seinen Schrecken verloren.

00:47:31.340 --> 00:47:33.140
 Aber ich will jetzt gar nicht weiter in die Tiefe gehen.

00:47:33.140 --> 00:47:34.500
 Schon wieder viel zu viel Zeit.

00:47:34.500 --> 00:47:40.560
 Oh nein, nein, nein, also, komm, ist es, also erstens mal gibt's noch, gibt's noch, gibt's noch, keine Zeit.

00:47:40.560 --> 00:47:43.040
 Nein, was, wieso keine Zeit?

00:47:43.040 --> 00:47:48.320
 Also, das ist ja das Schöne am Internet und an einem Podcast, ist, dass wir unbegrenzt Zeit haben.

00:47:48.320 --> 00:47:52.780
 Und wenn eine Folge 27 Stunden lang wird, dann wird's halt 27 Stunden lang, das ist ja nicht unser Problem, sondern das von den Hörern.

00:47:52.780 --> 00:47:59.780
 Da hab ich jetzt so einen Tweet dazu geliked, ich weiß jetzt leider auch nicht mehr, ähm, von wem, vielleicht such ich den nochmal raus, wo auch jemand gesagt hat,

00:47:59.820 --> 00:48:06.240
 hört auf, war es sogar Emma Bos, Bos, Bos, Bos, Bos, Bos, Bos, Bos, Bos, Bos, Bos, ich weiß es nicht.

00:48:06.240 --> 00:48:14.140
 Jedenfalls hat, es war eine sie, soweit ich mich erinnere, und sie hat gesagt, ähm, hört auf, den Leuten vorzuschreiben, wie lang ihre Podcasts sein sollen oder dürfen.

00:48:14.140 --> 00:48:17.820
 Ja, und wenn, wenn man's halt auf zweimal hört, dann hört man's halt auf zweimal, es zwingt einem ja keiner.

00:48:18.620 --> 00:48:23.780
 Aber wir werden jetzt schon wieder Meta. Und, äh, ich würd sagen, du darfst gerne mit deinem nächsten Wort vorfahren.

00:48:23.780 --> 00:48:35.200
 Ne, dazu, dazu, das muss ich noch kurz abschweifen da in die Richtung, ein kurzes Zitat noch, also, äh, Tim Britloff sagt ja, ähm, der Podcast ist so lang, also, man muss den so lang machen, wie er halt, wie das Thema halt braucht.

00:48:35.620 --> 00:48:45.420
 Und ich find's, ich find's blöd, es irgendwie zu verknappen oder zu verkürzen. Ich mein, klar, man muss sich überlegen, wie weit man ausschweift irgendwo an der Stelle, wie weit geht man jetzt weg von dem, was, wo man eigentlich hin will.

00:48:45.420 --> 00:48:48.760
 Also, zum Beispiel, indem man vom Thema abschweift, um Meta zu sprechen.

00:48:48.760 --> 00:49:03.240
 Ja, aber, also, ich, zu BIOS wollte ich noch kurz sagen, ähm, um wieder zum Thema zurückzukommen, danke, dass du mich kurz zurückmoderiert hast, ähm, das, also, das hab ich in erster Linie genutzt, um halt ein BIOS-Passwort auf dem Rechner einzurichten.

00:49:03.360 --> 00:49:16.080
 Und zwar ein Passwort, das ja, also, das, das, das, das ich allgemein, egal, Startpasswort, also nicht nur ein Passwort, das das BIOS schützt, sondern ein Startpasswort, was dann dafür sorgt, dass man den Rechner eigentlich nur starten kann, wenn man das Passwort weiß.

00:49:16.080 --> 00:49:17.880
 Damit keiner deine Schmudeleien sieht.

00:49:17.880 --> 00:49:22.800
 Und ich frage, ich frage mich bis heute, ob das wirklich sicher ist.

00:49:22.800 --> 00:49:25.600
 Also, äh, nee.

00:49:25.600 --> 00:49:28.940
 Also, kann ich dir aus eigener Erfahrung sagen?

00:49:28.940 --> 00:49:29.980
 Ich hab mir das schon gedacht.

00:49:29.980 --> 00:49:33.100
 Nein, nein, ich mein, also, angenommen, es ist ein Passwort, was keiner rausfindet.

00:49:33.100 --> 00:49:36.320
 Aber, äh, das kann, das kann man bestimmt relativ gut bruteforcen.

00:49:36.320 --> 00:49:37.460
 Musst du gar nicht.

00:49:37.460 --> 00:49:39.700
 Also, wenn du an die Hardware rankommst, also,

00:49:39.700 --> 00:49:42.900
 früher bei den Mainboards war das teilweise nur ein Jumper,

00:49:42.900 --> 00:49:45.600
 den du gezogen hast und reingemacht hast, ja.

00:49:45.600 --> 00:49:48.680
 Oder du musstest, äh,

00:49:48.680 --> 00:49:52.940
 hättest theoretisch eine Batterie rauslöten können und wieder reinlöten.

00:49:52.940 --> 00:49:54.660
 Also, ja.

00:49:54.660 --> 00:49:57.840
 Okay, also, du musst schon wissen, was du tust.

00:49:58.140 --> 00:49:59.140
 Ja, natürlich, klar.

00:49:59.140 --> 00:50:00.680
 Also, du musst schon an die Hardware auch rankommen.

00:50:00.680 --> 00:50:01.320
 Aber, okay, Jumper find ich easy.

00:50:01.320 --> 00:50:05.040
 Was jetzt löten, find ich, ist schon eine relativ große, große Hürde.

00:50:05.040 --> 00:50:10.720
 Aber es gibt, es gibt auf, äh, so Firmenlaptops, ähm, ja, tatsächlich die Möglichkeit, so eine

00:50:10.720 --> 00:50:12.120
 Komplettverschlüsselung einzurichten.

00:50:13.240 --> 00:50:14.900
 Und das ist dann schon tatsächlich sicher.

00:50:14.900 --> 00:50:19.680
 Also, da brauchst du, um überhaupt, also, ich weiß nicht, jetzt will ich jetzt technisch auch keinen Quatsch erzählen.

00:50:19.680 --> 00:50:26.000
 In meiner Vorstellung ist es so, dass dieser Masterboot-Sektor verschlüsselt ist und dass ich den mit Eingabe des Passwortes entschlüssel.

00:50:26.000 --> 00:50:27.600
 Oh ja, das war ein schlimmes Wort.

00:50:27.600 --> 00:50:31.100
 Es gab Viren früher, die sich darin eingenistet haben.

00:50:31.100 --> 00:50:36.100
 Und jedenfalls funktioniert jetzt auch eine richtige, ähm, Festplattenverschlüsselung.

00:50:36.100 --> 00:50:42.960
 Das heißt, das ganze Betriebssystem, alle Dateien sind entschlüsselt und die werden dann eben erst, äh, entschlüsselt nach Passwordeingabe.

00:50:42.960 --> 00:50:45.420
 Und das ist dann schon sicher, glaub ich.

00:50:45.420 --> 00:50:49.980
 Und du hattest Angst, unsere Sendung wird zu kurz mit so einem kleinen Thema.

00:50:49.980 --> 00:50:52.620
 Ja, jetzt sind wir schon, schon gleich bei einer Stunde.

00:50:52.620 --> 00:50:54.500
 Siehst du, hiermit wäre das Gegenteil.

00:50:54.500 --> 00:51:02.100
 Ja, ich, ich glaube, ja, ich glaube, auf, auf der Hörerzahl ist noch nicht ganz die Stunde, weil wir nicht, äh, bei, bei Null im Prinzip mit, äh, ist auch egal.

00:51:02.100 --> 00:51:03.900
 Sprich nur eine halbe Minute, dann haben wir sofort.

00:51:03.900 --> 00:51:08.540
 Nein, nein, ach, ja, ich höre mich ja gern selbst reden, ne, ich höre es ja auf meinen Kopfhörern.

00:51:08.540 --> 00:51:12.680
 Nein, ach, Mensch, jetzt habt ihr alle meinen Staubsauger gehört, der möchte nämlich, dass ich ihn woanders

00:51:12.680 --> 00:51:13.400
 woanders hinstelle.

00:51:13.400 --> 00:51:20.400
 Ähm, äh, äh, mein nächster Punkt ist, ähm, ein Server ist auch nur ein Computer mit ganz normaler Ordnerstruktur.

00:51:20.400 --> 00:51:27.520
 Also, wenn man, ähm, in der, in der Frontpage-Phase ist, so nenne ich das jetzt mal, äh, hab ich ja jetzt eben schon nochmal erklärt.

00:51:28.020 --> 00:51:35.740
 Und im Prinzip noch gar nicht weiß, okay, man weiß jetzt, es gibt irgendwie HTML-Dateien und da steht irgendwie was drin und das kann man irgendwie so halbwegs als Mensch auch

00:51:35.740 --> 00:51:40.280
 lesen. Und es gibt vielleicht noch sowas wie CSS. Zumindest war das in meiner Zeit damals so, oder gab es CSS.

00:51:40.280 --> 00:51:49.120
 JavaScript war, war so im Entstehen, sag ich mal. Äh, hab ich damals auch, naja, doch, hat schon Anwendungen gefunden.

00:51:49.380 --> 00:51:55.740
 Aber da waren das auch noch Java-Applets, äh, falls sich Leute noch dran erinnern. Also, es waren merkwürdige Dinge im Netz damals.

00:51:55.740 --> 00:52:03.660
 Ähm, ähm, es war eine wichtige Erkenntnis rauszufinden, ähm, wenn ich jetzt mich mit einem Server verbinde.

00:52:03.660 --> 00:52:07.600
 Also, was ist denn denn ein Server überhaupt? Ein Server ist auch irgendwo nur ein Computer, der irgendwo rumsteht.

00:52:07.600 --> 00:52:14.620
 Das ist nicht, äh, nix verrückt. Das ist nur irgendein anderer Computer. Ähm, und auf den kann ich einfach Dateien rüberspielen.

00:52:14.620 --> 00:52:19.480
 Genauso, äh, wie die bei mir rumliegen, äh, versuche ich halt, dass die dann auch da genauso rumliegen.

00:52:19.480 --> 00:52:24.400
 Und das Einzige, was man da dann, glaube ich, wenn man irgendwie eine Webseite zum Laufen bringen will, noch wissen muss,

00:52:25.000 --> 00:52:31.900
 ist, dass die, die Datei, die in meinem Root-Verzeichnis, also in meinem, in meinem, ja, in meinem Webseiten-Verzeichnis liegt,

00:52:31.900 --> 00:52:39.800
 da muss eine Index-HTML liegen, weil das ist die Datei, die normalerweise angezogen wird, wenn ich dann auf meine, äh, Domain gehe.

00:52:39.800 --> 00:52:46.660
 Also, in dem Fall, wo wir sind, ist vorne.show, äh, wenn ihr da drauf geht, dann seht ihr, also, dann würdet ihr im normalen Fall sehen,

00:52:46.660 --> 00:52:51.680
 da gibt es natürlich noch, also, PHP kann man da noch Schweinereien machen mit allen möglichen serverseitigen Sprachen.

00:52:52.140 --> 00:52:57.260
 Aber dann seht ihr normalerweise einfach die Index-HTML, das ist die erste Seite, auf die ihr da stoßt.

00:52:57.260 --> 00:53:05.840
 Das heißt, die Erkenntnis war für mich wichtig, zu wissen, ich kann einfach irgendwelche Text-Dateien oder HTML-Dateien,

00:53:05.840 --> 00:53:13.500
 die eigentlich nur Text-Dateien sind, auf, mit einem FTP-Programm, File-Transfer-Protokoll, auf den Server laden

00:53:13.500 --> 00:53:20.680
 und, äh, die Struktur sollte dann da genauso aussehen wie auf meinem Rechner und dann, äh, dann, dann passt das, dann läuft das, das, das ist es

00:53:20.680 --> 00:53:26.060
 und dann muss es nur eine Index-HTML geben und dann wird, wird die Seite angezeigt. Das ist, äh, ja, war eine wichtige Erkenntnis für mich

00:53:26.060 --> 00:53:27.260
 auf meinem Weg zum Developer.

00:53:27.260 --> 00:53:35.360
 Auch noch sehr, sehr am Anfang, aber ich finde, da muss es erst mal Klick machen, weil Server war für mich damals schon so was, ähm, so was Magisches.

00:53:35.440 --> 00:53:39.820
 Der, der, der Server irgendwie und da läuft irgendwie eine Software drauf, weiß ich so.

00:53:39.820 --> 00:53:42.240
 Also diese Blackbooks, die Magische.

00:53:42.240 --> 00:53:48.400
 Ja, die Magische und ich, noch viel schlimmer, wenn die irgendwo rumstehen würde, wo ich sie anfassen kann, wäre das ja noch okay.

00:53:48.400 --> 00:54:03.240
 Aber die, die ist irgendwo und ich kann mich mit einer, irgendeiner Adresse und einem Passwort, äh, kann ich mich mit der verbinden und dann kann ich da Dinge hin und her schieben und dann, dann, also das, das war schon, ich weiß nicht,

00:54:03.940 --> 00:54:12.980
 kommentiert mal irgendwie, falls ihr auch mal so einen magischen Moment hattet, also ich, ich, für mich war das magisch, als das zum ersten Mal funktioniert hat, ich spiele eine Webseite auf den Server

00:54:12.980 --> 00:54:20.220
 und dann gehe ich auf eine Domain, die auf den Server zeigt und dann sehe ich das, was ich da gerade gemacht habe, war schon ein verrückter Moment.

00:54:20.220 --> 00:54:32.200
 Also ich fand das auch interessant, ähm, in der Vorbereitung jetzt für das Thema, also wir hatten ja eine Riesenliste, ich habe da auch mit meinem Bruder dann zusammen gebrainstormt und wir haben auch festgestellt, wir sind das beide ein bisschen anders angegangen, du hast schon dich sehr aufs Frontend konzentriert,

00:54:32.700 --> 00:54:41.760
 ich und mein Bruder, wir sind da wirklich so in Erinnerungen geschwälgt und eben so unser erster alter Rechner mit, äh, gelber Grafik und so und sind da wirklich so auf, auf die Hardware-Ebene auch,

00:54:41.760 --> 00:54:49.120
 also bunte Pixel, wie die entstehen auf dem Bildschirm und, äh, ja, die ersten 3D-beschleunigten Grafika und so weiter und das haben wir da alles zusammengestrichen,

00:54:49.120 --> 00:54:57.800
 weil es wäre sonst wirklich sehr umfangreich geworden, aber ich finde das mal interessant, sich wieder so zurückzuversetzen in die Zeit damals und auch jetzt als erfahrener Entwickler, also ich meine,

00:54:58.140 --> 00:55:07.200
 vielleicht hört der ein oder andere das jetzt, da jetzt zu und denkt sich gerade so, äh, wollen die mich verarschen, die reden jetzt darüber, dass das HTML-Seiten Textdateien sind

00:55:07.200 --> 00:55:16.260
 und dass, dass Server nur Computer sind, hä, aber es, es gibt auch jetzt noch Neulinge, denen das nicht bewusst ist, die vielleicht Quereinsteiger sind und jetzt

00:55:16.260 --> 00:55:29.760
 sich im Web-Bereich, äh, tätig machen wollen und für die, es gibt täglich diese, diese Momente von, wo, wo diese Magie plötzlich zu, aha, zu wissen wird, ja, und, ähm, ja, da gibt's, da gibt's so einen Spruch,

00:55:29.760 --> 00:55:40.360
 jetzt krieg ich den leider nicht mehr zusammen, den hätte ich mir auch mal vorher noch raussuchen können, irgendwie so, du triffst jeden Tag Menschen, die Dinge wissen, die du noch nicht weißt und die Dinge nicht wissen,

00:55:40.440 --> 00:55:45.660
 die für dich normal sind, ja, also jeder kann jeden Tag was dazulernen und jeder kommt irgendwie aus einer anderen Ecke und deswegen

00:55:45.660 --> 00:55:52.720
 sollte man da nicht so irgendwie so auf so einem hohen Ross, ja, so auch wie diese Thematik hier, richtige Programmierung und, äh, und Mark-Up-Sprachen und so,

00:55:53.000 --> 00:56:01.220
 Sondern, ähm, ja, für jeden ist es anders und das fand ich interessant, mal wieder so den Blickwinkel so ein bisschen zu verändern und diese Magie so wieder, wieder neu zu erleben.

00:56:01.220 --> 00:56:04.180
 Also da kamen wirklich so Erinnerungen hoch, indem man da so schwelgen konnte.

00:56:04.180 --> 00:56:21.840
 Ja, das ist, das ist ein sehr schönes Zitat, auch wenn's vielleicht nicht korrekt war, ich hab jetzt leider keinen wirklich anerkennenden Applaus als Jingle, ähm, deswegen denkt euch den jetzt einfach mal, also die, die sind alle viel zu enthusiastisch, das muss so ein, so ein intelligenter, anerkennender Applaus, den hätte ich gerne noch, also der, der, der, der steht jetzt.

00:56:21.840 --> 00:56:29.200
 Ja, danke, also das ist auch kein Spruch von mir, ne, also ich krieg ihn, wie gesagt, nicht so ganz zusammen, er war, also vom groben Sinn her war, war der so und ja, das tut einfach ganz gut, den Blickwinkelzahlen.

00:56:29.200 --> 00:56:36.340
 Ich finde es wichtig, dass das mal gesagt wird, ist egal, ist egal, wer sich, ist egal, wer sich das ausgedacht hat, ähm, es ist einfach, es ist einfach was dran.

00:56:36.340 --> 00:56:44.340
 Weil wir wissen nicht, wer uns hier zuhört und wenn's jemand ist, der komplett neu ist in der Thematik, dann ist der genauso herzlich willkommen, wie alle anderen auch.

00:56:44.340 --> 00:56:51.480
 Ich weiß, dass mindestens zwei Leute zuhören, die nicht extrem tief sind, äh, tief drin sind in der Thematik und für die ist das vielleicht tatsächlich wichtig.

00:56:51.840 --> 00:56:52.720
 Das ist doch schön.

00:56:52.720 --> 00:56:54.060
 Ja.

00:56:54.060 --> 00:56:55.660
 Wieder Bildungsauftrag erfragt.

00:56:55.660 --> 00:57:00.160
 Ja, Mensch, äh, vielleicht kann man sich für, für, wo wir sind, ist vorne auch Bildungsurlaub nehmen.

00:57:00.160 --> 00:57:01.880
 Das wär doch was.

00:57:01.880 --> 00:57:04.000
 Dann macht das auch nix aus mit den langen Folgen.

00:57:04.000 --> 00:57:08.980
 Müssen wir mal, müssen wir mal gucken, ob wir da auf diese Bildungsurlaubsliste draufkommen.

00:57:08.980 --> 00:57:13.760
 Dann sag ich jetzt nicht genau, sondern ich sage jetzt, fein, kommen wir zum nächsten Punkt.

00:57:13.760 --> 00:57:15.160
 Sehr gut, jawohl.

00:57:15.160 --> 00:57:21.820
 Und das geht auch, also wir haben hier so schöne Überleitungen, äh, von der Hardware zum Server und jetzt zu HT-Access.

00:57:21.840 --> 00:57:27.580
 Was ja auch wieder eine Datei auf dem Server ist, die für mich auch anfangs magische Dinge gemacht hat.

00:57:27.580 --> 00:57:32.280
 Und auch hier galt, wie beim BIOS bloß nicht anfassen, sonst geht alles kaputt.

00:57:32.280 --> 00:57:35.260
 Ja, also man hat sich die Regeln irgendwie zusammen kopiert.

00:57:35.260 --> 00:57:38.720
 Äh, nicht, dass ich das heute nicht auch noch machen würde, weil ich jetzt nicht jede ...

00:57:38.720 --> 00:57:53.060
 Warte ganz kurz, darf ich, darf ich kurz einhaken? Dazu muss man, ähm, wissen, die, wer noch keine HT-Access gesehen hat, das ist, die ist allein schon deswegen magisch, weil sie keinen File-Namen hat, sondern nur eine File-Extension.

00:57:53.060 --> 00:57:58.360
 Also die heißt Punkt-HT-Access, also die hat keinen Namen davor. Und das alleine finde ich schon magisch daran.

00:57:58.360 --> 00:58:04.340
 Und dank Moritz weiß ich, und das hat tatsächlich sehr lange gedauert, und das ist tatsächlich eine Magie, die sich erst vor ...

00:58:04.340 --> 00:58:08.260
 Ich glaube, es war, glaube ich, erst letztes Jahr irgendwann, äh, die sich da aufgelöst hat.

00:58:08.380 --> 00:58:23.420
 Wie man unter Windows so einen Dateinamen anlegt. Weil wenn ich das versuche zu machen, und hier rechtsklicke, äh, new, bei mir ist es auf Englisch, äh, Punkt FUBA, ja, dann kommt hier, if you change file name extension, the file might become unusable, I usually want to change it.

00:58:23.420 --> 00:58:26.020
 Und ich klicke yes, und oh, es funktioniert. Cool.

00:58:26.020 --> 00:58:26.740
 Ah, geht das jetzt?

00:58:26.740 --> 00:58:28.600
 Wusstest du, dass das jetzt mittlerweile unter Windows 10 funktioniert?

00:58:28.600 --> 00:58:29.880
 Nein, wusste ich natürlich nicht.

00:58:29.880 --> 00:58:36.920
 Jetzt hatten wir sogar live, äh, hier einen magischen Moment. Das funktioniert jetzt. Aber das muss, das ging noch vor, vor ein paar Wochen ging das noch nicht.

00:58:36.980 --> 00:58:53.380
 Das muss echt jetzt mit dem, mit dem, mit dem, äh, Update-Funk, äh, sich eingeschlichen haben. Also Punkt hat die Access. Wow. Dann hat's auch echt nur 30 Jahre gedauert, bis man das unter Windows genauso konnte, wie bei, ähm, wie unter Unix-System.

00:58:53.380 --> 00:58:55.140
 Äh, gut, funktioniert jetzt.

00:58:55.140 --> 00:58:55.620
 Wollen wir den Trick noch verraten?

00:58:55.620 --> 00:59:01.760
 Ja, wir verraten den Trick jetzt trotzdem. Vielleicht hat jemand noch nicht das neueste Update. Ähm, Moritz, du darfst, weil du hast ihn mir auch beigebracht.

00:59:01.760 --> 00:59:06.960
 Äh, ich bin mir grad selbst nicht mehr zu 100 Prozent sicher, ob ich's noch auswendig weiß. Aber warte, ich sag's noch mal.

00:59:06.960 --> 00:59:15.920
 Und du sagst mir, ob's, ob's, ob's stimmt. Also, ich, und ich hab, ehrlich gesagt, keine Ahnung, warum der Trick funktioniert. Ich hab den irgendwo mal gelesen und hab gedacht, das kann ja wohl nicht wahr sein.

00:59:16.340 --> 00:59:22.920
 Der Trick, um so eine Datei unter Windows anzulegen, war, Punkt, HT-Access, Punkt, sie zu benennen.

00:59:22.920 --> 00:59:23.440
 Genau.

00:59:23.440 --> 00:59:25.400
 Dann verschwindet der erste Punkt, richtig, ne?

00:59:25.400 --> 00:59:26.320
 Ja, korrekt.

00:59:26.320 --> 00:59:26.720
 Das war's.

00:59:26.720 --> 00:59:27.800
 Dann verschwindet der erste Punkt.

00:59:27.800 --> 00:59:28.720
 Der letzte Punkt verschwindet.

00:59:28.720 --> 00:59:29.500
 Äh, äh, Entschuldigung.

00:59:29.500 --> 00:59:35.540
 Genau, weil du hast ja quasi dann eine, du hast keine Dateiendung und das ist nicht gültig und das hat Windows dann umgeändert.

00:59:35.540 --> 00:59:37.900
 Es ging aber auch, glaub ich, erst ab Windows 98 oder was weiß ich.

00:59:38.300 --> 00:59:41.320
 Also, es war auch, äh, anfangs nicht, äh, erst ab Windows 98.

00:59:41.320 --> 00:59:41.600
 Ja.

00:59:41.600 --> 00:59:45.800
 Das ist, das ist, also, da muss man echt schon noch drauf achten, finde ich.

00:59:45.800 --> 00:59:45.980
 Ja.

00:59:47.420 --> 00:59:50.660
 Naja, jedenfalls, äh, super, jetzt live hier was gelernt.

00:59:50.660 --> 01:00:06.620
 Man kann unter Windows 10 jetzt neuerdings, äh, direkt Punkt-Dateien anlegen, ähm, was ja auch nicht unwichtig ist, wenn man mit, mit Node, äh, und sonstigen Setups, äh, arbeitet, weil da ganz oft die Konfigurationsdateien dann zum Beispiel Punkt-Babel-RC oder so weiter, äh, und so weiter sind.

01:00:06.620 --> 01:00:16.660
 Ähm, das kann man jetzt alles ohne irgendwelche Tricksereien, was man vorher schon immer konnte war, oder was heißt schon immer, bestimmt auch irgendwie erst ab Windows, was weiß ich, äh, aber mit dem Editor, mit dem Code-Editor,

01:00:16.660 --> 01:00:21.780
 eine Datei speichern und dann den Dateinamen .htaccess eingeben und dann speichern, das ging komischerweise dann.

01:00:21.780 --> 01:00:24.220
 Nur im Explorer beim Anlegen von der neuen Datei ging das nicht.

01:00:24.220 --> 01:00:27.360
 Aber es ist damit hinfällig, es funktioniert.

01:00:27.360 --> 01:00:33.180
 Jedenfalls kommen wir zurück nach 10 Minuten Ausschweifung zu den .htaccess-Dateien.

01:00:33.180 --> 01:00:37.260
 Und, ähm, da muss ich vielleicht auch noch kurz erklären, was die denn genau machen.

01:00:37.260 --> 01:00:45.900
 Da kann ich auf Apache-Servern, äh, auch wieder bestimmte Magie walten lassen, um Dateinamen umzuschreiben, sodass die Dateinamen, äh, Dateien...

01:00:45.900 --> 01:00:50.340
 ... in der URL anders zu erreichen ist, als sie tatsächlich auf dem Server liegt.

01:00:50.340 --> 01:00:57.840
 Oder ich kann sogar, ähm, theoretisch den User-Agent und andere Laufzeit-Umgebungsvariablen abfragen und dann entsprechend darauf reagieren.

01:00:57.840 --> 01:01:05.700
 Schon während der Request quasi auf den Server trifft, sollte man nicht übertreiben, weil natürlich auch bei jedem Request die Datei ausgewertet werden muss.

01:01:05.700 --> 01:01:11.240
 Das sollte man dann tatsächlich in die Apache-Config direkt reinschreiben, wenn man sowas generell machen will und den Zugriff auf den Server hat.

01:01:11.240 --> 01:01:13.600
 Was bei Shared-Hosting meistens nicht funktioniert.

01:01:13.600 --> 01:01:17.320
 Aber auch da schweifen wir schon wieder zu weit ab.

01:01:17.320 --> 01:01:20.140
 Worauf wollte ich eigentlich hinaus, ähm...

01:01:20.140 --> 01:01:22.540
 Du wolltest wahrscheinlich Sachen erzählen, die da drin sind in der ht-access-Datei, oder?

01:01:22.540 --> 01:01:24.600
 Genau, die da drin sind in der ht-access-Datei, oder?

01:01:24.600 --> 01:01:30.720
 Und, ähm, ja, wie gesagt, früher Regeln zusammen kopiert, irgendwie geguckt, äh, was, was will ich denn erreichen?

01:01:30.720 --> 01:01:49.100
 Ich möchte gerne, dass, äh, statt, äh, Datenbank.php?id ist gleich 8 und User ist gleich 5, ich einfach irgendwie eine schöne sprechende URL hab, äh, wo ich die User-ID und die andere ID oder was auch immer ich sortieren will oder so, ähm, einfach in der URL drin habe, quasi als Ordner-Namen, wenn man so will.

01:01:49.660 --> 01:01:54.660
 Das lässt sich alles mitmachen und so inzwischen weiß man dann doch, wie es funktioniert.

01:01:54.660 --> 01:01:59.920
 Also ich schreibe auch nicht immer alle Regeln selbst, sondern kopiere mir die dann zusammen von eigenen Projekten, wo ich schon mal das Gleiche gemacht hab.

01:01:59.920 --> 01:02:10.260
 Ähm, aber es ist jedenfalls nicht mehr so, so die Marki wie früher und auch nicht mehr das Problem, ich hab die ht-access, die läuft auf meinem lokalen Entwicklungssystem und ich lade sie auf den Server hoch und dann krieg ich plötzlich nur noch 500er.

01:02:10.260 --> 01:02:19.560
 Also das ist mir jetzt schon länger nicht mehr passiert, weil man inzwischen, ich glaub das, was heißt inzwischen, vielleicht wusste ich das einfach nur früher nicht, äh, man kann abfragen,

01:02:19.560 --> 01:02:25.900
 welche Module auf dem Server installiert sind, weil nicht alle Module gibt's tatsächlich standardmäßig auf jedem Server und ich kann da einfach drum schreiben,

01:02:25.900 --> 01:02:31.420
 if-Module und dann zum Beispiel Headers, äh, oder Rewrite oder was weiß ich.

01:02:31.420 --> 01:02:39.560
 Also wie ein HTML-Tag tatsächlich, äh, Spitze Klammer auf, if-Module, Spitze Klammer zu, ähm, und damit kann ich das abfragen.

01:02:39.560 --> 01:02:44.340
 Und wenn der Server das nicht kann, zum Beispiel irgendwelche Komprimierung, dann wird das tatsächlich auch nicht ausgeführt.

01:02:45.400 --> 01:02:48.300
 Ich hatte noch eine Frage zur ht-access-Datei.

01:02:48.300 --> 01:02:53.080
 Ich weiß nicht, ob ich dich jetzt auf dem falschen Fuß erwisch, aber was bedeutet das ht?

01:02:53.080 --> 01:02:55.260
 Äh, Hypertext.

01:02:55.260 --> 01:02:55.600
 Heißt du das zufällig?

01:02:55.600 --> 01:02:57.540
 Hätte ich jetzt einfach mal geraten.

01:02:57.540 --> 01:03:00.120
 Ähm, ich hab, ich hab keine Ahnung.

01:03:00.120 --> 01:03:00.660
 Hast du's gegoogelt?

01:03:00.660 --> 01:03:05.660
 Ich hab, ich hab's versucht grad zu googeln, es, ähm, ich hab's nicht, nicht auf den ersten Blick gefunden.

01:03:05.660 --> 01:03:17.320
 Aber, äh, ja, ich find tatsächlich auch auf die Schnellings, also ich bin, ich bin eigentlich recht gut in solcher Abkürzungen, in denen die irgendwelchen Sinn geben, in, in 90 Prozent der Fälle stimmt das auch tatsächlich.

01:03:17.320 --> 01:03:19.820
 Also ich hätt jetzt mal gesagt, äh, Hypertext-Access.

01:03:19.820 --> 01:03:21.380
 So wie's halt bei HTML.

01:03:21.380 --> 01:03:23.040
 Dann nehmen wir das jetzt einfach mal so hin.

01:03:23.040 --> 01:03:24.900
 Vielleicht ist es auch komplett falsch.

01:03:24.900 --> 01:03:27.120
 Falls es nicht stimmt, ein Kommentar schreiben.

01:03:27.120 --> 01:03:28.500
 Aber das macht ihr ja eh nicht.

01:03:28.500 --> 01:03:33.520
 Wikipedia, ja, über unser guter Freund, äh, Hypertext-Access.

01:03:33.520 --> 01:03:34.940
 Nein.

01:03:34.940 --> 01:03:36.400
 Ist ja auch naheliegend, ja.

01:03:36.400 --> 01:03:38.900
 Ja, genau.

01:03:38.900 --> 01:03:40.080
 Gut.

01:03:40.080 --> 01:03:42.380
 Wirklich jetzt?

01:03:42.380 --> 01:03:45.360
 Ich, ich, ich hab grad ein, ach, das ist ja interessant.

01:03:45.360 --> 01:03:50.780
 Ich würde dir das total gerne zeigen, was ich grad auf dem Monitor sehe, aber eigentlich ist es total, äh, unwichtig.

01:03:50.780 --> 01:03:55.060
 Ich hab, ich bin in einer, in einer, äh, Animationsschleife gefangen bei Wikipedia gerade.

01:03:55.060 --> 01:03:55.260
 Mhm.

01:03:56.500 --> 01:04:02.460
 Ähm, das, das Menü oben, das, äh, fährt nach links und wieder nach rechts.

01:04:02.460 --> 01:04:07.640
 Und dann springt die Suchbox nach unten und nach oben und es geht einfach unendlich.

01:04:07.640 --> 01:04:10.360
 Ähm, ja, das ist das wirklich toll.

01:04:10.360 --> 01:04:10.660
 Egal.

01:04:10.660 --> 01:04:10.940
 So.

01:04:10.940 --> 01:04:12.980
 Weiter.

01:04:12.980 --> 01:04:13.980
 Weiter im Text.

01:04:13.980 --> 01:04:14.120
 Weiter.

01:04:14.120 --> 01:04:15.420
 Oder?

01:04:15.420 --> 01:04:16.040
 Ja.

01:04:16.040 --> 01:04:17.180
 Du hast nichts mehr zu HD-Access.

01:04:17.180 --> 01:04:19.020
 Ähm, äh, genau.

01:04:20.200 --> 01:04:23.540
 JavaScript macht keine Magie, es verändert nur HTML und CSS.

01:04:23.540 --> 01:04:33.100
 Ähm, das ist, das jetzt, die, die ganzen Single-Page-Application-Entwickler, die, die werden jetzt, äh, die Hände über dem Kopf zusammenschlagen und sagen, was sagt der da?

01:04:33.100 --> 01:04:36.140
 Ähm, aber das war früher mal so.

01:04:36.540 --> 01:04:44.400
 Und, ähm, ich weiß nicht, da lehne ich mich jetzt wahrscheinlich sehr weit aus dem Fenster, wenn ich sag, äh, JavaScript verändert nur HTML und CSS.

01:04:44.400 --> 01:04:46.000
 Ich sag das jetzt einfach mal.

01:04:46.380 --> 01:04:56.220
 Ich hab nämlich, äh, gelernt in, äh, in, in, in einem Forum oder Podcasts, dass man einfach mal was Kontroverse sagen soll und dann mal gucken soll.

01:04:56.220 --> 01:04:57.460
 Dann kommen mehr Reaktionen.

01:04:57.460 --> 01:05:03.660
 Ich sag, ich behaupte jetzt einfach mal, JavaScript, ähm, ist nur da, dazu da am Ende, um HTML und CSS zu verändern.

01:05:03.660 --> 01:05:07.740
 Und, ähm, wer anderer Meinung ist, der kann sich ja mal bei uns melden.

01:05:07.740 --> 01:05:10.020
 Nicht per Mail, sondern öffentlich.

01:05:10.020 --> 01:05:14.600
 Ich will, dass jemand für seine Meinung öffentlich auch dann geschlagen werden kann, wenn er nicht recht hat.

01:05:15.100 --> 01:05:19.420
 Sehr wichtig im Internet, dass man auf jeden Fall Ärger kriegen kann für das, was man macht.

01:05:19.420 --> 01:05:24.720
 Genau, aber, ähm, genau, das ist, das ist meine, meine Erkenntnis gewesen.

01:05:24.720 --> 01:05:28.120
 Und das hat sich, äh, manifestiert in Form damals.

01:05:28.120 --> 01:05:31.000
 Und ich hab auch sogar noch die Original-Demo dazu.

01:05:31.000 --> 01:05:34.280
 Ähm, tatsächlich noch aus der Zeit, als ich diese Erkenntnis hatte.

01:05:34.280 --> 01:05:37.080
 Äh, ich war damals noch in der Ausbildung zum Mediengestalter.

01:05:37.080 --> 01:05:42.100
 Ähm, und hab ein, und ich meine, das kommt, das Beispiel kommt von Jonathan Snook.

01:05:42.100 --> 01:05:45.960
 Der eine oder andere wird ihn kennen oder wird vielleicht, äh, Smacks kennen.

01:05:45.960 --> 01:05:50.060
 Ist, äh, Scale-Battle and Modular CSS, sein Ansatz und sein Buch.

01:05:50.060 --> 01:06:02.800
 Ähm, der hat früher, also ich, der blockt, glaube ich, immer noch, aber der hat früher ganz oft, äh, ganz gerne mal so, so kleine Schnipsel geblockt, von, von, wo er versucht hat, irgendwie so ein, so ein kleines, abgeschlossenes, äh, Problem zu lösen.

01:06:03.560 --> 01:06:17.300
 Ähm, ähm, ähm, und das Beispiel, äh, wo mir das dann irgendwie klar wurde, ähm, JavaScript macht eigentlich gar nichts Verrücktes, ähm, war eine kleine, wie soll ich das nennen, eine, eine kleine Slideshow.

01:06:17.300 --> 01:06:21.560
 Und zwar einfach nur, ähm, Bilder, die ineinander überblenden.

01:06:21.560 --> 01:06:25.360
 Ähm, das wird, das wird jeder irgendwo im Web schon mal gesehen haben.

01:06:25.360 --> 01:06:29.360
 Ich hab den Link auch, äh, schon zu den, zu den Shownote-Notizen gepackt.

01:06:29.360 --> 01:06:32.420
 Äh, vielleicht kannst du dir das mal angucken, Konstantin, dann kannst du mitreden.

01:06:32.420 --> 01:06:35.280
 Das müsste da, oh, simple.js Slideshow.

01:06:35.280 --> 01:06:42.940
 Ähm, das, das Beispiel da, das basiert noch auf jQuery, das lass ich aber auch mal so, dass, das darf ruhig auf jQuery.

01:06:43.100 --> 01:06:43.880
 Ich bin nicht mehr so schnell.

01:06:43.880 --> 01:06:50.500
 Ähm, du bist nicht mehr so schnell, ich kannst ja auch, äh, ja, nee, ist, guck mal, also, es ist, ja, genau.

01:06:50.500 --> 01:06:51.700
 Wer lesen kann und so, ja.

01:06:51.700 --> 01:06:59.320
 Es ist, es ist ein ziemlich simpler Effekt, stellt euch einfach vor, ähm, ihr habt, äh, mehrere Bilder, in dem Fall sind es, glaube ich, drei Bilder, die sind, die sind alle gleich groß.

01:06:59.320 --> 01:07:04.800
 Ähm, und langsam blenden die Bilder ineinander über.

01:07:04.800 --> 01:07:08.660
 Das eine wird, das eine wird durchsichtiger und man sieht dann, äh, irgendwann das andere.

01:07:09.160 --> 01:07:13.420
 Und das war ein Beispiel, was mir extrem geholfen hat, irgendwie zu verstehen, was da, was da eigentlich passiert.

01:07:13.420 --> 01:07:17.100
 Weil am Anfang dachte ich, oh, da passiert irgendeine JavaScript-Magie von der verstehe ich nichts.

01:07:17.100 --> 01:07:24.460
 Ähm, das ist, also ich, für mich war damals, in meinem Kopf war damals JavaScript so ein extra Layer im Browser.

01:07:24.460 --> 01:07:29.520
 Irgendwie sowas, äh, was, was, was, was abgeschottet von HTML und CSS läuft.

01:07:29.520 --> 01:07:34.840
 Und das hatten, und als ich das dann gesehen habe, habe ich dann gemerkt, okay, gut, da werden jetzt was, was wird denn da jetzt eigentlich gemacht?

01:07:34.840 --> 01:07:37.400
 Äh, okay, das ist Fade-In.

01:07:37.960 --> 01:07:44.440
 Das sind tatsächlich, ähm, am Ende, also in, in, da wird, äh, manipuliert die, äh, jQuery tatsächlich direkt das CSS.

01:07:44.440 --> 01:07:46.100
 Das muss man aber auch erst mal sehen.

01:07:46.100 --> 01:07:50.020
 Ich glaube, damals gab's, damals war Firebug aktuell und dann konnte man in Firebug da draufklicken.

01:07:50.020 --> 01:07:54.620
 Ähm, und dann konnte man sehr gut sehen, was da genau passiert.

01:07:54.620 --> 01:08:01.960
 Nämlich dieses kleine Mini-JQuery-Skript, das sind hier, äh, warte mal, es sind vier Zeilen, wenn ich das richtig sehe.

01:08:01.960 --> 01:08:03.640
 Es sind vier Zeilen.

01:08:03.640 --> 01:08:06.960
 Ähm, sorgt dafür.

01:08:07.760 --> 01:08:14.740
 Ähm, dass die, dass die Bilder nach und nach, ähm, ausgeblendet werden und zwar mit Opacity in CSS.

01:08:14.740 --> 01:08:16.360
 Also dieser Wert wird animiert.

01:08:16.360 --> 01:08:18.160
 Mittlerweile könnte man das viel einfacher machen.

01:08:18.160 --> 01:08:20.260
 Mittlerweile bräuchte man für sowas kein JavaScript mehr.

01:08:20.260 --> 01:08:21.920
 Das könnte man komplett mit CSS machen.

01:08:21.920 --> 01:08:26.840
 Ähm, aber damals war das eben noch nötig, äh, weil es noch keine CSS-Animationen gab.

01:08:27.380 --> 01:08:44.700
 Und, äh, äh, es stimmt nicht ganz, äh, in dem Fall wird auch noch HTML manipuliert, ähm, weil nämlich, äh, die, die einzelnen Bilder wieder in der Reihenfolge geändert werden.

01:08:44.820 --> 01:08:48.820
 Mensch, knallt doch nicht so die Tür zu da neben dran. Meine Güte, das hast du bestimmt auch gehört, Konzentri, oder?

01:08:48.820 --> 01:08:48.920
 Ja, natürlich.

01:08:48.920 --> 01:08:52.020
 Ach du, meine Güte, verrückt.

01:08:52.020 --> 01:08:54.940
 Ähm, genau.

01:08:55.060 --> 01:08:57.820
 Also die Reihenfolge des HTMLs wird geändert.

01:08:57.820 --> 01:08:59.520
 Ihr könnt euch das Demo, die Demo mal angucken.

01:08:59.520 --> 01:09:00.880
 Das ist auch wieder sehr schwer zu erklären.

01:09:00.880 --> 01:09:03.700
 Also so für Audio, das, da, da sollt ihr vielleicht echt mal reingucken.

01:09:03.700 --> 01:09:06.940
 Ähm, die Reihenfolge des HTMLs wird geändert.

01:09:06.940 --> 01:09:10.200
 Das heißt, dass, das, ein Bild wird immer ganz nach unten geschoben, sozusagen.

01:09:10.200 --> 01:09:13.880
 Ähm, und, äh, genau.

01:09:13.880 --> 01:09:17.400
 Eigentlich wird dann nur die Opacity von dem Bild geändert in CSS.

01:09:17.400 --> 01:09:18.960
 Das, das ist es im Prinzip.

01:09:18.960 --> 01:09:25.040
 Also das hat, ich, also wenn jemand, wenn jemand irgendwie Probleme hat, ähm, zu verstehen, wie dieser Zusammenarbeit ist,

01:09:25.060 --> 01:09:29.800
 und wie dieser Zusammenhang besteht, dann sucht euch das einfachstmöglichste Beispiel raus.

01:09:29.800 --> 01:09:34.440
 Also wirklich, und ich glaube, das ist auch das, was mir damals geholfen hat, zu verstehen, wie dieser Zusammenhang ist.

01:09:34.440 --> 01:09:43.160
 Das ist ein extrem einfaches Beispiel war, äh, von wie interagieren in HTML, CSS und JavaScript miteinander.

01:09:43.160 --> 01:09:47.100
 Ähm, ja, ich weiß nicht, gar nicht, äh, ich kann da gar nicht viel mehr dazu sagen.

01:09:47.100 --> 01:09:52.440
 Ich bin jetzt sehr viel auf dieses Beispiel angegangen, aber, ähm, das war für mich so ein, so ein magischer Moment.

01:09:52.440 --> 01:09:55.040
 Ähm, JavaScript ist nicht irgendein, ähm,

01:09:55.060 --> 01:09:57.220
 magisches Ding, das irgendwo läuft.

01:09:57.220 --> 01:09:59.000
 Wahrscheinlich wird das heute eh keiner mehr denken,

01:09:59.000 --> 01:10:01.880
 weil ganz viele Entwickler, die heutzutage, äh,

01:10:01.880 --> 01:10:04.740
 Entwicklungen lernen sozusagen in irgendwelchen Bootcamps,

01:10:04.740 --> 01:10:06.940
 die fangen ja oft mit JavaScript quasi schon an

01:10:06.940 --> 01:10:08.180
 oder mit irgendwelchen Frameworks.

01:10:08.180 --> 01:10:10.600
 Ähm, das war für mich,

01:10:10.600 --> 01:10:12.660
 das war für mich ein prägender Moment,

01:10:12.660 --> 01:10:14.760
 wo ich den Zusammenhang verstanden habe,

01:10:14.760 --> 01:10:16.600
 dass JavaScript in vielen Fällen

01:10:16.600 --> 01:10:18.760
 einfach nur manipuliert,

01:10:18.760 --> 01:10:20.060
 was in HTML und CSS ist.

01:10:20.060 --> 01:10:21.500
 Das habe ich jetzt zum hundertsten Mal gesagt.

01:10:21.620 --> 01:10:22.380
 Hast du noch eine Frage?

01:10:22.380 --> 01:10:23.880
 Ich glaube, es ist jetzt in den Köpfen drin.

01:10:23.880 --> 01:10:26.780
 Ich glaube, ich hoffe es, ich hoffe es, ja.

01:10:26.780 --> 01:10:29.560
 Du hast dazu nichts, das war ...

01:10:29.560 --> 01:10:33.420
 Nee, nee, weil, ja, weil wir da auch, wie gesagt,

01:10:33.420 --> 01:10:34.680
 wieder aus einer anderen Ecke kommen.

01:10:34.680 --> 01:10:38.680
 Und, ähm, ich einfach JavaScript auch anders,

01:10:38.920 --> 01:10:41.140
 ja, vielleicht systematisch oder, ich weiß nicht,

01:10:41.140 --> 01:10:44.140
 aber aus einer anderen Herangehensweise raus gelernt habe.

01:10:44.140 --> 01:10:46.040
 Ach, systematisch habe ich nie gelernt.

01:10:46.040 --> 01:10:47.400
 Ja.

01:10:47.400 --> 01:10:49.200
 Und, äh, ja, ich halt schon.

01:10:49.200 --> 01:10:52.160
 Also, weil du vorhin auch Java-Applets angesprochen hattest,

01:10:52.160 --> 01:10:54.060
 ähm, ja, klar, mit denen habe ich natürlich auch

01:10:54.060 --> 01:10:55.260
 ganz am Anfang noch gearbeitet.

01:10:55.260 --> 01:10:58.300
 Und dann, äh, irgendwie, ja, JavaScript ist dann gewachsen

01:10:58.300 --> 01:11:00.980
 mit der Zeit und, äh, war immer mehr möglich.

01:11:00.980 --> 01:11:03.440
 Aber für mich, also das ist auch schon wieder das,

01:11:03.440 --> 01:11:04.760
 was ich meinte vorhin mit dem Blickwinkel,

01:11:04.760 --> 01:11:08.060
 für mich sind, sind die Sachen nicht magisch für dich,

01:11:08.060 --> 01:11:08.820
 waren sie magisch.

01:11:08.820 --> 01:11:10.280
 Und du hattest diesen Moment.

01:11:10.280 --> 01:11:12.040
 Und bei mir gab's das eben nicht.

01:11:12.040 --> 01:11:14.040
 Bei mir gab's das dafür halt bei anderen Sachen,

01:11:14.040 --> 01:11:15.160
 wo's bei dir vielleicht nicht war.

01:11:15.160 --> 01:11:16.220
 Ja.

01:11:16.220 --> 01:11:18.920
 Bios fand ich beispielsweise nie magisch.

01:11:18.920 --> 01:11:19.720
 Keine Ahnung warum.

01:11:19.720 --> 01:11:23.580
 Aber egal, ähm, damit können wir jetzt ganz ohne Ausschweifung

01:11:23.580 --> 01:11:25.000
 zum nächsten Thema springen, oder?

01:11:25.000 --> 01:11:25.640
 Genau.

01:11:25.640 --> 01:11:27.620
 Regular Expressions.

01:11:27.620 --> 01:11:29.460
 Und wenn ich das schon sage, wird der ein oder andere wahrscheinlich,

01:11:29.460 --> 01:11:30.400
 äh, äh.

01:11:30.400 --> 01:11:32.860
 Nee, ich sag da, äh.

01:11:32.860 --> 01:11:35.160
 Genau, Regular Expressions.

01:11:35.160 --> 01:11:36.600
 Also, ich möchte jetzt auch gar nicht sagen,

01:11:36.600 --> 01:11:38.960
 oh, für mich ist das heute hier alles, äh, schreibe ich dir im Schlaf.

01:11:38.960 --> 01:11:40.260
 Weil das war nämlich auch deine Frage so.

01:11:40.260 --> 01:11:43.220
 Sag mal, Regular Expressions, wenn ich dich jetzt nachts um drei weg,

01:11:43.220 --> 01:11:44.480
 kannst du das im Schlaf und so.

01:11:44.480 --> 01:11:46.240
 Und, äh, nein, natürlich nicht.

01:11:46.240 --> 01:11:47.740
 Aber es hat so diesen Schrecken,

01:11:47.740 --> 01:11:49.700
 den viele Leute, glaube ich, da,

01:11:49.700 --> 01:11:51.720
 viele Programmierer noch, äh, davor haben,

01:11:52.160 --> 01:11:57.180
 für mich schon verloren, also, ähm, es gibt da Ressourcen im Internet, äh, ich verlinke natürlich auch

01:11:57.180 --> 01:12:03.720
 RegularExpressions.info, ähm, wo man wirklich erklärt bekommt, wie funktioniert das denn und welche

01:12:03.720 --> 01:12:05.780
 Syntax ist denn für was verantwortlich und so.

01:12:06.600 --> 01:12:12.280
 Und mit der Zeit, klar war das auch wie bei den HTX, das Regeln, man sucht erstmal, man googelt, äh,

01:12:12.280 --> 01:12:18.000
 was, was will ich denn erreichen, ich brauche den und den Bestandteil aus dem und dem Wort und da gibt's ja auch

01:12:18.000 --> 01:12:23.320
 wirklich zu Regular Expressions, äh, gibt's ja auch tausende oder hunderttausende Millionen von Fragen,

01:12:23.380 --> 01:12:30.180
 ich weiß nicht wie viele, auf Stack Overflow, ähm, oft kommt dann die Antwort, das ist so eine der goldenen Regeln,

01:12:30.180 --> 01:12:34.520
 niemals HTML versuchen mit Regular Expressions zu parsen.

01:12:34.520 --> 01:12:37.240
 Da ist HTML nicht regulär, äh, genug dafür.

01:12:37.240 --> 01:12:41.680
 Und ich sag jetzt einfach auch mal was, äh, Kontroverses, um auf die Finger zu bekommen.

01:12:41.680 --> 01:12:46.800
 Also ich sage, wenn ich genau weiß, was ich da bekomme als Input, äh, dann warum nicht?

01:12:46.800 --> 01:12:52.480
 Ja, wenn ich dann noch drauf achte, auf variable Anzahl an Lehrzeichen, wenn ich die berücksichtige oder,

01:12:52.480 --> 01:12:57.080
 oder sonstige, wenn ich so ein bisschen mehr Gedanken drüber mache und ich weiß, was da reinkommt.

01:12:57.080 --> 01:13:00.520
 Und ich will wirklich nur da irgendwie ein Attribut und will dafür jetzt nicht irgendwie,

01:13:00.520 --> 01:13:03.380
 also je nachdem, manchmal, gut, im Browser geht's ja inzwischen auch, da kann ich,

01:13:03.380 --> 01:13:05.600
 da brauch ich keine extra Library, die mir das parsst.

01:13:05.600 --> 01:13:08.880
 Das geht inzwischen jetzt auch über Document, äh, Parsing und so.

01:13:08.880 --> 01:13:12.720
 Ähm, aber ganz ehrlich, ich hab das trotzdem auch schon gemacht.

01:13:12.720 --> 01:13:20.880
 Ein, ein ehemaliger gemeinsamer Kollege von uns, ähm, der übrigens sehr, sehr gerne Regular Expressions verwendet hat,

01:13:21.480 --> 01:13:27.260
 der hatte dazu einen schönen Spruch, der hat immer gesagt, ähm, du hast ein Problem,

01:13:27.260 --> 01:13:30.280
 du versuchst es mit Ragex zu lösen, dann hast du zwei Probleme.

01:13:30.740 --> 01:13:33.360
 Ja, gut, da ist, äh, tatsächlich was dran, ja.

01:13:33.360 --> 01:13:39.820
 Ähm, ja, also, ja, es ist, natürlich ist das eine unpopular Opinion, wenn ich jetzt sage, äh, hier, äh, kann man schon mal machen.

01:13:40.000 --> 01:13:44.600
 Aber das ist, glaub ich, wie bei allem, das ist wie, äh, evil is evil, ja.

01:13:44.600 --> 01:13:52.500
 Ja, natürlich ist es das und natürlich sollte ich das nicht einfach in, irgendwo an der Stelle, wo der User-Code, äh, reingekloppt wird.

01:13:52.840 --> 01:14:01.420
 Aber ich hab's tatsächlich auch schon an, an anderen Stellen benutzt, ja, als grad für irgendwelche internen Tools, wo ich weiß, da kommt nicht irgendwie User-Input rein.

01:14:01.740 --> 01:14:11.860
 Oder an Stellen, wo ich einfach wirklich weiß, da ist kein User-Input, sondern ich will irgendwie, äh, eine magische Funktion erstellen, die da irgendwie aus Code, den ich aus einer Config-Datei bekommen.

01:14:11.960 --> 01:14:26.020
 Gut, da muss ich natürlich drauf achten, dass die Config-Datei nicht manipuliert werden kann, was denn ich, ja, aber ich, ähm, man kann das schon, und ich hab auch genug Antworten schon zu dem Thema gefunden auf Stack-Overflow, wo die Leute, wo dann natürlich jemand um die Ecke kam, nö, aber evil is, äh, evil.

01:14:26.020 --> 01:14:38.000
 Ähm, und dann jemand aber gemeint hat, ja, aber in dem Fall kannst du's nutzen und es ist deine einzige Möglichkeit, wenn du das erreichen willst, was du da erreichen willst, das zu tun, und dann, dann kannst du's auch nutzen, ja.

01:14:38.000 --> 01:14:43.600
 Also man muss ja immer aufpassen mit so, äh, hier ist generell zu 100 Prozent in allen Fällen immer böse.

01:14:43.600 --> 01:14:55.360
 Also, aber ja, natürlich, wenn ich einen DOM-Parser hab und dazu nicht extra eine Library reinladen muss, dann parse ich mir natürlich das Mark-Up als, äh, mit dem richtigen Parser, um da auf Attribute hinzuzugreifen, ja.

01:14:55.360 --> 01:15:05.940
 Was mich noch interessieren würde, hast du irgendwie Tipps für Leute, die Regular-Expressions besser verstehen können, weil ich, also mittlerweile hab ich noch, äh, da wollte ich jetzt grad noch dazu kommen, dann, ich hab eigentlich das andere, das vorgezogen.

01:15:05.940 --> 01:15:18.640
 Ich wollte nur sagen, die, die, das war für mich auch sehr, äh, schreck, äh, gespensthaft, äh, für mich eine Zeit lang und mittlerweile hat's den, äh, seinen Schrecken auch verloren, aber vielleicht braucht's auch einfach ein bisschen Zeit, aber was sind denn deine Tipps da?

01:15:18.780 --> 01:15:37.360
 Also, es gibt, ähm, verschiedene, ähm, Regex-Tester, wenn man da das einfach mal googelt, Regex-Tester, ja, ich nenn jetzt einfach mal drei, es gibt aber noch viel mehr von solchen Tools, äh, regex101.com, äh, regexel.com und, äh, regex-Tester.com, das sind auch, glaub ich, gleich die drei ersten Ergebnisse, wenn man danach googelt.

01:15:37.700 --> 01:15:50.760
 Da kann man regex eingeben, man kann einen Beispieltext eingeben und man sieht wunderschön mit Highlights nicht nur, was der findet, sondern auch farblich hervorgehoben, ähm, was solche Character Groups matcht, was einfach nur Gruppierung ist, ähm, und so weiter und so fort.

01:15:50.760 --> 01:16:03.760
 Ähm, und teilweise, ich glaub, gerade bei Regex 101 war das, wo man auch wirklich lernen kann dabei, wo man also wirklich sieht, was was macht, ähm, und das ist unglaublich hilfreich, wenn jetzt komplizierte Regex-Expressions sind.

01:16:03.760 --> 01:16:32.820
 Äh, den, den benutze ich regelmäßig, also immer, wenn ich irgendwas mit Regex mach, äh, dann hau ich das mal in Regex rein, ähm, weil das hilft mir echt, äh, sehr, äh, da ist das so, die Regex, die man oben einträgt, äh, dann kann man mit der Maus drüber gehen und dann, äh, werden einzelne Buchstaben oder einzelne Zeichen oder Paare gehighlighted und da wird dann einem, kriegst du direkt auch dann, äh, so einen kleinen Tooltip, der dir dann anzeigt, was macht denn das jetzt hier gerade genau?

01:16:32.820 --> 01:16:33.400
 Genau, ja.

01:16:33.400 --> 01:16:38.040
 Und das, das ist extrem hilfreich, um Regex zu schreiben, ja.

01:16:38.040 --> 01:16:50.360
 Genau, auf jeden Fall, das hilft beim Entwickeln von, von komplexeren, äh, regulären Ausdrücken und zum Lernen, wie gesagt, regularexpressions.info, da wird wirklich alles erläutert, was es da für Möglichkeiten gibt.

01:16:50.360 --> 01:17:02.800
 Man muss immer drauf achten, Regular Expressions in der Einsprache sind nicht, nicht immer, also, oder sagen wir mal, es gibt Features, ja, es gibt so ein, ein, ein Superset an, an Features, die Regular Expressions,

01:17:02.820 --> 01:17:14.780
 unterstützt und anbietet, aber nicht jede Sprache implementiert alles davon. Also, da findet man dann Beispiele, Beispiele für Python oder für, was weiß ich, irgendeine Programmiersprache und man kopiert das einfach in JavaScript und das funktioniert nicht.

01:17:14.780 --> 01:17:26.040
 Oder auch JavaScript und PHP sind da sehr unterschiedlich, äh, was das angeht. Wird immer ähnlicher, weil immer mehr unterstützt wird, ähm, aber da muss man aufpassen, was die Sprache, die man, in der man das verwenden will, auch tatsächlich kann.

01:17:26.040 --> 01:17:37.480
 Also, zum Beispiel so Sachen, ich will das jetzt auch gar nicht erklären im Detail, aber, äh, look ahead und look behind, ja, wo man dann gucken kann, ob dann die nächste Zeichenfolge dem entspricht, aber nicht mitgematcht wird und so weiter und so fort.

01:17:37.900 --> 01:17:56.060
 Oder was ich letztens hatte, ähm, was ich auch ganz cool finde, eigentlich, Unicode, äh, Syntax, ähm, da hab ich mich wieder beschäftigt mit chinesischen Schriftzeichen, also generell für, ähm, logografische oder ideografische Schriftzeichen, japanisch, koreanisch, chinesisch und so weiter, ähm, wo man wirklich Zeichengruppen matchen konnte.

01:17:56.060 --> 01:18:12.480
 Äh, hab ich jetzt das Beispiel nicht da, aber das, das ist dann wirklich mit, äh, ich glaub, backslash p und dann in geschweiften Klammern kann ich dann wirklich sagen, ideographic, ähm, äh, special, was weiß ich, also wirklich Charaktergruppen, um dann eben japanisch rauszufiltern.

01:18:12.480 --> 01:18:21.900
 Also, da wollte ich gucken, sind die ja eingegebenen Zeichen tatsächlich, äh, hochchinesisch, sag ich mal, und nicht irgendwie japanisch, was ja auch chinesische Zeichen, äh, benutzt.

01:18:22.660 --> 01:18:28.220
 Und da wollte ich wirklich nur chinesische Zeichen haben, da geht's ja auch nochmal um Unterschied zwischen Taiwan und, äh, Mainland, äh, China.

01:18:28.220 --> 01:18:38.160
 Und da kann man wirklich dann solche Gruppen matchen, Unicode ist ja aufgeteilt in so verschiedene Gruppen oder Tabellen, weiß ich nicht, ob das jetzt der richtige Begriff dafür ist, aber so verschiedene Subsets eben an Zeichen.

01:18:38.160 --> 01:18:46.540
 Und dann wollte ich zum Beispiel noch rausfiltern, alle chinesischen Zeichen, aber nicht chinesische Sonderzeichen wie Satzzeichen, Ausrufezeichen, Fragezeichen und so weiter.

01:18:46.540 --> 01:18:52.180
 Und das geht also darüber. Es, äh, in, in ES6 ist die Unterstützung dafür deutlich besser geworden.

01:18:52.660 --> 01:18:59.360
 Ähm, aber so hundertprozentig hat's teilweise auch nicht funktioniert. Ähm, ja, muss man eben gucken, was die Sprache unterstützt.

01:18:59.360 --> 01:19:03.120
 Aber es ist sehr mächtig und das macht, glaube ich, auch vielen Leuten Angst.

01:19:03.280 --> 01:19:13.620
 Und wenn man dann nach, dann nach was fragt und dann kommt da die Antwort und dann sagt jemand so, ja, ist doch ganz einfach, so bitte hier. Und dann hast du halt irgendwie drei Zeilen Regular Expression und am besten noch ohne Erklärung.

01:19:13.620 --> 01:19:16.380
 Und das kann einem natürlich schon Angst machen.

01:19:16.380 --> 01:19:20.480
 Ja, Mensch, äh, sag mir nie wieder, ich darf nicht ausschweifen.

01:19:20.480 --> 01:19:21.980
 Ja, sorry.

01:19:22.080 --> 01:19:26.400
 Nö, nö, äh, ich, ich finde das total okay.

01:19:26.400 --> 01:19:31.660
 Ähm, aber ich hoffe doch, der eine oder andere hat wieder vielleicht was dabei gelernt, was er vorher noch nicht wusste.

01:19:31.660 --> 01:19:32.860
 Ja, ich zum Beispiel.

01:19:32.860 --> 01:19:33.900
 Sehr schön.

01:19:33.900 --> 01:19:38.680
 Ähm, genau, aber dann, äh, gehen wir jetzt mal gleich zum nächsten oder hast du noch was zur Regular Expression?

01:19:38.680 --> 01:19:40.760
 Nee, das, das, das tatsächlich jetzt mal, ich, jetzt halte ich mal kurz die Klappe.

01:19:40.760 --> 01:19:47.880
 Äh, ach, ach was? Du darfst, du darfst jederzeit, weil jetzt kommt was, wo du auch wieder, wo du auf jeden Fall mitreden kannst und auch willst, das weiß ich schon.

01:19:47.880 --> 01:19:51.640
 Äh, CSS-Spezifität ist mein nächstes Thema.

01:19:51.640 --> 01:19:55.660
 Da haben wir uns ein bisschen drum gekloppt, um den nächsten Punkt, muss man gleich mal sagen.

01:19:55.660 --> 01:20:03.880
 Ja, wir haben uns, ich, ich, ich hatte das unter dem Punkt Kaskade, CSS-Kaskade schon aufgenommen und du hast da nochmal Spezifizität, äh, extra hinzugefügt.

01:20:03.880 --> 01:20:09.400
 Da dachte ich schon so, hm, hoppla, das geht für mich hart in Hand, aber mach du erstmal deine Spezifizität und, äh, vielleicht sag ich so was.

01:20:09.400 --> 01:20:16.740
 Ich finde super, dass du Spezifizität sagst, weil das ist nämlich, äh, du hast Quatsch, Spezifizität, äh, ein Deutsch, das heißt aber auf Deutsch.

01:20:16.740 --> 01:20:17.860
 Spezifizität oder, warte mal.

01:20:17.880 --> 01:20:19.360
 Spezifizität?

01:20:19.360 --> 01:20:20.440
 Spezifizität oder Spezifizität?

01:20:20.440 --> 01:20:21.300
 Egal.

01:20:21.300 --> 01:20:27.440
 Äh, ich glaube auf Deutsch heißt es Spezifität, ohne, ohne, ohne, ohne extra Spezifizität.

01:20:27.440 --> 01:20:29.640
 Also mein, mein Word unterkringelt es nicht.

01:20:29.640 --> 01:20:32.300
 Was Spezifität?

01:20:32.300 --> 01:20:33.460
 Spezifizität.

01:20:33.460 --> 01:20:35.040
 Spezifizität.

01:20:35.040 --> 01:20:37.600
 Ich glaube, wie das schon klingt.

01:20:37.600 --> 01:20:40.820
 Erzähl du mal, ich guck mal kurz bei Duden, wie es heißt.

01:20:41.060 --> 01:20:56.960
 Ja, guck, guck, guck, guck, guck du mal, guck du mal bitte nach, ähm, vielleicht lege ich ja auch komplett falsch, ich nenne es einfach mal Spezifität, solange, ähm, oder, äh, Specificity oder noch besser, das hatten wir auch in einer anderen Folge schon mal, Specificity und was es damit auf sich hat, äh, das kommt am Ende noch.

01:20:56.960 --> 01:20:59.500
 Und ich sag ganz kleinlaut, okay, es ist Spezifität.

01:20:59.500 --> 01:21:03.220
 Ah, sehr gut, hatte ich doch recht.

01:21:03.220 --> 01:21:23.380
 Ähm, genau, äh, da geht es darum, wenn ich CSS schreibe, äh, dann, dann, dann, dann habe ich ja normalerweise immer irgendeine Art Selektor, also ein, ein Ding, mit dem ich sage, auf welchen Bereich in meinem HTML soll denn das jetzt wirken, auf, auf, auf, auf welchen Bereich in meinem HTML soll das jetzt Auswirkungen haben.

01:21:23.540 --> 01:21:35.460
 Das ist der Selektor. Und, ähm, dann hat man, also, ich glaube, wenn man anfängt CSS zu schreiben, dann hat man immer mal wieder den Fall gehabt, äh, ich schreibe CSS und es hat keine Auswirkungen.

01:21:35.460 --> 01:21:47.100
 Ich sehe, ich sehe nicht, ich sehe, ich sehe keine Auswirkungen davon und das war in der Zeit, als wir das noch gelernt haben, Konstantin, war das noch viel schlimmer als heutzutage, weil du einfach gar nicht wusstest, warum.

01:21:47.620 --> 01:21:58.020
 Man hat, man hat einfach gesehen, na, es hat jetzt irgendwie gerade keiner, das, was ich geschrieben habe, irgendwie passiert damit nichts. Ich habe jetzt hier irgendwie eine Background-Color von schwarz hinterlegt, aber irgendwie sie trotzdem immer noch weiß.

01:21:58.020 --> 01:22:09.280
 Und man wusste einfach nicht, ich muss gerade, das Bild, was ich gerade gesehen habe, muss ich, muss ich gerade kurz kommentieren, der, Konstantin, hat einen sehr tiefen, äh, Schluck aus, aus seiner Hanf-Alm-Dugler-Schück genommen.

01:22:09.600 --> 01:22:21.500
 Auf jeden Fall ist er jetzt gut drauf. Ähm, genau. Äh, damals war das noch, äh, also ich, wir haben ja beide noch angefangen zu entwickeln, wo es noch nicht mal Firebug gab, also im Prinzip keine Entwickler-Tools sozusagen.

01:22:21.500 --> 01:22:34.040
 Also man war noch so ein bisschen auf, äh, ja, man musste Dinge eigentlich auswendig wissen, um zu wissen, warum, warum passiert denn hier jetzt was? Man hat nicht vom, vom Browser oder von den Dev-Tools gesagt bekommen, ähm, hier stimmt was nicht.

01:22:34.180 --> 01:22:48.800
 Oder, äh, mittlerweile, es ist ein Firefox, ist übrigens ein sehr cooles Feature, gibt's noch nicht so lange, ähm, dass einem unter bestimmten Umständen dann auch, also dies mit der Spezifität, warum, warum da etwas nicht richtig angezeigt wird, das sagt er einem schon sehr lange, der streicht dann die Zeile durch.

01:22:49.320 --> 01:22:58.500
 Aber mittlerweile sagt er einem auch, ähm, warum, äh, warum eine bestimmte Eigenschaft nicht wirken kann, weil zum Beispiel eine Voraussetzung dafür nicht gegeben ist.

01:22:58.500 --> 01:23:06.180
 Also zum Beispiel, wenn ich irgendwelche, äh, Flex, äh, Eigenschaften benutze, aber gar keinen Flex-Container habe oder so.

01:23:06.180 --> 01:23:08.100
 Na, egal, das ist schon wieder ausgeschweift.

01:23:08.100 --> 01:23:09.060
 Spezifität.

01:23:09.060 --> 01:23:11.200
 Was hat's damit auf sich?

01:23:11.200 --> 01:23:16.280
 Ähm, der Selektor bekommt einen Wert berechnet.

01:23:16.280 --> 01:23:22.880
 Der Selektor, den ich schreibe im CSS, der bekommt einen Wert berechnet und der Selektor mit dem höchsten Wert für das gleiche Element gewinnt.

01:23:22.880 --> 01:23:26.740
 So, so, um, um das mal so ganz simpel auszudrücken.

01:23:26.740 --> 01:23:33.220
 Ähm, jetzt gibt es da verschiedene, verschiedene Selektoren, es gibt ja verschiedene Möglichkeiten, HTML zu selektieren.

01:23:33.220 --> 01:23:41.400
 Ähm, ich glaube so, dass, dass, das, das Einfachste, was, was man kennt, ist, man schreibt einfach das Tag hin, das, äh, also das, das Element, der Elementselektor.

01:23:42.160 --> 01:23:48.020
 Ähm, dann gibt es so was wie Attributselektoren oder Klassenselektoren, die sind bestimmt bekannt.

01:23:48.020 --> 01:23:54.260
 Ähm, also wenn, dann, die Klassenselektoren sind momentan eigentlich so das, was, was am häufigsten verwendet wird, glaube ich.

01:23:54.260 --> 01:23:58.320
 Ähm, Pseudoklassen hat bestimmt auch jeder schon mal gesehen.

01:23:58.320 --> 01:24:01.360
 Ich, ich gehe auch gleich nochmal darauf ein, wie das alles genau aussieht.

01:24:01.460 --> 01:24:03.800
 Also, so für die Leute, die vielleicht noch nicht so tief da drin sind.

01:24:03.800 --> 01:24:09.520
 Ähm, dann gibt es noch, äh, ID-Selektoren natürlich.

01:24:09.520 --> 01:24:11.940
 Es gibt Inline-Styles und es gibt Important.

01:24:11.940 --> 01:24:17.020
 Important ist eigentlich kein Selektor, aber da kommen wir gleich noch drauf, was es damit auf sich hat.

01:24:17.020 --> 01:24:22.260
 So, ähm, jetzt habe ich ja gesagt, man kann das berechnen.

01:24:22.460 --> 01:24:26.320
 Das bedeutet, jeder, jede Selektorenart hat so eine Art Wert.

01:24:26.320 --> 01:24:32.440
 Und am Ende wird zusammengezählt, was ich, welche, welche Selektoren ich habe.

01:24:32.440 --> 01:24:34.720
 Und am Ende, da ergibt sich dann ein Wert draus.

01:24:34.720 --> 01:24:42.680
 Also, zum Beispiel, wenn ich jetzt einen Elementselektor habe, also ein Tag, also ich, zum Beispiel, ein Div oder einfach nur P, dann hat er den Wert 1.

01:24:43.240 --> 01:24:45.360
 Die Elementselektoren haben immer den Wert 1.

01:24:45.360 --> 01:24:49.520
 Das heißt, wenn ich jetzt auch mehrere Elementselektoren hintereinander schreibe, dann hat er jeder 1.

01:24:49.520 --> 01:24:56.000
 Also, wenn ich jetzt sage, zum Beispiel, Div, P, A oder sowas, dann habe ich, hätte ich dann den Wert 3.

01:24:56.000 --> 01:24:57.020
 Die werden aufaddiert.

01:24:57.020 --> 01:25:03.400
 Ähm, der Klassenselektor, der ist dann schon ein bisschen, äh, mächtiger.

01:25:03.400 --> 01:25:05.280
 Der hat den Wert 10.

01:25:05.280 --> 01:25:07.680
 Oder einer hat den Wert 10.

01:25:07.680 --> 01:25:11.640
 Ähm, das heißt, ich habe hier irgendwie, äh, eine Klasse MyClass.

01:25:12.260 --> 01:25:18.760
 Oder ich habe tatsächlich, äh, was da, was da auch geht, ich glaube, äh, Moment, jetzt, äh, jetzt kommen wir gleich noch dazu.

01:25:18.760 --> 01:25:21.780
 Ähm, die Pseudoklassen gehören da dazu.

01:25:21.780 --> 01:25:30.820
 Also, sowas wie, ähm, First Child, Last Child, äh, Only of Type oder sowas gehört da dazu.

01:25:30.820 --> 01:25:33.680
 Also, ist auch eine Klasse, hat auch den Wert 10.

01:25:33.680 --> 01:25:42.240
 Also, auch die, wenn ich die addiere und mehrere Klassenselektoren habe, ähm, dann, also ich nehme mal an, ich habe jetzt, ähm, ähm, äh, Klasse,

01:25:42.240 --> 01:25:48.640
 Klassenselektor, äh, und, ähm, dann noch ein Attribut, äh, Quatsch, ein, äh, ein Pseudoklassenselektor, dann wären das zwei.

01:25:48.640 --> 01:25:49.560
 Das sind dann 20.

01:25:49.560 --> 01:25:58.120
 Und wenn ich da dann vielleicht noch ein, ähm, ein Elementselektor mit reinpacke, dann wären es, also einen dazu, dann wären es 21.

01:25:58.120 --> 01:25:59.800
 Also, so wird das immer weiter aufaddiert.

01:25:59.800 --> 01:26:01.300
 Also, man kann natürlich auch aufaddieren.

01:26:01.300 --> 01:26:02.900
 Man kann natürlich kombinieren miteinander, ja?

01:26:02.960 --> 01:26:07.800
 Ich würde da ganz, ganz kurz gerne einhaken wollen, weil die Erklärung ein bisschen irreführend ist.

01:26:07.800 --> 01:26:11.040
 Ich glaube, du, äh, hast dich da orientiert an, an MDN, oder?

01:26:11.040 --> 01:26:12.420
 Nee, hab ich nicht.

01:26:12.420 --> 01:26:12.600
 Nicht?

01:26:13.320 --> 01:26:20.420
 Weil es ist tatsächlich, es ist nicht so, also, ich habe mir das ein bisschen anders, ähm, eingeteilt, oder aus dem Artikel, wo ich das, äh, hatte.

01:26:20.420 --> 01:26:23.040
 Äh, es gibt eigentlich drei Zähler, ne?

01:26:23.040 --> 01:26:24.920
 Sagen wir mal A, B und C.

01:26:24.920 --> 01:26:29.340
 Und ich finde das gefährlich mit dem, das hat den Wert 10, weil das hat es eigentlich nicht.

01:26:29.680 --> 01:26:33.240
 Also, es sind eigentlich drei, drei selbstständige Zähler, ja?

01:26:33.240 --> 01:26:44.160
 Und, äh, in dem MDN-Artikel steht in so einer gelben Box, äh, ich hab's mal übersetzt aus dem Englischen, eine Million Class-Selektoren kombiniert können nicht die Regeln eines einzelnen ID-Selektors überschreiben.

01:26:44.160 --> 01:26:44.440
 Okay.

01:26:44.440 --> 01:26:46.520
 Und das ist, das ist, das ist ein bisschen irreführend.

01:26:46.520 --> 01:26:53.660
 Das sind also nicht wirklich jetzt von einer dreistelligen Zahl die Ziffern, weil sonst hätte ich ja bei größer als 10 auch irgendwann das Problem, dann komme ich in den Tausender-Bereich, ja?

01:26:54.120 --> 01:27:07.660
 Sondern es sind drei verschieden gewichtete Zähler und, ähm, am spezifischsten ist der ID-Selektor, das heißt, wenn der fünf hat, das sind eigentlich drei Werte, sagen wir mal, äh, 1, 0, 0, ja?

01:27:07.660 --> 01:27:12.260
 Oder halt, wenn ich fünf ID-Selektoren drin hab, sind es 5, 0, 0 und das ist natürlich spezifischer.

01:27:12.260 --> 01:27:21.160
 Ja, äh, danke für die Anmerkung, das ist total korrekt, was der Konstantin sagt, also ich kann, äh, ja, das ist wirklich eine wichtige und, und, äh, ja, vielleicht sollte man das, nein.

01:27:21.160 --> 01:27:28.420
 Ich hab grad überlegt, wollen wir das rausschneiden? Der Moritz hat ja totalen Quatsch geredet, aber ich hab vorher noch gesagt, vor der Folge, es wird nichts geschnitten, deswegen wird auch nichts geschnitten.

01:27:28.420 --> 01:27:38.300
 So, wird nichts geschnitten. Ähm, nein, der Konstantin hat vollkommen recht, ich kann nicht mit, äh, mit 1000, äh, Elementselektoren einen Klassenselektor überschreiben, das geht nicht.

01:27:38.300 --> 01:27:50.500
 Beziehungsweise in dem Fall müssten es dann, ne, ich hab gar keine Ahnung, nein, es sind tatsächlich verschiedene Bereiche, aber die Anmerkung, die ich dazu noch hab, da wollte ich eigentlich noch dazu kommen, aber jetzt, jetzt muss ich das, glaub ich, jetzt schon sagen, es sind nicht nur drei, es sind fünf.

01:27:51.160 --> 01:27:58.220
 Ähm, und wieso das fünf sind, da komm ich gleich noch dazu. Ähm, es gibt fünf verschiedene Blöcke.

01:27:58.460 --> 01:28:12.880
 Okay, aber gut, danke, also auf jeden Fall danke für die Ergänzung, das ist absolut korrekt. Ähm, also sprechen wir nicht mehr von, von 1 und 10, sondern sprechen wir von Block 1, äh, bei den, bei den Elementselektoren, sprechen wir von Block 2 bei den Klassenselektoren.

01:28:13.100 --> 01:28:34.920
 Das heißt, IDs, ähm, die schön mit der Raute, äh, markiert werden in CSS, ähm, das wäre dann Block 3, ähm, der dann halt, je nachdem, wie viele IDs ich verwende, da noch was dazu bekommt, also, äh, genau, letzten Endes wird alles wieder aufaddiert, aber das ist dann tatsächlich, Block 3 ist natürlich wichtiger als Block 2 und auch als Block 1 und so weiter.

01:28:34.920 --> 01:28:52.740
 Ähm, jetzt kommen wir aber noch zu dem, was ich gerade gesagt habe, es gibt noch Block 4 und 5, äh, und zwar, wenn ich ein Inline-Style nehme, jetzt mal ganz abgesehen davon, dass das kein eigener Selektor ist, sondern ich habe ein Style-Attribut im HTML drinstehen,

01:28:53.740 --> 01:29:09.620
 Dann erzeugt das damit quasi alles, was da drin schon ist, äh, Block 4, also sozusagen 1000, 1000, wenn man so will, ja, also alles, was da drin steht, wird dann natürlich nochmal aufaddiert, weil ein Inline-Style geht immer über das, was in dem CSS-File irgendwo steht.

01:29:09.620 --> 01:29:11.040
 Außer?

01:29:11.040 --> 01:29:12.360
 Und wenn du jetzt, äh?

01:29:12.360 --> 01:29:13.180
 Außer?

01:29:13.180 --> 01:29:22.280
 Außer, außer, und da berufe ich mich jetzt auf, ähm, auf mein, das hatten wir in einer anderen Folge schon mal, auf mein wunderschönes, äh, Bildchen Specificity.

01:29:23.560 --> 01:29:39.860
 Außer, ich schreibe ein Important hinter etwas, also Ausrufezeichen Important, ähm, dann komme ich in den fünften Block, das wäre dann quasi 1000,000, und damit kann ich auch den Inline-Style nochmal überschreiben.

01:29:39.860 --> 01:29:53.500
 Äh, da ist, das ist dann schön, also bei Specificity wird das alles mit Fischen gezeigt und, äh, spätestens beim Style-Attribut hören die Fische auf, da kommt dann schon der, äh, kommt dann schon der Zerstörer, beziehungsweise in dem Fall ist es, glaube ich, ein Ölboot.

01:29:53.500 --> 01:30:04.280
 Äh, und bei Important, äh, also bei dem, äh, bei dem Zehntausender sozusagen, äh, kommt dann schon die Atombombe, da kommt dann nach nichts mehr, wobei ich sagen würde, doch, danach kommt noch was.

01:30:04.800 --> 01:30:24.720
 Ein Important im Inline-Style, also da, äh, und das muss dann noch, ähm, das habe ich jetzt noch gar nicht gesagt, das muss dann noch ganz unten, äh, im, im Dokument irgendwie stehen, oder am, äh, äh, ganz, ganz weit hinten.

01:30:24.720 --> 01:30:34.580
 Ähm, weil, äh, wenn zwei Werte, das hätte ich vielleicht am Anfang eigentlich sagen sollen, wenn zwei Werte identisch sind, dann, äh, dann gewinnt das Zweite oder das, das Letzte gewinnt.

01:30:34.580 --> 01:30:40.980
 Wenn, wenn es mehrere identische Werte gibt, dann gewinnt das Letzte, das heißt, das Unterste im Dokument, das Unterste in der CSS-Datei.

01:30:41.720 --> 01:30:45.200
 Oder, ich weiß gar nicht, damit kommen wir dann eigentlich schon zur, zur Kaskade.

01:30:45.200 --> 01:31:10.200
 Äh, ja, ich wollte ein, äh, okay, bevor wir zur Kaskade kommen, noch eine kleine Ergänzung, also Specificity, äh, werden wir noch verlinken in den Shownotes und, ähm, es gibt, äh, bei CSS-Selektoren noch was, ähm, also ich muss noch ganz kurz sagen, warum war das für mich jetzt so eine, so eine verrückte, äh, Erkenntnis, ähm, dass man so einen Wert ausrechnen kann, weil ich oft Fragezeichen über dem Kopf hatte, warum wird das jetzt irgendwie nicht angezeigt, warum wird das nicht genommen?

01:31:10.200 --> 01:31:24.180
 Naja, weil der Wert nicht stimmt und den Wert kann man ganz einfach ausrechnen, beziehungsweise, ja, mit diesen, also ich, ich hab's immer simpel addiert, das geht meistens, aber der Konstantin hat recht, es sind einzelne Blöcke, ich kann mit, mit 1000, äh, Element-Selektoren keinen Klassenselektor überschreiben.

01:31:24.180 --> 01:31:40.120
 Die kleine Ergänzung, die ich noch machen wollte, ist, die Kombinatoren, die es gibt in CSS, sowas wie der Plus-Kombinator für, äh, das, das, äh, den nächsten, ähm, Sibling, ähm, oder das direkte Kind, äh, mit, mit, äh, dem, äh, größer, größer Zeichen.

01:31:40.200 --> 01:31:51.100
 Äh, äh, oder die Tilde, ähm, die haben keine Spezifität, die werden da nicht mit reingerechnet, ebenso der Sternselektor, der Universalselektor, der hat auch keinen Wert, was das angeht, der hat quasi null.

01:31:51.840 --> 01:31:54.320
 Das war noch meine kleine Ergänzung, jetzt können wir zur Kaskade kommen.

01:31:54.320 --> 01:32:03.720
 Wunderbar, genau, äh, für die Kaskade gehen wir eigentlich noch mal einen Schritt zurück, bevor wir, äh, äh, an die, an die Spezifizität, äh, Spezifität kommen.

01:32:03.720 --> 01:32:07.720
 Ich, für mich heißt das Spezifizität, ich werde das, glaube ich, auf Deutsch auch immer so sagen.

01:32:08.280 --> 01:32:16.320
 Ähm, genau, die Kaskade, das ist eigentlich die Reihenfolge, beziehungsweise die, die Quelle der Einbindung des CSS, wo das herkommt.

01:32:16.880 --> 01:32:32.980
 Und da gibt's eine bestimmte Reihenfolge, und zwar das, äh, Browser-Style-Sheet, das heißt, die, das, die Standardformatierung, zum Beispiel, dass ein Strong-Tag eben gefettet ist, oder ein EM-Tag, äh, Italic ist, die kommt aus dem Browser, das bringt der Browser mit.

01:32:33.560 --> 01:32:36.660
 Das hat also die niedrigste Spezifität, wenn man so will.

01:32:36.660 --> 01:32:51.040
 Und danach kommt die Benutzer-Deklaration, ja, also in den Browser-Einstellungen kann ich ja zum Beispiel sagen, ich bin, ich hab ne, äh, große Sehschwäche, ich brauch auf jeden Fall, äh, mindestens, äh, 20 Pixel Schriftgröße, um was erkennen zu können.

01:32:51.040 --> 01:32:56.420
 Das kann ich im Browser festlegen, das ist dann auch wieder ein Browser-Style-Sheet, aber das der, der Benutzer definiert hat.

01:32:56.420 --> 01:33:01.480
 Danach kommt die Autor-Deklaration, das ist das, was die Seite selbst mitbringt.

01:33:02.920 --> 01:33:10.480
 Und zwar eben durch, äh, per Link-Tag-Style-Sheets angezogen in der Datei, oder auch durch, ähm, durch Style-Tags.

01:33:10.480 --> 01:33:18.560
 Dann als nächstes Important in Autor-Deklaration und dann am Schluss Important durch Benutzer-Deklaration.

01:33:18.560 --> 01:33:28.180
 Und das ist wichtig zu wissen, weil ich eben so dafür sorgen kann, dass diese Browser-Minimal-Frontgröße zum Beispiel nicht wieder überschrieben werden kann.

01:33:28.180 --> 01:33:32.780
 Und das ist eine Besonderheit, die mir so auch nicht vorher bewusst war.

01:33:32.780 --> 01:33:34.140
 Da habe ich mir so keine Gedanken drüber gemacht.

01:33:34.140 --> 01:33:35.500
 Genau, und das ist eben die Kaskade.

01:33:35.500 --> 01:33:37.060
 Und das ist so die Standard-Reihenfolge.

01:33:37.060 --> 01:33:51.820
 Aber über die Spezifität, Spezifität, meine Fresse, über die Spezifität, ich sage es jetzt einfach nicht mehr, ähm, der Regeln an sich kann ich natürlich dann auch wieder, äh, innerhalb der Kaskade gewichten.

01:33:52.180 --> 01:33:53.280
 So, fertig.

01:33:53.280 --> 01:33:57.200
 Okay, du hast fertig.

01:33:57.200 --> 01:34:09.880
 Ähm, ja, mein, mein letztes, ähm, und das ist noch, das ist, das ist jetzt nicht mehr so weit in der Vergangenheit, ähm, bei mir ist, Note-Modules, habe ich es mal genannt, Note-Modules sind nicht so geheimnisvoll.

01:34:09.960 --> 01:34:12.720
 Oder der Note-Modules-Ordner um die, ihm geht es mir im Speziellen.

01:34:12.720 --> 01:34:19.540
 Aber das ist eigentlich nur eine ganz kleine Sache, ich weiß gar nicht, ob wir da groß drüber reden müssen, dass, wir sind auch schon relativ weit fortgeschritten in der Zeit, sehe ich gerade.

01:34:20.000 --> 01:34:22.660
 Aber wir wollen uns ja nicht beeilen, wir sind ja gechillt.

01:34:22.660 --> 01:34:28.500
 Ähm, ich habe lange, also Note-Modules war für mich lange sowas wie, wie ein Server.

01:34:28.500 --> 01:34:41.760
 Naja, ich mache da irgendwie ein NPM-Install und dann passieren da irgendwelche Dinge und dann erscheint da so ein Ordner und die IDE oder der Editor markiert den Ordner schon so als, als, also in VS Code ist das glaube ich so, wird so ein bisschen ausgegraut dargestellt.

01:34:41.760 --> 01:34:47.480
 Ist sowas, wo man, naja, da sollte man nicht reingucken, hat es irgendwie mir immer gesagt, weiß ich nicht, ob das stimmt.

01:34:48.100 --> 01:34:58.700
 Ähm, nee, kann man, kann man gerne mal reingucken, ist eine Menge Kram drin wahrscheinlich, äh, eine Menge, eine Menge Dependencies, die man nie haben wollte, aber dann irgendwie sich durch die Package-JSON reingezogen hat.

01:34:58.700 --> 01:35:07.780
 Ähm, und ich habe lange mich dann gefragt, ja, wie kann man denn eigentlich jetzt, wenn ich jetzt so direkt was aus dem Note-Modules haben will, äh, wie kann ich das denn dann irgendwie nehmen?

01:35:07.780 --> 01:35:11.140
 Das war für, war für mich so ein, Note-Modules war für mich so eine Art Blackbox.

01:35:11.140 --> 01:35:17.160
 Und dann habe ich irgendwo tatsächlich mal ein Beispiel gesehen, wo jemand gesagt hat, hey, äh, ja, ich, ich verlinke da direkt rein.

01:35:18.100 --> 01:35:23.120
 Also, das ist für mich einfach ein Ordner wie jeder andere auch oder ein Verzeichnis wie jedes andere auch.

01:35:23.120 --> 01:35:25.880
 Äh, und da habe ich halt dieses Modul und da verlinke ich rein.

01:35:25.880 --> 01:35:35.900
 Ähm, kann, also da sind, da liegen einfach nur HTML, CSS, JavaScript-Files drin, also in vielen Fällen nur JavaScript-Files, aber in manchen Fällen halt, liegt da ja noch viel mehr drin.

01:35:35.900 --> 01:35:42.800
 Kannst also ein CSS-File aus dem Note-Modules-Ordner einfach genauso einbinden, indem du einfach den Pfad nimmst, der da reinlinkt.

01:35:43.520 --> 01:35:57.700
 Es gibt ja zum Beispiel auch CSS-Libraries, die aber auf npm verfügbar sind, zwecks Versionierung und zwecks einfacher Einbindung, wo ich dann aber halt doch, wenn ich dann eine bestimmte Theme-Datei oder was weiß ich anziehen will, die dann halt wirklich auch im Note-Modules-Ordner verlinken muss.

01:35:58.800 --> 01:36:04.140
 Ja, und, äh, ich habe vor kurzem gemerkt, ähm, und das habe ich mir schon immer gedacht, dieser Note-Modules-Ordner, der wird ja generiert.

01:36:04.140 --> 01:36:13.880
 Das heißt, ich habe, wenn jetzt morgen, äh, keine Ahnung, das System umstellt und sagt, die Struktur ist jetzt anders, dann geht dein Link kaputt.

01:36:13.880 --> 01:36:14.200
 Mhm.

01:36:14.200 --> 01:36:15.320
 Oder dann geht dein Pfad kaputt.

01:36:15.320 --> 01:36:19.480
 Das ist, deswegen finde ich, das, fühlt sich das irgendwie schmutzig und falsch an.

01:36:19.480 --> 01:36:26.180
 Ähm, das ist so mein Gefühl immer gewesen, ähm, da direkt was drin zu machen, das, das ist irgendwie nicht so der richtige Weg.

01:36:26.260 --> 01:36:29.100
 Aber es gibt manchmal Situationen, wo man leider nicht dran vorbeikommt.

01:36:29.100 --> 01:36:33.080
 Das ist wieder das Gleiche wie mit, mit E-Wahl und das Gleiche wie mit Regex und HTML.

01:36:33.080 --> 01:36:33.620
 Genau.

01:36:33.620 --> 01:36:35.940
 Manchmal ist es einfach der richtige Weg, das so zu tun.

01:36:35.940 --> 01:36:41.140
 Ich würde sagen, ähm, wenn man es irgendwie vermeiden kann, sollte man es vermeiden.

01:36:41.140 --> 01:36:46.020
 Das ist so mein, mein Gefühl. Ich habe das nirgends gelesen, das hat auch mir niemand gesagt.

01:36:46.020 --> 01:36:51.060
 Das war immer nur so, naja, früher war die Struktur da drin mal anders, jetzt ist sie so.

01:36:51.060 --> 01:36:55.500
 Also, da kann ich nur nochmal so einen alten Tweet, den, den packen wir auch in die Shownotes.

01:36:56.120 --> 01:37:01.760
 Ähm, mal verlinken, da, da hat die, äh, Laura Eck bei Twitter mal ein schönes Bild gepostet.

01:37:01.840 --> 01:37:09.720
 Irgendwie, ähm, ich versuche mal zu beschreiben, was drauf ist, äh, das, da steht, äh, groß drauf, the heaviest objects in the universe.

01:37:09.720 --> 01:37:16.680
 Ähm, und dann kommt irgendwie als erstes die Sonne und dann ist, ist da so dieses Raumkrümmungsbild, also mit, mit so einem Raster.

01:37:16.760 --> 01:37:22.660
 Und das hat wahrscheinlich jeder schon mal gesehen, wie viel, äh, wie schwer ist ein Objekt, wie viel krümmt das denn Raum?

01:37:22.660 --> 01:37:27.860
 Und dann kommt die Sonne und die krümmt so ein bisschen und dann kommt der Neutron Star und der krümmt schon sehr, sehr deutlich.

01:37:27.860 --> 01:37:32.440
 Dann kommt das schwarze Loch und das geht schon extrem weit nach unten und krümmt.

01:37:32.480 --> 01:37:36.360
 Und dann kommt Node-Modules und das, da sieht man gar nicht, wie weit das runter geht.

01:37:36.360 --> 01:37:38.840
 Äh, weiß nicht, ob du den, ob du das kennst.

01:37:38.840 --> 01:37:39.600
 Das ist von, was, von 2017?

01:37:39.600 --> 01:37:40.900
 Ich glaube, ich hab's schon mal gesehen, ja.

01:37:41.240 --> 01:37:42.960
 Ähm, das hat man schon mal gesehen, genau.

01:37:42.960 --> 01:37:48.000
 Äh, hat auch damals irgendwie 1300 Retweets gekriegt und, äh, 2200 Likes.

01:37:48.000 --> 01:37:50.380
 Das ist, äh, ist echt eine, eine coole Geschichte.

01:37:50.380 --> 01:37:51.780
 Ja, so empfinde ich das auch oft.

01:37:51.780 --> 01:37:55.180
 Und ich weiß, dass die Struktur im Node-Modules-Ordner mal ganz anders war.

01:37:55.180 --> 01:37:58.500
 Also, die war mal sehr tief verschachtelt.

01:37:58.500 --> 01:38:01.460
 Dafür hast du wenig, du hast weniger Ordner auf höchster Ebene gehabt.

01:38:01.460 --> 01:38:02.860
 Kannst du, kannst dich da dran erinnern?

01:38:02.860 --> 01:38:03.060
 Mhm.

01:38:03.060 --> 01:38:09.420
 Ähm, du hast weniger Ordner, oder weniger, weniger Verzeichnisse auf erster Ebene gehabt.

01:38:09.420 --> 01:38:14.280
 Und dann waren, waren das extrem tief verschachtelte Node-Modules-Ordner immer wieder innen drin.

01:38:14.280 --> 01:38:18.120
 Und das war tatsächlich auch teilweise ein Problem unter Windows.

01:38:18.120 --> 01:38:19.820
 Genau, das wollte ich sagen.

01:38:19.820 --> 01:38:21.840
 Weil dann die Pfade tatsächlich zu lange geworden sind.

01:38:21.840 --> 01:38:24.680
 Und dann irgendwie manchmal einfach nichts mehr funktioniert hat.

01:38:24.680 --> 01:38:27.200
 Oder, oder sogar in der Konsole dann irgendwie Fehler geworfen hat.

01:38:27.200 --> 01:38:29.200
 Wegen Zugriffsrechten.

01:38:29.200 --> 01:38:34.540
 Also, es klang nach Zugriffsrechten, aber es war erst mal gar nicht ersichtlich, was da eigentlich gerade passiert.

01:38:34.540 --> 01:38:37.440
 Ja, und das war natürlich ein großes Problem.

01:38:37.440 --> 01:38:39.320
 Oder du konntest den auch nicht mehr löschen.

01:38:39.420 --> 01:38:40.920
 Ja, auch, auch sehr schön.

01:38:40.920 --> 01:38:46.880
 Es gab auch, also, ab einer gewissen Pfadlänge hat Windows geweigert, sich Files zu löschen.

01:38:46.880 --> 01:38:49.040
 Was total crazy ist.

01:38:49.040 --> 01:38:51.020
 Deswegen, äh, naja, Windows, naja, gut.

01:38:51.020 --> 01:38:52.820
 Windows halt, ne?

01:38:52.820 --> 01:38:56.020
 Ähm, ja.

01:38:56.420 --> 01:38:58.960
 Worauf ich, das war halt, das war halt mein kleines Beispiel.

01:38:58.960 --> 01:39:00.540
 Also, da direkt rein verlinken.

01:39:00.540 --> 01:39:03.240
 Ähm, wie gesagt, das kann gefährlich sein.

01:39:03.240 --> 01:39:15.260
 Ich hatte vor kurzem auch den Fall, dass ich, äh, bei einem Paket eine bestimmte Version haben wollte, was aber in Konflikt stand zu den, äh, Dependencies von einem anderen Modul, was ich eingebunden hatte.

01:39:15.440 --> 01:39:19.440
 Und dann hat er die komplette Struktur davon wieder geändert in das, was man kennt.

01:39:19.440 --> 01:39:21.640
 Was, was man früher kannte, wie das früher war.

01:39:21.640 --> 01:39:23.920
 Das wusste ich auch nicht, dass das passieren kann.

01:39:23.920 --> 01:39:27.880
 Ähm, deswegen sage ich, es ist gefährlich, direkt rein zu verlinken.

01:39:28.040 --> 01:39:28.800
 Aber es geht.

01:39:28.800 --> 01:39:35.840
 Man kann das machen und ich, wir haben das tatsächlich in einigen Projekten im Einsatz und bislang ist es, äh, nicht schiefgegangen.

01:39:35.840 --> 01:39:36.940
 Aber, man weiß nicht.

01:39:36.940 --> 01:39:38.940
 Ich finde, es fühlt sich so ein bisschen an wie eine Krücke.

01:39:38.940 --> 01:39:39.860
 Aber man kann das machen.

01:39:39.860 --> 01:39:40.660
 Man kann so viel machen.

01:39:40.660 --> 01:39:42.380
 Man kann so viel machen.

01:39:42.380 --> 01:39:43.380
 Mittlerweile.

01:39:43.380 --> 01:39:44.580
 Ist so verrückt, oder?

01:39:44.580 --> 01:39:45.980
 Ja, ist schon.

01:39:45.980 --> 01:39:46.880
 So viel verrückte APIs.

01:39:46.880 --> 01:39:47.660
 Schon viel passiert.

01:39:47.660 --> 01:39:49.520
 Ist so viel passiert.

01:39:49.520 --> 01:39:52.300
 Ich glaube, damit sind wir am Ende vom Pima, oder?

01:39:52.300 --> 01:39:53.860
 Ja, weißt du, was jetzt gerade passiert ist?

01:39:53.860 --> 01:39:55.100
 Wir haben die Zeit überschritten.

01:39:55.100 --> 01:39:57.920
 Es wird, stand jetzt, die längste Folge.

01:39:58.040 --> 01:39:58.960
 Die wir bisher haben.

01:39:58.960 --> 01:40:07.760
 Dafür, dass wir uns mal ein bisschen kürzer fassen wollten, haben wir jetzt tatsächlich die längste Folge von 105 Minuten geknackt.

01:40:07.760 --> 01:40:10.100
 Und wir haben vorher schon Themen draufgesprächen.

01:40:10.100 --> 01:40:11.280
 Wir haben noch was vor.

01:40:11.280 --> 01:40:13.140
 Ah, stimmt, wir haben noch was vor.

01:40:13.140 --> 01:40:14.580
 Das war es ja jetzt noch gar nicht.

01:40:14.580 --> 01:40:15.320
 Oh je.

01:40:15.320 --> 01:40:15.620
 Oh nein.

01:40:15.620 --> 01:40:16.640
 Wenn du fertig bist.

01:40:16.640 --> 01:40:17.960
 Ach so, stimmt.

01:40:17.960 --> 01:40:18.720
 Dann kommt ja jetzt.

01:40:18.720 --> 01:40:19.580
 Dann kommt jetzt.

01:40:19.580 --> 01:40:22.100
 Das Geiltein.

01:40:22.100 --> 01:40:25.360
 Geiltein.

01:40:27.460 --> 01:40:28.560
 Oh je, jetzt muss ich ja noch mehr reden.

01:40:28.560 --> 01:40:29.980
 Jetzt bitte aber in doppelter Geschwindigkeit.

01:40:29.980 --> 01:40:31.740
 Fertig.

01:40:31.740 --> 01:40:36.700
 Ja, nee.

01:40:36.700 --> 01:40:40.460
 Ja, war eine gute Idee.

01:40:40.460 --> 01:40:41.000
 Finde ich.

01:40:41.000 --> 01:40:43.040
 Dafür hast du dir was verdient.

01:40:45.380 --> 01:40:46.840
 Wir haben noch keine Zeit.

01:40:46.840 --> 01:40:48.980
 Jetzt muss noch weitergehen.

01:40:48.980 --> 01:40:50.020
 Stefan Raab, ey.

01:40:50.020 --> 01:40:51.740
 So, das Geiltein.

01:40:51.740 --> 01:40:52.940
 Komm, das machen wir jetzt irgendwie noch schnell.

01:40:52.940 --> 01:40:55.640
 Ich weiß gar nicht, wann ich drauf gestoßen bin.

01:40:55.640 --> 01:40:57.200
 Das ist noch gar nicht so lange her.

01:40:57.200 --> 01:40:58.760
 Ich habe keine Ahnung, wie lange es das schon gibt.

01:40:58.760 --> 01:41:03.480
 Es hat auf jeden Fall 2730 GitHub-Sterne Stand.

01:41:03.480 --> 01:41:04.960
 Jetzt Stand heute.

01:41:04.960 --> 01:41:08.920
 Ich sage jetzt natürlich nicht, wann heute ist, weil heute ist natürlich live am Sonntag.

01:41:10.840 --> 01:41:12.000
 Wie soll es auch anders sein?

01:41:12.000 --> 01:41:12.840
 Ich schweife schon wieder ab.

01:41:12.840 --> 01:41:19.760
 Das Geilteil heute ist eine wunderbare Seite namens oneloc.dev.

01:41:20.260 --> 01:41:25.940
 Ich habe es ursprünglich einslog ausgesprochen und dann habe ich mir darüber Gedanken gemacht, was bedeutet denn das eigentlich?

01:41:25.940 --> 01:41:33.320
 Es soll wahrscheinlich, sehr wahrscheinlich eine Abkürzung sein für onelineofcode.dev.

01:41:33.320 --> 01:41:35.540
 Und was findet man da?

01:41:35.540 --> 01:41:37.840
 Es ist relativ simpel.

01:41:37.840 --> 01:41:41.080
 Es ist einfach eine Liste mit One-Linern in JavaScript.

01:41:42.360 --> 01:41:53.400
 Also mit so kleinen Utilities, weiß ich nicht, ob man das so nennen kann, kleine Kniffe, kleine Sachen, die in eine Zeile passen, in JavaScript, die irgendwie was für einen tun.

01:41:53.400 --> 01:41:58.580
 Und auch ein schöner Filter oben, in dem man dann einfach mal eintragen kann, was man sucht.

01:41:58.580 --> 01:41:59.600
 Vielleicht findet man das dann auch.

01:41:59.600 --> 01:42:07.460
 Also ich bin ein großer Fan von One-Linern, weil man ganz oft so an dem Punkt ist, jetzt muss ich gerade irgendwie das eine kleine, wie mache ich denn das jetzt?

01:42:07.460 --> 01:42:11.800
 Nennt doch mal ein paar Beispiele aus der Liste, dass man sich vorstellen kann, was das so ist.

01:42:11.800 --> 01:42:23.400
 Ich wollte noch kurz sagen, die Liste ist aufgeteilt in verschiedene Bereiche, also sowas wie Array, Datetime, DOM, Function, MISC, Number, Object und String, glaube ich.

01:42:23.400 --> 01:42:23.740
 Genau.

01:42:23.740 --> 01:42:30.380
 Und ich sage mal ein paar ganz kurze Beispiele, die ich mir vorhin schon rausgesucht habe.

01:42:30.380 --> 01:42:33.480
 Also zum Beispiel zwei Arrays vergleichen.

01:42:33.480 --> 01:42:39.220
 Weil ich erst mal gedacht habe, okay, ich weiß zwar jetzt nicht genau, wann man das machen will, aber ich fand die Idee ganz interessant.

01:42:40.040 --> 01:42:50.580
 Da ist dann zum Beispiel die Variante, wie man da zwei Arrays vergleicht, ist, naja, man macht die erst mal als JSON-Stringify und dann, guck mal, ist da das gleiche drin.

01:42:50.580 --> 01:42:52.420
 Fand für mich eine interessante Idee.

01:42:53.920 --> 01:42:55.260
 Hast du es gerade auch offen?

01:42:55.260 --> 01:43:03.840
 Also, was ich dann mir noch rausgesucht habe, ist, herausfinden, ob ein Datum zwischen zwei Daten liegt.

01:43:03.840 --> 01:43:05.560
 Ist das da zwischendrin oder nicht?

01:43:05.560 --> 01:43:07.520
 So ein schöner kleiner Einzeiler.

01:43:07.520 --> 01:43:11.420
 Ich gehe da jetzt nicht direkt auf den Code ein, das könnt ihr euch selbst anschauen, wie die Lösungen dafür sind.

01:43:13.360 --> 01:43:18.460
 Sekunden in Hour, Hour, Minute, Minute, Minute, Second, Second Format konvertieren.

01:43:18.460 --> 01:43:22.960
 Dann im DOM-Bereich habe ich noch, naja, so ein Klassiker.

01:43:22.960 --> 01:43:25.960
 Ist das, bin ich im Internet Explorer?

01:43:25.960 --> 01:43:28.620
 Das finde ich ganz witzig.

01:43:29.480 --> 01:43:42.080
 Das ist auf jeden Fall irgendwie so ein Hack, weil da wird ein DOM-Objekt Document.DocumentMode abgefragt, das es wahrscheinlich nur im Internet Explorer gibt.

01:43:42.080 --> 01:43:43.140
 Das wusste ich vorher auch nicht.

01:43:43.140 --> 01:43:44.780
 Wahrscheinlich Quirks-Mode oder nicht.

01:43:45.220 --> 01:43:55.060
 Das kann auch sein, weiß ich tatsächlich nicht genau, aber in diesen One-Linern verbirgt sich oft, also das kenne ich auch aus dem 140-Bytes-Projekt, da gehe ich gleich noch drauf ein.

01:43:55.060 --> 01:43:58.540
 Da konnte man immer sehr viel draus lernen.

01:43:58.540 --> 01:44:07.560
 Aus einem One-Liner kann man oft sehr viel draus lernen, auch wenn er manchmal auf den ersten Blick sehr schwer zu lesen ist und ich mir nicht immer sicher bin, ob man ihn verwenden sollte, aber lernen kann man immer eine Menge draus.

01:44:07.560 --> 01:44:13.720
 Oder MacOS-Browser, da ist dann im Prinzip eine Regular Expression, die abfragt nach Mac, iPod, iPhone, iPad.

01:44:15.220 --> 01:44:21.580
 Was haben wir hier noch? Reload, CurrentPage, habe ich mir noch rausgesucht, fand ich irgendwie ganz witzig, so in einer Zeile ganz, ganz kurz.

01:44:21.580 --> 01:44:31.900
 Das sind Dinge, wo man, wie soll ich sagen, wenn man JavaScript auswendig kann und das DOM, dann ist das überhaupt kein Problem, da fliegt einem das zu, dann weiß man, dass es das gibt.

01:44:31.900 --> 01:44:40.660
 Aber ich hätte jetzt zum Beispiel nicht gewusst, ich kann die Seite neu laden mit Location.reload. Das war mir nicht klar, das wusste ich einfach nicht.

01:44:40.660 --> 01:44:42.920
 Das hatte ich jetzt, aber klar, ich weiß nicht.

01:44:42.920 --> 01:44:53.100
 Klar, man kennt immer unterschiedliche Dinge. Ich finde, wie gesagt, von so Einzeilern kann man eine Menge lernen. Also selbst wenn ihr sie nicht verwenden wollt, wenn ihr was lernen wollt, dann klickt die einfach mal alle durch und guckt euch an, wie es gemacht ist.

01:44:53.100 --> 01:44:59.000
 Gut, wenn wir scrollen, ist jetzt tatsächlich keine Magie, AGB in Hex konvertieren.

01:45:00.240 --> 01:45:04.940
 Das arbeitet tatsächlich mit dem Bitwise-Verschiebungsoperator, das muss ich mir mal genauer angucken, wie das funktioniert.

01:45:04.940 --> 01:45:07.120
 Das ist auch noch so ein bisschen Magie für mich, ja.

01:45:07.120 --> 01:45:08.320
 Ja, genau.

01:45:08.320 --> 01:45:15.820
 Ich glaube, ich weiß grob, wie das funktioniert, aber da verbiegt sich mein Gehirn auch noch.

01:45:15.820 --> 01:45:24.540
 Also wenn ihr, wenn ihr es mal sehen wollt, wie bitweise Verschiebung gemacht wird in JavaScript, dann scrollt da mal runter zu Convert RGB to Color to Hex.

01:45:25.140 --> 01:45:32.000
 Da habt ihr das auf jeden Fall drin. Das ist so dieses doppelgroßer, größer oder doppel kleiner, kleiner Zeichen. Das ist der Operator dafür.

01:45:33.040 --> 01:45:36.400
 Ich glaube, ja, ich glaube, das waren die Beispiele, die ich mir rausgesucht habe.

01:45:36.400 --> 01:45:42.920
 Ah, in dem Moment, ich habe hier noch was bei Strings, zum Beispiel Escape HTML Special Characters.

01:45:42.920 --> 01:45:48.780
 Ich sage jetzt schon mal, mach das nicht. Es ist interessant, wie die das machen, aber ich glaube, dafür gibt es bessere Methoden.

01:45:48.780 --> 01:45:54.980
 Und File nehmen von der URL bekommen, das weiß auch noch was, was ich mir irgendwie angeguckt habe.

01:45:54.980 --> 01:46:04.380
 Also es ist eine sehr, sehr, es ist eine recht lange Liste. Hier steht 183 Favorite JavaScript Utilities in Single Line of Code.

01:46:04.380 --> 01:46:13.740
 Ich finde das, ich finde es immer cool, so kurze Utilities zu haben, die man irgendwo mal einfach reinschmeißen kann, so wie sie sind, um ein kleines Problem zu lösen.

01:46:13.840 --> 01:46:20.520
 Das war das Geilteil. Jetzt wollte ich aber, Moment, ich wollte noch kurz auf 140 Bytes eingehen, weil das habe ich im Zusammenhang damit noch kurz recherchiert.

01:46:20.520 --> 01:46:25.680
 Das war mal ein Projekt, leider war mal. Ich habe es nicht mehr gefunden.

01:46:25.680 --> 01:46:31.160
 Ich war auch gerade erstaunt, weil ich kannte das auch noch und jetzt begrüßt mich da eine Agenturseite aus Spanien.

01:46:31.160 --> 01:46:41.300
 Die Seite hieß mal 140 Byte oder Bit mit Y.es.

01:46:41.900 --> 01:46:49.780
 Und da waren lauter kleine JavaScript-magische Beispiele, die in 140 Bytes, also 140 Zeichen gepasst haben, also quasi in den Tweet.

01:46:49.780 --> 01:46:59.160
 Und das war noch viel krasser, als was auf der onelog.dev-Seite zu finden ist.

01:46:59.160 --> 01:47:03.440
 Da wurden teilweise komplette Parsings irgendwie mit 140 Bytes gemacht.

01:47:03.440 --> 01:47:08.940
 Was ich jetzt noch bei GitHub gefunden habe, war eine Art Pac-Man, was in 140 Bytes umgesetzt wurde.

01:47:08.940 --> 01:47:15.340
 Da kann man dann allerdings wirklich so gut wie gar nichts mehr direkt lesen, außer man ist ein krasser Typ.

01:47:15.340 --> 01:47:19.340
 Ich kenne so einen krassen Typen, der auch sowas geschrieben hat, der da mitgemacht hat.

01:47:19.340 --> 01:47:24.660
 Vielleicht kann der, wenn er sich jetzt erkannt hat und den Podcast auch hört, das weiß ich tatsächlich nicht.

01:47:24.660 --> 01:47:25.420
 Ehemaliger Kollege?

01:47:25.420 --> 01:47:27.640
 Ehemaliger Kollege, ja.

01:47:28.040 --> 01:47:34.640
 Vielleicht kann der mir mal sagen, ob es irgendwo noch ein Backup von der 140 Bytes-Seite gibt, weil das war schon echt crazy shit.

01:47:35.700 --> 01:47:41.900
 Wenn man 140 Bytes bei Google eingibt, dann findet man noch so ein paar Beispiele davon, aber leider nicht mehr die ganze Liste.

01:47:41.900 --> 01:47:47.180
 Also ich habe es jetzt auf den ersten Blick nicht gefunden, aber das war auch ein sehr, sehr krasses, cooles Projekt.

01:47:48.020 --> 01:48:01.660
 Nicht, weil ich sage, man sollte so JavaScript schreiben, aber warum nicht mal damit kreativ werden und so Machbarkeitsstudie machen, so im Sinne von, was kann ich denn in 100, wie kann ich denn crazy Sachen mit 140 Zeichen lösen, wo keiner gedacht hätte, dass das geht.

01:48:02.380 --> 01:48:08.620
 Und da habe ich auch diesen Bitwise-Operator zum ersten Mal gesehen, der da eingesetzt wurde.

01:48:08.620 --> 01:48:16.860
 Ja, also ich sage nicht, verwendet das bei euch in der Agentur oder für eure Projekte, aber man kann eine Menge davon lernen.

01:48:16.860 --> 01:48:21.820
 Also auf jeden Fall nochmal Shoutout 140 Bytes, falls es das irgendwo noch gibt, bitte, bitte melden.

01:48:21.820 --> 01:48:22.980
 Bitte, bitte melde dich.

01:48:22.980 --> 01:48:23.340
 Genau.

01:48:23.340 --> 01:48:29.600
 Ja, damit sind wir fertig mit dem Geil-Teil und wir haben immer noch keinen Jingle für Geil-Teil fertig.

01:48:30.120 --> 01:48:39.000
 Von daher würde ich einfach mal sagen, es nimmt über Hand, du hättest mir nicht sagen sollen, mach doch auch mal.

01:48:39.000 --> 01:48:40.380
 Ich hätte dir dieses Tool nicht in die Hand geben sollen.

01:48:40.380 --> 01:48:42.400
 Nein, auf keinen Fall.

01:48:42.400 --> 01:48:44.340
 Das artet ein bisschen aus.

01:48:44.340 --> 01:48:51.120
 Das war auch Feedback, was wir bekommen haben übrigens, dass unsere Jingles, unser Sounddesign ein bisschen over the top ist.

01:48:51.120 --> 01:48:53.900
 Fast schon, fast schon over the top.

01:48:53.900 --> 01:48:55.160
 Da ist noch viel Raum.

01:48:56.380 --> 01:49:00.820
 Ich würde sagen, in der nächsten Folge, gucken wir mal, da ist noch Luft nach oben.

01:49:00.820 --> 01:49:04.020
 Da geht noch ein bisschen.

01:49:04.020 --> 01:49:07.520
 Irgendwann kommt die Folge, die nur aus Jingles besteht.

01:49:07.520 --> 01:49:13.140
 Ja, und wenn wir mit den Zeiten so weitermachen, dann würde ich sagen, hören wir einfach irgendwann gar nicht mehr auf zu senden.

01:49:13.140 --> 01:49:19.020
 Wir machen dann eine 24-7-Unterhaltungssendung.

01:49:19.120 --> 01:49:21.820
 Aber nee, wir machen die aber trotzdem zwei Wochen verzögert.

01:49:21.820 --> 01:49:26.860
 Das heißt, erst wenn wir zwei Wochen senden, kann man live quasi verzögert zuhören.

01:49:26.860 --> 01:49:28.640
 Das fände ich extrem witzig.

01:49:28.640 --> 01:49:31.340
 Und gehen aber dann immer schön auf tagesaktuelles Geschehen ein.

01:49:32.200 --> 01:49:34.000
 Ja, tagesaktuell, aber zwei Wochen verzögert.

01:49:34.000 --> 01:49:34.720
 Das fände ich super.

01:49:34.720 --> 01:49:39.240
 Wie bringe ich meine Hörerzahl gegen null?

01:49:39.240 --> 01:49:41.960
 Ach was?

01:49:41.960 --> 01:49:46.520
 Ich meine, das ist dann, glaube ich, wie bei, wie hieß dieser Film nochmal, Truman Show.

01:49:46.520 --> 01:49:49.240
 Dafür interessieren sich die Leute dann schon.

01:49:49.240 --> 01:49:50.980
 Es muss auch nicht unbedingt immer live sein.

01:49:50.980 --> 01:49:52.360
 Vielleicht ist der Reiz genau das.

01:49:52.360 --> 01:49:56.040
 Das ist eben so eine Time Capsule zwei Wochen in die Vergangenheit.

01:49:56.040 --> 01:49:57.120
 Ja, genau.

01:49:57.120 --> 01:49:58.860
 Ist doch super.

01:49:58.860 --> 01:49:59.660
 Faszinierend.

01:50:00.040 --> 01:50:01.680
 Was war neu vor zwei Wochen?

01:50:01.680 --> 01:50:04.060
 Also heutzutage ist das noch okay.

01:50:04.060 --> 01:50:09.000
 Aber wahrscheinlich sagt man, wird es irgendwann in den nächsten zehn Jahren das Sprichwort geben,

01:50:09.000 --> 01:50:10.380
 ja, das ist ja sowas von gestern.

01:50:10.380 --> 01:50:12.660
 Früher hat man gesagt, das ist sowas von 90er.

01:50:12.660 --> 01:50:15.660
 Und irgendwann hieß es mal, das ist sowas von vor fünf Jahren.

01:50:15.660 --> 01:50:18.660
 Und dann hieß es irgendwann, das ist sowas von 2019.

01:50:18.660 --> 01:50:20.400
 Sagt man nicht, ich bin doch nicht von gestern.

01:50:20.400 --> 01:50:21.900
 Oh.

01:50:21.900 --> 01:50:23.960
 Scheiße.

01:50:23.960 --> 01:50:27.000
 Ein magischer Moment, live aufgelöst wieder.

01:50:27.000 --> 01:50:28.700
 Ich bin doch nicht von vor 14 Tagen.

01:50:29.940 --> 01:50:31.780
 Ja, okay, ich glaube, ihr merkt schon.

01:50:31.780 --> 01:50:33.780
 Komm, jetzt machen wir die zwei Stunden noch voll.

01:50:33.780 --> 01:50:38.040
 Komm, erzähl noch einen schlechten Witz.

01:50:38.040 --> 01:50:39.080
 Schwank aus deiner Jugend.

01:50:39.080 --> 01:50:43.200
 Schwank aus meiner Schwäche und schwank aus deiner Jugend.

01:50:43.200 --> 01:50:44.400
 Dann werden wir noch Abkündigungen.

01:50:44.400 --> 01:50:46.440
 Machen wir die Abkündigung, dann haben wir die zwei Stunden voll.

01:50:46.440 --> 01:50:48.060
 Wir haben noch Abkündigungen.

01:50:48.060 --> 01:50:52.120
 Vor allem an die neuen Hörer, falls jetzt noch jemand tatsächlich hängen geblieben ist.

01:50:52.840 --> 01:50:56.200
 Liked uns auf unseren Social-Media-Kanälen.

01:50:56.200 --> 01:50:58.040
 Twitter, at www.siv.

01:50:58.040 --> 01:51:01.640
 Instagram, wo wir sind, ist vorne.

01:51:01.980 --> 01:51:05.400
 Ja, aber zu Instagram, wir wollen ja die zwei Stunden noch voll machen, ne?

01:51:05.400 --> 01:51:12.300
 Zu Instagram muss ich nur sagen, da setze ich jetzt den Instagramern mal die Pistole auf die Brust.

01:51:12.380 --> 01:51:15.320
 Ich weiß, wir haben das Medium auch nicht so bespielt, wie es wahrscheinlich sein sollte.

01:51:15.320 --> 01:51:20.520
 Weil wir posten da im Prinzip nur die Folgenbilder und sonst nichts.

01:51:20.520 --> 01:51:21.840
 Wir machen da keine Storys oder so.

01:51:21.840 --> 01:51:26.580
 Wenn da nicht demnächst sich ein bisschen mehr tut, dann glaube ich, dann klemmen wir das Instagram wieder ab.

01:51:26.580 --> 01:51:29.680
 Dann kommt auf die Webseite da an der Stelle irgendwie ein Pimmel-Icon oder sowas.

01:51:30.460 --> 01:51:32.500
 Weil es müssen ja drei sein, sonst sieht's komisch aus.

01:51:32.500 --> 01:51:36.460
 Ne, ich bin echt am überlegen, Instagram, ich glaube, es ist nicht unser Kanal.

01:51:36.460 --> 01:51:38.520
 Wir haben aber auch nicht viel dafür gemacht, muss ich sagen.

01:51:38.520 --> 01:51:41.020
 Wir sind aber auch nicht die typischen Instagramer, glaube ich.

01:51:41.020 --> 01:51:44.880
 Wollte ich, ich weiß nicht, was du dazu, wie du das findest.

01:51:44.880 --> 01:51:51.660
 Ne, also ich bin sowieso Social-Media, außer Twitter, habe ich echt so zurückgefahren, bin ich gar nicht mehr drin.

01:51:52.100 --> 01:52:03.820
 Also außer TikTok hatte ich mal letztens so eine Phase, aber die war dann schon, habe ich schon gemerkt, diese Rabbit Hole, wo ich dann abends dann doch wieder irgendwie eine Stunde da verbracht habe und Zeit vergeudet habe, habe ich jetzt auch schon länger nicht mehr draufgeschrieben.

01:52:03.820 --> 01:52:05.820
 Ja, wo wir sind bis vorne? Demnächst auf TikTok.

01:52:05.820 --> 01:52:08.940
 Oh je.

01:52:08.940 --> 01:52:12.620
 Ja, ihr merkt, die Qualität nimmt ab.

01:52:12.620 --> 01:52:17.840
 Findest du? Ich finde, es geht gerade erst richtig los.

01:52:19.280 --> 01:52:31.920
 So, wir haben dann auch die zwei Stunden demnächst voll und darum würde ich sagen, ja, liked uns, subscribt uns, empfehlt uns weiter, offline und online und gehabt euch wohl.

01:52:31.920 --> 01:52:33.900
 Wir bitten darum, ja.

01:52:33.900 --> 01:52:35.620
 Hast du noch ein Wort zum Sonntag?

01:52:35.620 --> 01:52:37.260
 Danke.

01:52:37.260 --> 01:52:38.260
 Danke.

01:52:49.280 --> 01:52:50.280
 Danke.