Wo wir sind, ist vorne, Folge 11. Heute gibt's Teil 2 der unerfüllten CSS-Träume.
Herzlich willkommen bei Wo wir sind, ist vorne. Frontend-Fakten-Frotzelein.
Der Late-Night-Frontend-Talkshow rund um Webdesign und Entwicklung.
Es reden sich um Head und Kragen, HTML-Fundamentalist Moritz Gießmann und JavaScript-Jongleur Konstantin Groß.
Ja, heute eine Woche später, als das der normale Rahmen üblicherweise hergibt.
Aber jetzt sind wir quasi wieder im Takt, wie wir angefangen haben.
Weil wir hatten schon mal eine Verzögerung zwischendrin und jetzt passt's wieder.
Vielleicht müssen wir irgendwann mal zwei Folgen in einer Woche machen, um dann tatsächlich wieder, also zweimal zwei Folgen in einer Woche, dann sind wir wirklich wieder im Echten.
Ja gut, aber ich glaub, nee.
Ich glaub auch.
Genau, Folge Nummer 11. Warum wir später dran sind, da sprechen wir gleich noch drüber in der Retro. Das haben wir ein gemeinsames Retro-Thema gleich.
Aber Folge 11, ich hab noch gar nichts getrunken und die Zunge wird schon schwer. Folge Nummer 11, eine Schnapszahl.
Und deswegen haben wir heute beide keinen Schnaps.
Wir haben, glaub ich, beide Likör, oder?
Ja, wir haben beide Likör.
Wir haben vorher drüber nachgedacht, ob es überhaupt irgendeine Flasche in Deutschland gibt, wo wirklich Schnaps draufsteht.
Also falls du, liebe Hörerin, ein Getränk kennst, auf dem wirklich Schnaps draufsteht, auf der Flasche so richtig draufgedruckt, dann bitte mal irgendwie in die Kommentare oder bei Twitter mal anschreiben.
Weil mir fällt nichts ein. Es gibt nur so irgendwie diese Brandwein und Likör und keine Ahnung was. Aber irgendwie Schnaps steht nie drauf, oder?
Ja, kenn ich eigentlich jetzt auch nur aus dem Ausland auf Flaschen, da hab ich das schon gesehen, aber hier in Deutschland.
Wobei, ich sagen muss, ich bin auch nicht so der Schnapstrinker. Also ich trinke tatsächlich doch lieber ein Likör als kurzen.
Deswegen hab ich auch nur Likör im Haus, ich hab gar keinen Schnaps.
Also das nächste an Schnaps, an Spirituose, was ich gehabt hätte, wäre noch Cachaca pur gewesen, aber...
Oh ja, ja.
Was bringst du denn?
Es soll ja auch schmecken.
Es ist ein spanischer Pfirsichlikör, den ich mitgebracht hab aus dem Urlaub.
Und ja, der ist halt süß, pappig, wie so ein Likör halt ist.
Also Konstantin vertritt heute so ein bisschen auch die, wie soll ich sagen, so die elitäre Seite.
Ich geh genau in die andere Richtung.
Ich hab nämlich noch gefunden, so von Feierei sehr, sehr lange her, so einen kurzen, so einen Klopfer, glaube ich, nennt man die auch.
Steht jetzt da zwar nicht drauf, aber so eine kleine Flasche, 2CL, Teufelszeug heißt das.
Und ich lese mal kurz vor, also 18 Prozent.
Kirschlikör mit Wodka, da könnte das zu Ende sein, aber es geht noch weiter.
Und Schoko-Chili-Note.
Wow.
Und es ist wirklich, also das Etikett sieht schon sehr nach Mallorca aus, obwohl ich da noch nie war.
Aber ich glaube, da sieht es so aus auf Mallorca.
So wie dieses Etikett.
Also.
Gut, dann schon mal hier mit dem Schnäpschen.
Ich klopfe jetzt nicht, aber ich versuche mal.
Moment.
Vielleicht hört man das.
Ach so, ja.
Genau, ja.
Aber anstoßen kann ich, weil ich habe hier noch die Obligatorische, die gleich noch kommt.
Okay.
Hört man das?
Ja.
Das weiß aber mehr als Bierflasche.
Ja.
Okay, gut.
Zum Wohl.
Und da der ...
Oh ja.
Ja, und es ist gut.
Es schmeckt genauso elitär, wie es aussieht.
Ja gut, mit Wodka, allein schon Wodka-Fan bin ich jetzt auch nicht so.
Ja, kann ich mir schon lebhaft vorstellen.
Schmeckt nicht mehr viel nach Wodka, ja.
Wie gesagt, spanischer Likör ist das.
Und das bringt mich dazu, dass ich entdeckt habe in unseren Statistiken, dass wir tatsächlich Hörer aus Spanien aufgeführt haben.
Kann natürlich sehr gut sein, dass das irgendwelche Bots sind.
Und ich weiß auch nicht, ob das jetzt auch Urlauber oder tatsächlich Leute, die dort leben.
Und wer mir eine große Freude machen will, wir haben ja letztes Mal schon gesagt,
dass wir unsere DHL-Packstation-Adressen im Impressum jetzt stehen haben.
Wer uns irgendwas zukommen lassen will.
Und wer mir eine große Freude machen will und in Spanien wohnt oder arbeitet oder im Urlaub gerade da ist,
wo da vielleicht demnächst hingeht,
Es gibt in der Supermarktkette Mercadona, gibt es Oliven im Glas namens Aceitunas Cordal Alineadas.
Und wer mir eine sehr große Freude machen will, der schickt mir ein, zwei Gläser davon gerne zu, an die Adresse, die im Impressum steht.
Also nicht an die Adresse, sondern an die Packstation-Adresse, bitte.
Und wer in England ist, der kann dem Konstantin auch Pret-à-Manger-Sandwiches schicken.
Ja, aber ich weiß nicht, ob die halten sich, glaube ich, nicht länger als einen Tag.
Dann lieber für die Pigtails, die du mir mitgebracht hast.
Das auch, aber da verweise ich gerne nochmal auf die Folge Nummer 10,
wo wir gesagt haben, dass ihr uns auch gerne an die Packstation Pizza schicken dürft,
wenn ihr sicherstellt, dass sie an unserem Aufnahme Donnerstag oder Freitag dann auch fertig ist
und nicht irgendwie dann schon Schimmel irgendwie angesetzt hat.
Und da appelliere ich an die findigen Ingenieure in euch, die sich dann überlegen können,
wie könnte man denn ein Pret-à-Manger-Sandwich so abschicken, dass es eben noch gut bei uns ankommt.
Also ich habe tatsächlich schon Kühlgut bestellt in Online-Shops
und das dann mit so einem gefrorenen Code-Pack geschickt bekommen.
Das war dann quasi da dran getaped und war tatsächlich sogar noch fest, als es ankam.
Wenn man das also entsprechend kalkuliert und express, nicht flüssig zumindest,
wenn man das entsprechend plant, dann kann das sogar hinhauen.
Aber es darf natürlich dann keine Lieferschwierigkeiten geben.
Okay.
Gut, genau. Schnaps hatten wir.
Bier, was hast du, was trinkst du heute?
Ah ja, genau.
Diese Folge ist wieder gesponsert von Darmstädter Bier.
Nicht.
Diesmal habe ich, also es steht da diesmal nicht Darmstädter drauf,
sondern Pfungstädter heißt das.
Pfungstädter Edelpilz Premium.
Ist wieder eine 0,5er-Flasche, das heißt, das Ende der Folge wird wahrscheinlich wieder sehr merkwürdig.
Ja, es wird heute auch lang.
Also ich glaube, wir können uns jetzt schon mal darauf einstellen.
Wir sind noch nicht mal bei der Retro.
Es wird heute lang, weil wir einfach eine Woche mehr hatten, um Ideen zu sammeln und zu erzählen.
Ich habe schon wieder welche rausgenommen, weil ich dachte, es ist schon wieder so alt.
Ja, wir haben vorhin noch mal spontan am Hauptthema rumgeschnibbelt.
Mal gucken.
Dann machen wir jetzt gleich noch das Bier hinterher, Mensch.
Wir werden echt Alkoholikern.
Ich habe den Schlaf noch nicht mal leer, aber gut, bevor wir noch mehr Zeit verlieren an die Bierfrage.
Ich habe einen Flensburger Pilsener.
Gut, dann wie schon in den Folgen zuvor, jetzt könnt ihr Pause drücken, euch euer eigenes Bier holen.
Oder ihr müsst auch kein Bier trinken, ihr dürft alles Mögliche trinken.
Ihr dürft euch jetzt an die Kaffeemaschine gehen oder an den Kühlschrank und eine Clubmate rausholen oder was auch immer ihr jetzt trinken möchtet.
Also jetzt Pause und dann gleich weiter.
Und zwar jetzt.
Ja, da sind wir wieder.
Wir kommen zurück.
Ja, dann lass uns doch mal aufmachen.
Ja, super, hat der überhaupt nicht gepfloppt.
Das war sehr enttäuschend.
Ich habe gerade gesehen, der Konstantin hat so eine schöne Bügelflasche und das hat leider nicht den Effekt, den ich letzte Woche hatte.
Ich hätte vielleicht vorher schütteln müssen.
Also nochmal hier Fake anstoßen.
Ja, genau, anstoßen, Moment.
Ach, ist doch egal.
Und nochmal danke an den Stefan, das ist jetzt das zweite Bier aus seiner Heimat, aus Darmstadt.
Und eins habe ich noch für die nächste Folge.
Dann müsst ihr uns Neues schicken, sonst können wir nicht weitermachen.
Aufforderung an die WWSV-Fanboys und in diesem Atemzug.
Und diverse.
Und wir wollen niemanden ausschließen.
Nein, wir sind ja sehr inklusiv, auch durch alle Entwicklungsstufen der Entwickler hinweg.
Oh mein Gott, jetzt wird es schon wieder Meta.
Inklusive Inklusivität.
Also wir haben weiterhin wachsende Zahlen, das freut uns sehr.
Das heißt aber natürlich nicht, dass ihr nicht weiterhin weiterempfehlen dürft und sollt.
Also das gleich schon mal am Anfang.
Tut das bitte weiterhin.
Und ich würde sagen, jetzt kommen wir endlich mal zur Retro.
Ja, das Thema, das uns beide beschäftigt hat und weshalb die Folge, die letzte, also die jetzige Folge sich um eine Woche verschoben hat, war das liebe Internet.
Also das uns im Stich gelassen hat.
Und so ein bisschen meine Reaktion, damit umzugehen, war ein Tweet, wo ich mich bei den entsprechenden Internet-Service-Providern im Namen des Podcasts bedankt habe.
Kann man doch eigentlich, glaube ich, auch sagen, oder?
Also der Tweet ist ja öffentlich einsichtbar.
Kann man sagen.
Wir haben ja zwei verschiedene, das heißt hier auch nicht Werbung.
Bei mir war es die Telekom und irgendwie, wir haben schon gesagt, na gut, solange das bei mir nicht stabil läuft, verschieben wir es lieber.
Und prompt am Freitag ist bei Moritz auch das Internet bei Vodafone ausgefallen.
Ja, und dementsprechend war es gut, dass wir den Freitag gar nicht erst eingeplant haben.
Passenderweise habe ich genau an dem Tag einen neuen Router bekommen, also jetzt eine Fritzbox.
Dafür darf ich mal Werbung machen, weil ich finde, das Teil ist echt gut.
Ja, ich habe auch eine und bin auch sehr zufrieden.
Ja, und dann konnte ich natürlich nicht herausfinden, ob das jetzt, ob jetzt der eigentliche Ausfall das Problem war oder die Fritz oder der Router selbst.
Also ich meine, es war ein richtiger Ausfall, aber jetzt kann ich gar nicht sagen, ob meine vorherigen Internet-Probleme jetzt dadurch behoben sind, dass da jetzt am Kabel draußen irgendwo was repariert wurde oder dass ich jetzt einen besseren Router habe.
Auf jeden Fall bin ich da echt zufrieden mit.
Das Problem ist nur mit dieser Fritzbox-Cable.
Sie ist ungefähr so groß wie ein DIN-A4-Blatt.
Also relativ mächtig und auch nochmal so fünf Zentimeter breit.
Also das ist, und dadurch, dass sie nicht besonders schön ist, ist es quasi ein extra Möbelstück, das man jetzt erstmal unterbringen muss.
Vor allem musst du gucken, wo du es unterbringen darfst.
Da sind ja auch irgendwie, steht ja dabei, wo du es überall nicht hinstellen darfst und nicht abdecken.
Und bitte nicht hier hin und bitte nicht an Kabel und bitte, ja, am besten gar nicht benutzen.
Am besten gar nicht benutzen, genau. Das ist die Anleitung, so kurz zusammengefasst.
Genau, also unser Internet war kaputt. Und wie hat es sich geäußert? In einem Tweet.
Und dann habe ich so gedacht, Mensch, ich ärgere mich so sehr.
Es muss jetzt noch irgendwo anders hin, meine negative Energie.
Und dann habe ich auf unserer Webseite was eingebaut, wo ich eigentlich so, ich habe ein bisschen Code-Archäologie betrieben
und habe überlegt, wie teilen wir jetzt denn unseren Hörerinnen mit, dass das bei uns gerade nicht läuft, dass es diese Folge nicht gibt.
Jetzt die Leute, die uns nicht auf Twitter folgen.
Und dann dachte ich mir, naja, was zieht mehr Aufmerksamkeit auf sich als ein Marquee-Element?
Und da dürft ihr jetzt gerne mal kurz recherchieren, falls ihr das nicht kennt und nicht wisst, was das ist.
Marquee-Element, das macht einen Lauftext, das ist, ich weiß gar nicht, in welchem HTML-Standard das spezifiziert wurde.
Auf jeden Fall ist das so komplett ohne JavaScript.
Macht das eine schöne Schrift, die irgendwie von rechts nach links läuft.
Man kann sie auch, glaube ich, mit diversen Attributen in die andere Richtung laufen lassen.
Da gibt es so ein bisschen Zauberei.
Und da habe ich das mal eingebaut, so ein bisschen nervig oben.
Dann lief das so hin und her und dann dachte ich so, jetzt, genau.
Also jetzt kommt keiner mehr dran vorbei zu sehen, warum die Folge verschoben wird und dass sie verschoben wird.
Ja, war schön, das mal wieder zu sehen.
Sehr lange her, dass man das gesehen hat.
In Firefox ist mir aufgefallen, dass es sehr geruckelt hat.
Ich weiß nicht, warum.
Im Chrome lief es flüssig.
Ja, das war bei mir auch so.
Interessant ist, dass das schon längst deprecated ist und überall steht, dass man es nicht mehr benutzen soll.
Es funktioniert aber noch in jedem Browser.
Funktioniert denn Blink noch? Weißt du das zufällig gerade?
Du meinst Chrome oder was?
Nee, nicht die Render Engine, das Blink-Tag.
Das Blink-Tag, das weiß ich nicht.
Aber warte mal, ich habe hier gerade ein CodePen-Demo offen.
Ich kann es kurz ganz schnell live testen.
Also zumindest in Firefox.
Moment, Blink.
Während du das suchst, wollte ich noch sagen zu dem Tweet, das fand ich sehr erstaunlich.
Ich hatte wegen meines Problems schon ein paar Tage vorher den Social Media Support auf Twitter angeschrieben.
Von Telekom hilft, also at Telekom unterstrich hilft.
Die Jungs und Mädels und diverse von dieser Hotline, also von diesem Callcenter, in dem die wahrscheinlich auch sitzen, reagieren da auch recht schnell.
Also es ist einfacher, da jemanden zu erreichen, als über die Hotline, glaube ich.
Oder zumindest hat man halt nicht diese Warterei.
Und die sorgen dann aber auch dafür, dass dann ganz schnell einen jemand zurückruft.
Also muss ich sagen, ist echt eine gute Sache.
Bieten viele, viele Unternehmen an, dass man da per Social Media was machen kann.
War ich an sich recht zufrieden.
Aber trotzdem wartet man auch da natürlich teilweise mal, gerade jetzt zur Zeit, wo es anscheinend öfter mal irgendwie Probleme gibt, dann schon auch mal gerne zwei Stunden oder drei auf eine Antwort.
Und erstaunlich fand ich, dass Moritz diesen Beitrag über unseren WWSV-Account postet und die Telekom nach sechs Minuten und Vodafone nach zwölf Minuten darauf geantwortet hat.
Und gleich hier so, ah, Feuer löschen und was ist denn das Problem und so.
Und das fand ich echt beachtlich.
Ich meine, wir haben ja jetzt nicht tausende Follower, wir haben ja ein paar hundert, aber das macht schon den entscheidenden Unterschied.
Ob du jetzt irgendwie so als privater Hans Wurst da was twitterst oder als doch von der Wahrnehmung her größerer Account, vielleicht liegt es auch daran, dass wir Telekom und Vodafone getaggt haben.
Vielleicht haben die da spezielle Filter, dass das in der Queue dann hochrutscht, weil die sehen so, oh, hoppla, da geht es hier Wettrennen mit der Konkurrenz und irgendwie beweisen, dass Telekom viel toller ist als Vodafone oder umgekehrt.
Vielleicht lag es auch daran, ich weiß es nicht, aber es hat mich echt erstaunt, dass das so schnell ging.
Also zum Vodafone-Support bei Twitter kann ich, also ganz kurz noch, Nachtrag, Blink, man kann es natürlich noch verwenden, das Tag, aber es blinkt zumindest in Firefox nicht.
Nur so als kurze Nebenwirkung.
Also es macht einfach nichts, also so als ob ich jetzt irgendwie ein Moritz-Tag schreibe.
Also du schreibst Konstantin Tag, genau.
Okay.
So, ja, also Vodafone, ja, man kann die toll über Twitter erreichen, nur die Antworten auch, naja, manchmal dauert es dann schon irgendwie ein, zwei Tage, also wenn man ihnen so einen normalen Tweet schickt.
Und die Antwort ist eigentlich immer, und auch auf diesen Tweet, ja, schick uns mal eine private Nachricht.
Dann wird nämlich dein Anliegen quasi, also dann kann es keiner mehr öffentlich lesen, was du da machst.
Und da lassen sie dich dann aber drei Tage warten, bis sie eine Antwort bringen und die ist dann meistens, ich fasse kurz zusammen, du bist selbst schuld.
Oder, keine Ahnung, hier, guck mal, Anleitung hier, bla bla bla, geh mal aus dem WLAN raus, wenn dein Internet so langsam ist.
Und dabei sind meine Speed-Tests, die ich gemacht habe, immer aus dem LAN, immer unter den Bedingungen, die die wollen, also so Laborbedingungen sozusagen, kein anderes Gerät angeschlossen, alle anderen WLAN-Geräte aus, nur eins mit LAN-Kabel angeschlossen.
Und das Erste, was die mir sagen, ist, mach das mal nicht aus dem WLAN.
Da sage ich dann, naja, gut.
Gut, das ist so dieses typische Hotline-Dings, auch bei Telefon-Hotlines, dass sie natürlich erstmal ihren Baum abhaken, so diese vorgegebene Struktur, was sie dich fragen müssen und so, da können ja auch die Mitarbeiter dort gar nichts dafür, dass das so läuft.
Das ist ja auch okay, wenn die das einmal machen.
Aber es ist nicht sehr befriedigend als User.
Moment, jetzt, ah, komm, don't get me started.
Oh, jetzt geht's los.
Also wir machen, wir lassen das Thema heute ausfallen, wir reden heute jetzt.
Ja, wir lassen das Thema ausfallen, jetzt muss kurz was raus.
Okay, schieß los.
Jetzt muss kurz was raus.
So, und da wird wahrscheinlich unsere Software jetzt ein bisschen an ihre Grenzen stoßen, wenn ich ein bisschen lauter werde.
Da muss jetzt kurz raus, die lesen natürlich auch nicht, was ihre Vorredner da geschrieben haben.
Das heißt, du hast da auf diesen Vodafone-Twitter-DM-Dings, hast du es mit 20, 30, weiß ich nicht wie viel, verschiedenen Leuten zu tun, die auch immer mit ihren Kützeln antworten.
Und jeder, jede Nachricht wird von einem anderen beantwortet.
Das findet also keine Konversation statt.
Du kannst nicht auf die Nachricht von vorher nochmal eingehen.
Und die lesen nie, die lesen nie verfickt nochmal.
Das ist interessant.
Die lesen nie das, was vorher schon geschrieben wurde.
Das heißt, jeder empfiehlt mir nochmal, geh doch mal aus dem WLAN raus.
Also, da muss ich sagen ...
Und ich hab mich schon überlegt, ob ich so eine richtig lange Nachricht zusammenschreiben soll, die ich immer an den Anfang pack, wo drinsteht, nein, ich bin nicht im WLAN.
Okay, Moritz, Moritz hier im Rage-Modus.
Ja, verdammt, das muss jetzt auch mal sein.
Ich muss sagen, da waren die Erfahrungen mit dem Telekom-Support tatsächlich anders.
Also, natürlich antwortet da auch jeder mit seinem Kützel und es sind immer andere oder oft andere, weil die natürlich auch ihre Schichten fahren und da nicht immer jeder da ist.
Aber die haben erstens teilweise noch abends irgendwie um halb zehn geantwortet und auch am Wochenende geantwortet.
Also, das fand ich schon mal positiv.
Und auch wenn es nicht der gleiche war, ich hatte nie die Situation, dass ich mich nochmal komplett neu erklären musste.
Sondern im Gegenteil wurde ich dann teilweise auch, obwohl ich nichts mehr geschrieben hatte, nochmal angeschrieben, irgendwie am Abend dann oder nochmal am nächsten Tag.
Also, man merkt, ich hatte längere Zeit Probleme.
Und dann wurde nochmal nachgefragt, ja, wie schaut es denn inzwischen aus und konnte denn der Kollege das lösen und so.
Also, das war richtig gut.
Also, da muss ich sagen, da muss man der Telekom lassen.
Also, das machen sie schon ganz gut.
Ändert nichts daran, dass es natürlich bei mir dann auch wieder so war, dass dem Kunden natürlich erstmal, ja, der Kunde hat keine Ahnung, dem Kunden wird erstmal nichts geglaubt und natürlich wird der Fehler erstmal beim Kunden gesucht.
Also, bei mir hatte das irgendwie schon am Donnerstag vor der geplanten Aufnahme, also die Woche vorher angefangen.
Und ich habe halt immer festgestellt, das ist zu exakt gleichen Zeiten der Ausfall.
Und halt wirklich überhaupt kein Sync mehr mit dem DSLRM.
Also, da war einfach die Leitung tot.
Das hat mir auch der Mensch an der Hotline dann auch bestätigt.
Ja, er sieht, die Leitung ist tot.
Und da war für mich auch schon klar, das liegt nicht an mir.
Also, ich habe nichts hier im Haus, was ich habe dann auch angefangen hier irgendwie, ich habe noch tatsächlich zwei DLAN Adapter im Einsatz, weil ich die in der aktuellen Verkabelung hier einfach nicht los werde.
Habe die dann mal abgeklemmt, ich habe tatsächlich alle Access Points, alle Rechner sogar, ich habe alles runtergefahren, weil ich gehört habe, dass sogar kaputte Netzteile ab und zu dafür verantwortlich sein können, dass beim DSL da irgendwelche Störungen auftreten, Störsignale irgendwie mit einfließen in die Leitungen.
Habe das alles gemacht, also ich war mir sicher, das liegt nicht bei mir.
Also, weil auch dieser Ausfall von bestimmten Tageszeiten, also immer um 13 Uhr bis immer um 21.45 Uhr, das konnte ich mir nicht erklären.
Oh Gott, den ganzen Nachmittag.
Und ja, also es war wirklich, ich meine, ich habe dann Handy halt, Tethering und konnte dann trotzdem noch arbeiten, aber es ist trotzdem ärgerlich.
Und natürlich schicken die dann einen Techniker und der Techniker kommt direkt rein.
Ich habe mir jetzt schon angewöhnt, ich informiere mich vorher noch mal so kurz, also ich habe mir noch mal kurz bei Wikipedia und so angelesen, wie funktioniert denn so DSL-Technik, da geht es dann den KVZ, den Kabelverzweiger, der steht dann am Ende der Straße.
Und von dort geht es weiter zur Verteilstelle, also zum DSL-AM.
Und so hat man mir so ein bisschen DSL-Technik angelesen, mache ich eigentlich immer, wenn ich mit irgendwie mit Hotline so zu tun habe, dass ich gleich mal so ein bisschen zeigen kann, ich bin jetzt nicht 0815-Nutzer, der gar keinen Plan von irgendwas hat, sondern mit mir braucht ihr nicht versuchen, ja.
Merkt das, der 0815-Support-Mitarbeiter, checkt der das?
Ja, ja, schon, doch schon.
Okay, gut.
Ich habe das früher nicht gemacht und dann ist so, ja, jetzt machen Sie doch erstmal, schalten Sie doch mal die Fritzbox aus.
Und jetzt machen Sie mal hier, machen Sie mal das.
Und haben Sie dann schon probiert und haben Sie mal den Strom ausgemacht.
Und der kam rein und ich habe gleich gesagt, ja, müssen wir zum APL oder gleich zum Router?
Und ja, APL, jetzt habe ich vergessen schon wieder, was das heißt, irgendwas, da war Point Offline, das ist das, wo es reinkommt, der Hausanschluss, ja.
Da habe ich gedacht, okay, gleich mal hier APL streuen, dann weiß der gleich schon mal, woran der ist.
War tatsächlich auch so, also gleich, wir gehen an den Router und schalten Sie sich mal auf die Fritzbox und so, ja.
Also hat er schon gleich gemerkt.
Und obwohl ich schon so gesagt habe, ich vermute ja, dass es auf der Strecke zum DSLRM liegt und so, ja.
Natürlich trotzdem, wir gucken jetzt mal hier die Verkabelung an.
Und dann war es blöderweise auch so, dass ich tatsächlich noch einen Splitter drinnen hängen hatte, den man für VDSL nicht mehr braucht und für ADSL gebraucht hat.
Weil noch eine analoge Telefonleitung im Haus ist und so, dann hat er natürlich gleich gesagt, ja, daran liegt es.
Hat das abgeklemmt, hat noch gesagt, naja, kann sein, dass die Telekom dafür was verlangt.
Das sind ja meistens dann auch wieder Subunternehmer, weil das ja quasi meine Schuld wäre.
Da habe ich schon gedacht, die sollen sich mal trauen, mir eine Rechnung zu schicken, weil mir klar war, dass das auch damit nicht erledigt ist.
Und siehe da, er verkabelt das um, war eine Sache von fünf Minuten.
Ich gucke auf die Fritzbox, nachdem der Sync wieder da war, ist er super, die Werte schlechter als vorher.
Und er hat schon gesagt, ja, sieht nicht so aus, als wäre das jetzt unbedingt die Ursache gewesen.
Dann hat er den Port neu gestartet und aha, siehe da, plötzlich kriege ich meine 40 MBit Upload auch hin, die ich auch laut Vertrag haben sollte.
Vorher waren es immer nur 30.
Also es hat sich was getan.
Und dann lief das auch den kompletten Nachmittag und ich dachte schon, ja gut, okay, vielleicht hat er ja doch recht gehabt.
Und zack, am nächsten Tag, 13 Uhr, wieder Ausfall, bis abends 21.45 Uhr und das dann die nächsten Tage.
Also wieder Support angefragt und gesagt, hm, hier, so ein bisschen hier habe ich doch gesagt.
Und dann hat er an der Hotline auch wieder gesagt, ja, also nee, ich sehe schon, das liegt absolut an der Leitung, da haben sie recht.
Und hat also nochmal den Techniker vorbeigeschickt, der dann den Port neu verkabelt hat und schubdiwupp war die Sache erledigt.
Also hätte man auch gleich haben können, und das war für die natürlich jetzt wieder Kostenaufwand, der nicht hätte sein müssen, wenn man dem Kunden einfach mal glauben würde, dass der Kunde nicht total bescheuert ist.
Aber gut, so ist es nicht total bescheuert.
Nicht total, nicht total, nur ein bisschen.
An der Stelle mal eine Frage, du hast gesagt, du hast Tethering gemacht.
Weißt du jetzt, wie viel du am Tag so an Daten verbrauchst?
Weil ich habe das auch mal einen Tag machen müssen, den Freitag letzte Woche, weil da bei mir mittags irgendwann das Internet ausgefallen ist.
Und ich habe dann übers Firmenhandy dann auch mal Tethering gemacht, ich benutze es normalerweise nicht.
Und kann da jetzt natürlich ziemlich genau sehen, wie viele Daten da durchgeflossen sind, weil ich habe sofort eine Datenwarnung natürlich gekriegt.
Also es kommt natürlich darauf an, was du damit machst.
Also erstmal ist wichtig, wenn du dann diesen Access Point da einrichtest und dich damit verbindest, du kannst in den Windows-Einstellungen, weiß nicht, ob das bei Linux auch geht,
kannst du festlegen, dass das eine, also auf Englisch heißt das Metered Connection, also eine eingeschränkte Verbindung, eine mitgezählte Verbindung, ich weiß nicht, wie ich es auf Deutsch jetzt ausdrücken soll,
Also dass solche Sachen wie Updates oder sowas, so unnötige Sachen, nicht darüber laufen sollen.
Weil sonst, ne, einmal hier ein größeres Windows-Update gezogen, dann hast du dann ein, zwei Gigabyte vielleicht los.
Also das ist wichtig einzustellen.
Und dann sollte man halt nicht unbedingt jetzt irgendwie 4K-Videos streamen oder so.
Und dann bin ich mit normalem Arbeiten und doch ein, zwei Tutorials irgendwie auf YouTube angucken, bin ich so am Tag bei schon so 500 MB gewesen.
Also Nachmittag, Nachmittag.
Ich lache mich tot.
Okay, gut.
Ich habe aber halt auch wirklich versucht, das einzudämmen.
Also ich wollte natürlich jetzt nicht mehr Daten aufbauen.
Also ich hatte von 13 Uhr bis, ähm, bis 18 Uhr oder so, habe ich das benutzt.
Und ich muss dazu sagen, ich hatte auch ein paar Video-Chat-Meetings über Jitsi.
Ähm, ich weiß, dass auch da die meisten Daten reingeflossen sind.
Also ich glaube, ich hatte, ich hatte ein, ein, eineinhalb Stunden Meeting oder sowas.
Mindestens eins darüber.
Ähm, und ich habe in diesem Zeitraum 5,6 Gigabyte verbraucht.
Und das meiste, das war wirklich, also, ja, bei, bei einem halben Tag.
Also wie gesagt, von 13 bis 18 Uhr oder so.
Ja, also, naja, das hat mich jetzt nur noch interessiert, wie viel du da verbraucht hast.
Ich habe da aber auch nichts ausgeschaltet.
Ja, ja, gut, klar.
Also der hat auch tatsächlich in dem Zeitraum ein Android-Update gemacht.
Ähm, und, äh, ja, also das, das lief dann halt alles.
Ich habe da jetzt nichts eingeschränkt.
Ich habe mir gedacht, ähm, wieso?
Ja gut, klar, wenn es ein Firmenhandy ist, ähm, ist das ja kein Problem.
Ich möchte mein Datenvolumen halt irgendwie noch den restlichen Monat gebrauchen können,
war ja jetzt auch erst Anfang des Monats.
Ja, bei dir ist es privat, bei mir nicht.
Bei mir ist das Handy genau für solche Notfälle.
Also das heißt, ich habe die Box ausgeschaltet, äh, hier Creative Suite Updates, äh, nicht runtergeladen.
Und wie gesagt, mir hat Connection eingestellt, ähm, und versucht da irgendwie alles.
Genau, das wollen wir dann auch noch machen.
Natürlich, das lief natürlich dann auch und ich habe mich gewundert, warum alles so lahm ist.
Okay, gut.
Äh, ja, hast du noch, noch Retro-Punkte?
Ja, du weißt genau, dass ich noch Retro-Punkte habe.
Du weißt genau, dass ich noch Retro-Punkte habe.
Aber wir können sie schnell abhandeln.
Nee, mach zu, keinen Stress.
Über Marquis habe ich, über Marquis habe ich, na, okay, wollen wir denn den Rekord knacken?
Ja, über Marquis habe ich schon gesprochen.
Ähm, dann eine Sache, die mich besonders gefreut hat, ähm, vor allem, weil ich mit, mit, äh,
dem, dem Macher davon, äh, schon mal, äh, gesprochen habe auf einer Konferenz.
Ähm, der erste Podcast, den ich jemals überhaupt gehört habe, Technikwürze, geht weiter.
Ähm, Technikwürze war von 2005 bis 2013, glaube ich.
Ich glaube, am Ende ist es nicht mehr so regelmäßig erschienen, so ein Webdesign-Frontend-Webstandards-Podcast.
Die Seite ist auch noch online von denen.
Ähm, gemacht von dem, äh, also unter anderem gestartet von dem David Matsiejewski.
Ähm, den habe ich auch mal auf einer Konferenz getroffen.
Ähm, 2016, glaube ich.
Und da habe ich ihn mal drauf angesprochen, habe so gemeint, ey, du bist doch der von Technikwürze.
Und er so, ah, geil, äh, dass sich noch jemand dran erinnert.
Äh, ja, genau, das geht jetzt wieder an den Start.
Ist, äh, per Twitter angekündigt worden, dass es da im Herbst weitergeht.
Und das freut mich echt, weil, äh, das ist auch für mich so ein bisschen Inspiration gewesen.
Ich habe damals mit ihm drüber gesprochen, so, hey, Podcast und so.
Äh, hast du irgendwie Bock, Technikwürze nochmal weiterzumachen?
Und ich würde sowas auch gern starten.
Also, das war 2016 tatsächlich schon im Kopf, dass ich sowas mal vielleicht machen will.
Und, äh, ja, also, äh, danke, David.
Ähm, ohne dich wäre das hier wahrscheinlich nicht möglich gewesen.
Also, ich freue mich, äh, ihr könnt mal auf technikwürze.de schauen, glaube ich, technikwuerze.de.
Ähm, da gibt es 188 Folgen schon.
Ähm, wie gesagt, die letzte ist von 2013.
Ähm, ich weiß nicht, inwiefern das jetzt noch relevant ist, der Inhalt von damals.
Aber es ist auf jeden Fall aus, äh, historischer Sicht auf jeden Fall ein interessantes Archiv.
Genau, da freue ich mich drauf.
Vielleicht machen wir ja mal ein Crossover. Mal gucken.
Ja, vielleicht machen wir mal ein Crossover.
Vielleicht gibt es da mal irgendwie eine Kooperation.
Ja, muss man mal, muss man den David mal fragen.
Vielleicht, ich war, er hat, er hat schon angekündigt, dass das Format anders wird als vorher.
Und vorher war es ein Interviewformat.
Also, in erster Linie zumindest habe ich es so in Erinnerung, dass der oft Gäste hatte.
Ähm, ich möchte gar nicht wissen, was für ein Aufwand das war, 2005,
übers Internet, mit Skype irgendwie Podcast aufzunehmen.
Ähm, das ist jetzt heutzutage mit schnellem Internet und, und, äh, irgendwie guter Technik gut möglich.
Aber das muss damals echt ein Riesenakt gewesen sein.
Ja, komm, vielleicht hören wir uns ja sogar zu.
Also, wir freuen uns auf jeden Fall drauf.
Ja, also David, falls du zuhörst, äh, melde dich mal und dann machen wir was.
Das sagen die Musiker immer, ne?
Dann machen wir mal was.
Meld dich, melde dich mal und wir müssen unbedingt mal was zusammen machen.
Das ist der Musikerspruch schlechthin.
Jeder Musiker, den du triffst, den du nicht ganz doof findest und der dich nicht ganz doof findet,
sagt, wir müssen unbedingt mal was zusammen machen.
Und dann passiert nichts.
Also, lass uns, äh, lass uns keine Musiker sein.
Wir machen das besser.
Ähm, einen Punkt habe ich noch.
Und zwar, das kam jetzt, äh, glaube ich, gestern oder vorgestern, zumindest so in, in, in meine Wahrnehmung.
Ähm, äh, ich bin jetzt, äh, das haben viele andere über Twitter schon geschrieben, Arctic Code Vault Contributor bei GitHub.
Ach, ach, was, äh, was, äh, was ist das denn?
Ähm, ich weiß nicht.
Warte mal, ich glaube, ich glaube, den Link, ich muss jetzt selbst nochmal den, den Link kurz suchen.
Ähm, genau. Es, es gibt von GitHub ein Programm, dass sie, dass sie Open-Source-Projekte, ähm, auf Mikrofilm, ähm, bannen.
Und dann wollen sie das, äh, für die nächsten tausend Jahre sicher in der Arktis verwahren, in der Nähe vom Nordpol, in so, in so einer Permafrost-Höhle.
Ähm, und jeder, der schon mal an einem von den Projekten, die die da, ähm, mit reinnehmen, ähm, ähm, Code, äh, Contributor hat, ähm, hat jetzt ein Badge auf seinem Profil, wo eben steht, äh, Arctic, äh, genau, Moment, ich hab's hier nochmal, Arctic Code Vault Contributor.
Ach, krass.
Das hast du wahrscheinlich auch, wenn du schon mal bei Open-Source-Uni ...
Ähm, weiß ich jetzt nicht, wo, äh, warte mal.
Ja, geh mal, geh mal auf deinem Profil bei GitHub, da weißt du, dass ...
So viel hab ich, glaub ich, noch gar nicht contributed, äh, contributed ...
Da reicht, da reicht ein Commit in einem Repository, das, glaub ich, einen Stern hat und Open-Source ist.
Oder, ich glaub, ich glaub, alle ...
Ach doch, hier, Highlight, äh, Arctic, äh, Code Vault Contributor, äh, several repositories in the ...
Ach, tatsächlich.
Verrückt.
Also, unser Code geht in die Arktis.
Ja, sogar zu, äh, mindestens dreien, also, hätt ich jetzt gar nicht gedacht, dass ich da doch so aktiv war. Verrückt.
Ha!
Mich, mich hat's auch gewundert, ähm, weil ich hab das bei vielen auf Twitter gesehen, dass sie das stolz gepostet haben,
hey, mein Code geht in die Arktis, und ich dachte mir so, ah, da bin ich bestimmt nicht dabei, weil ich nicht so viel bei Open-Source mitgemacht hab.
Aber hab dann gesehen, es hat gereicht, also, ich hab zum Beispiel bei Media Element mal Pull-Requests gestellt, ähm, das ist so ein, äh, so ein Video-Player, Open-Source.
Ich hab bei Mailvelop mal mitgearbeitet, ähm, und, äh, bei dem Tiny Helpers hab ich auch, äh, schon, schon Tools eingereicht, und das sind, äh, drei Repositories, wo ich irgendwie damit auftauche.
Sieht man da irgendwo die ganze Liste, wo man dabei war, weil hier steht nur, also, bei mir ist es, äh, TNT-Search, das weiß ich gar nicht, weil, ich glaub, ein PHP-Suchindex, äh, W2-UI, was ist denn, JavaScript-Library, äh, Mapbox-Supercluster, and more steht da nur, also, das sieht man irgendwie nicht die, äh, die ganze Liste.
Ich hab, ich hab drei Stück, und dann steht da and more.
Ja, genau, bei mir auch.
Ähm, also, was mich noch interessiert hätte, wäre, ist mein Accessibility-Cheat-Sheet vielleicht da mit drin, weil da stand irgendwas von wegen, äh, ich weiß jetzt,
die Kriterien nicht mehr zu 100 Prozent genau, aber ich glaub, es war irgendwie sowas wie, ähm, wenn's im, wenn's da Updates gab, innerhalb des letzten Jahres, und das Repository mindestens einen Stern hat, äh, das wäre gegeben, dann wär das nämlich auch da mit drin, also, äh, find ich, ist ne coole Sache.
Ja, witzig.
Keine Ahnung, wie sinnvoll das ist.
Super, dass du mich darauf hingewiesen hast, wäre völlig an mir vorbeigegangen.
Ha! Cool. Endlich noch was, was du noch nicht gesehen hast, Tommy.
Ja, du zeigst mir immer wieder neue Sachen.
Ja, das hat mir die Twitter-Bubble zugespielt.
Cool.
Äh, das haben ganz viele da ganz stolz gepostet, und, äh, ich hab das jetzt nicht gemacht, ich rede ganz stolz im Podcast darüber, dass irgendein, ja, das ist, also, da gibt's so ein kleines Video auf der Seite von denen, ähm, von, von diesem Projekt, und das ist irgendwie, äh, das ist ganz, ganz sehenswert, weil man da auch sieht, in was für einer Form das festgehalten ist, wo man diesen, das sieht aus wie so, wie so riesen QR-Code auf Mikrofilm in so Filmrollen drin.
Ähm, und ich glaube, sie haben irgendwie auch gesagt, dass sie es in verschiedener Form festhalten, also, das ist nicht das Einzige.
Ja, coole Sache.
Mal gucken, ob das in ein paar Jahrhunderten noch jemand entschlüsseln kann, und was damit anfangen kann.
Ja, da haben sie sich auch Gedanken drüber gemacht, wie das dann geht, aber das, äh, das hab ich jetzt nicht im Detail gelesen, wie, wie sie das sicherstellen wollen.
Ich weiß nicht, ob die da noch ein ...
Fast mal ein eigenes Geilteil wert.
Was, das, äh ...
Das ganze, das ganze Programm und mal so ein bisschen noch tiefere Informationen, was da so geplant ist und gedacht ist und wie die Technik und so.
Ja, kann man ja, kann man mal vergeilen irgendwann.
Ja, das ist das zum Arctic Code, Walt.
Äh, dann, du hast auch noch Retro, gell?
Ja, ja, wir sind ja erst bei einer halben Stunde, also, kann man ja mal langsam zur zweiten Retro kommen.
Ja, vielleicht ist das auch völlig uninteressant, was wir hier erzählen, aber, ähm, ja, Pech.
Nicht unser Problem.
Nee.
Dein Problem.
Wir sprechen ja auch nur alle zwei Wochen miteinander. Wir haben halt hier, äh, müssen wir mal Rücksicht nehmen.
Wir haben halt auch uns Sachen zu erzählen. Wir sehen uns nicht so oft zur Zeit.
Ja, nehm mal Rücksicht, ey.
Gut, dann, äh, ja, mach ich mal weiter. Ähm, ich hab ein Follow-up zu meiner PHP-Emoji-Library, die ich angekündigt habe in, war das die letzte Folge?
Oder war das die davor? Ne, ich glaub, es war sogar die, die letzte, die 10er.
Ähm, und das Ding hat jetzt einen Namen und ist jetzt auch verfügbar. Äh, ist aber, glaub ich, auch nullmal runtergeladen worden.
Also, ich hab auch noch keine Werbung dafür gemacht.
Warte, ich lad's mal schnell runter.
Ähm, es heißt, äh, 4-8-Design, also mein Firmenname, ähm, 4 und 8 als Zahl, Design, Slash, Smiley.
Ich hab mich schon gefragt, wie man's ausspricht.
Smiley. Smiley, äh, Femoji war schon vergeben. Und, ähm, da ich, da ich ja so ganz retro Smiley gesagt hab, statt Emoji in, in, in, in der Emoji-Folge oder, oder in einer drauf, ähm, ich hab gedacht, gut, dann halt Smiley.
Smiley. Ah, und man findet's auch sofort, wenn man, wenn man tatsächlich dann Google dazu überredet, nein, ich wollte nicht Smiley schreiben.
Ja, also ist verfügbar auf, auf, auf GitHub, äh, Open Source natürlich und, äh, auf, äh, Packagist, äh, lässt sich also per Composer auch installieren und, äh, ich, ja, was es genau macht, äh, hört euch, hört euch, hört euch letzte Folge an.
Muss ich jetzt nicht nochmal erzählen, ähm, bevor es jetzt noch länger ausartet. Genau, also Smiley und, äh, das bringt mich auch zum nächsten Punkt gleich, da hab ich nämlich zum ersten Mal, äh, Travis CI, äh, selbst integriert in ein Projekt.
Ich kannte das schon von diversen, äh, anderen Open Source Projekten und, äh, es ist nämlich komplett kostenlos für Open Source Projekte, das find ich auch ziemlich cool, ähm, und wem das jetzt nicht sagt.
Was macht das denn genau? Ich hab das schon öfter gesehen.
Genau, also Continuous Integration, das ist, wenn du irgendwo einen Pull Request stellst und dann wird da erst irgendwas gerödelt und dann ist dein Pull Request erst irgendwie gelb markiert und dann laufen da so automatisch irgendwelche Builds und Tests und dann wird das hoffentlich irgendwann grün und sagt dann hier, jo, der Pull Request ist kompatibel und macht nichts kaputt.
Und, äh, also genau, Continuous Integration ist das Stichwort, das war übrigens auch Travis CI, ähm, sollten wir schon kurz vielleicht erklären, was das bedeutet, äh, weiß ich nicht, jeder damit auskennt und ich auch bis vor kurzem noch nicht so viel damit zu tun hatte.
Ähm, das bedeutet, dass man den Code in kleinen Häppchen committet, ähm, eventuell sogar mehrmals am Tag, ja, also wenn mehrere Entwickler vor allem dran arbeiten, äh, wird mehrmals am Tag der aktuelle Entwicklungsstand, äh, an den Master committet.
Ähm, das Problem ist ja immer beim Entwickeln, gerade wenn viele Leute entwickeln und Parallelfeatures, äh, vielleicht auch noch an der gleichen Stelle im Programm entwickeln, dass die Unterschiede zwischen Master Branch und deinem Entwicklungs- oder Feature-Branch immer größer werden.
Ja, je länger du dir Zeit lässt, um das wieder irgendwie abzugleichen, desto größer wirst und, ähm, da besteht natürlich das Risiko, dass du dann mehrere Integrationskonflikte irgendwie auf einmal hast beim Zurück-Merchen und, äh, das wird dadurch halt minimiert.
Also die Folgendesweise ist, dass du vorher den Master wieder in deinen Entwicklungs-Branch mergst, damit da schon mal keine, äh, Unterschiede mehr bestehen und dann eben kleinteilig deine Änderungen reinmergst.
Vorher am besten Unit-Tests, wenn es die denn gibt, bei dem Projekt laufen lässt und zu gucken, okay, mach ich denn irgendwas kaputt und erst dann geht das Ganze in den, in den Branch.
Und, ähm, ja genau, also je größer der Unterschied halt ist zwischen, zwischen den Branches, umso mehr Arbeit hast du halt am, am Ende, wenn du das Merchen willst.
Ähm, da gibt's so die, die Stichworte Merch-Hell oder Integration-Hell, äh, nennt man das, wenn man dann halt irgendwie plötzlich feststellt, oje, äh, jetzt hab ich einen Haufen Arbeit und wollte doch nur das kleine Feature irgendwie committen.
Ähm, und das Ganze erlaubt eben auch automatische Unit-Tests laufen zu lassen, das heißt, du solltest schon als Entwickler das bei dir auch lokal machen, bevor du's machst, dann, bevor du's committest, weil dann siehst du gleich schon, ob irgendwas kaputt geht.
Aber diese, diese, ähm, Build-Prozesse, die da laufen, die können auch automatisch Unit-Tests ausführen, ähm, auch automatisch bei jedem Pull-Request, das gestellt wird, das machen, das wird ganz oft eben gemacht bei, bei Open-Source-Software.
Also technisch läuft das so, dass du da VMs hast, die da laufen, du kannst ja aussuchen, auf welchen, äh, Linux-Versionen, auf welchen, ähm, PHP-Versionen, wenn's jetzt ein PHP-Projekt ist, ähm, kannst das alles richtig, äh, detailreich und deinen Ansprechungen, äh, ansprüchengemäß konfigurieren.
Und, ähm, dann läuft das eben bei jedem Commit oder bei jedem Pull-Request und die, die Gefahr von Breaking-Changes wird dadurch eben deutlich verringert.
Oder beziehungsweise, wenn was auftritt, sieht man halt gleich, okay, das lag an dem Commit, mit dem Commit ist es kaputt gegangen und dann, äh, kann man das schneller fixen.
Ähm, der Code kann dabei auch vollständig kompiliert werden, also wenn du jetzt irgendwie eine, eine C++-Anwendung hast oder was, ähm, wo der Code wirklich kompiliert werden muss, dann macht, äh, kannst du das in der VM, äh, in der VM direkt machen lassen.
Und, äh, auch da beim Bild-Prozess halt auch Fehler hingewiesen werden. Ähm, aber nicht nur, nicht nur Unit-Tests oder sowas oder kompilieren ist da machbar, also auch Performance-Tests oder irgendwelche anderen statischen Analysen und was weiß ich was, äh, kann man da alles automatisiert durchlaufen lassen.
Ähm, und, äh, das ist schon ziemlich cool.
Also, äh, die Qualitätssicherung passiert quasi kontinuierlich, statt wie das halt vorher immer üblich war, erst am Ende von so einem Entwicklungsschritt.
Wo dann, also ich meine, wir beide kennen das ja, haben ja auch mit QA, äh, zu tun, öfter mal.
Und, ähm, da hat sich ja in den letzten Jahren schon einiges getan.
Also, wenn ich zurückdenke, so, äh, in der Anfangszeit, wo ich da zum ersten Mal mit QA so in Berührung gekommen bin in einem größeren Unternehmen, ähm, da war schon sehr viel manuelle Arbeit und immer wieder auch repetitiv und immer wieder das Gleiche.
Und dann kam das Nächste und dann hat sich das Release wieder verzögert, weil dann doch wieder größere Dinge aufgefallen sind und so.
Und in den letzten Jahren wurde da immer mehr, immer mehr automatisiert und das führt schon zu, zu einer höheren Qualität oder auch, auch zu Verkürzungen von, von irgendwelchen Schleifen, die man da dreht.
Eine Frage, kann das nicht GitHub mittlerweile von, von sich aus?
Es gibt von GitHub jetzt auch so einen Dienst, also dieses Travis CI, ich möchte das jetzt auch gar nicht explizit bewerben, es ist halt eins solcher Tools, ähm, ist ein CI-Tool, es gibt, ähm, ja, jetzt hab ich den Namen blöderweise vergessen, es gibt noch ein anderes, ähm, vielleicht verlinke ich das auch noch in den Shownotes.
Wenn's mir wieder einfällt, ähm, das ist, glaub ich, auch kostenlos für, für, sogar für kleinere Teams, soweit ich weiß, also nicht nur für Open Source, sondern auch für Closed Source, hat aber Beschränkungen halt, wie viele Tasks du gleichzeitig da laufen lassen kannst und so.
Ähm, aber es gibt auch von GitHub ein, an, so, so, so, so ein Software-as-a-Service-Dings.
Ich dachte, da ist was integriert mittlerweile, es gibt's aber noch nicht so lange, ne?
Ist aber auch ein Paid-Service, also das ist nicht, ähm, ja, hab ich nämlich auch gesehen in dem Zug, also das ist nicht, jetzt irgendwie free, so wie, wie, wie, also vielleicht ist es sogar für Open Source free, das weiß ich jetzt gar nicht.
Äh, kann ich auch nochmal schauen und den Link, äh, reinpusten.
Das ist nur, das ist nur vor einer Weile an mir vorbeigescrollt bei GitHub und dachte, äh, das hat mich so drauf hingewiesen, so, hey, du kannst jetzt hier auch, äh, CI machen bei GitHub, äh, keine Ahnung, ich weiß auch nicht mehr, wie das heißt oder wie man das findet, ich glaube, man kann das irgendwie seinen Projekten einfach so hinzufügen, ähm, allerdings weiß ich nicht, ob das, ob das free ist für Open Source, keine Ahnung.
Also ich hab mir das gleich mal notiert hier in meinen, äh, Shownotes, dass ich da noch Links raus suche, auch zu alternativen Anbietern und eben zu diesem, ähm, zu diesem, ähm, zu diesem GitHub, äh, Software-as-a-Service gelöhnt, was das angeht, äh, werde ich dann auf jeden Fall in den Shownotes nachreichen.
Ja, genau, wenn wir jetzt schon bei, bei, bei, äh, Definition von Keywords in diesem Bereich sind, äh, wird man häufig auch über Continuous Delivery oder Continuous Deployment, äh, stolpern in dem Zusammenhang, also das heißt einfach, dass, ähm, Software, die in der Mainline ist, also im,
im Mainbranch immer sich in einem Zustand befindet, in dem er theoretisch deployed werden könnte, also das ist Continuous, ähm, Delivery und teilweise wird das sogar automatisch deployed, das ist dann Continuous Deployment, also das geht alles so Hand in Hand.
Genau, genug, äh, Fremdwörter um uns geworfen, Moritz guckt schon ganz kritisch.
Ja, nee, das hat er nicht, äh, ich glaube, ich muss mein WhatsApp hier mal ausschalten.
Mach das. Äh, äh, apropos, äh, kompiliert, weil ich gerade schon gesagt hab, hier C++
und, und Software, die kompiliert werden muss. Kompliziert, heißt das.
Kompliziert, ähm, ich hab einen kleinen Ausflug in die C++-Welt gemacht, weil ich mich mit Fontforge beschäftigt hab, das ist das Begriff?
Fontforge ist, äh, so ein Open-Source, ähm, ja, wie nennt man das dann? Schriftart-Erstellungsprogramm.
Das hat bestimmt einen Namen, also Typografie.
Vorhandene Schriftarten angucken und anschauen, was für Features die haben und kann da Dinge dran rum vorwerken.
Und damit hatte ich, äh, hatte ich jetzt zu tun in meiner, äh, Arbeitswelt und hab damit ein bisschen rumgebastelt und bin immer wieder auf Bugs gestoßen
und hab entsprechend natürlich, äh, Bug-Tickets dann geöffnet auf GitHub, ähm, und dann halt auch irgendwie zwei Tage nix gehört und dann irgendwie beschlossen, äh, ich bin zu ungeduldig und ich versuche das selbst zu fixen.
Es gibt nur ein kleines Problem, ich kann kein C++ und, äh, ich muss echt sagen, ich bin auch echt froh, das nicht machen zu müssen.
Also ich hab die, ich hab unsere Frontend-Welt und dieses, äh, oder auch, ja, PHP, auch was, was nicht kompiliert werden muss, sondern zur Laufzeit ausgeführt wird, ich hab das echt nochmal richtig schätzen gelernt.
Ähm, ja, also ich mein, klar, je, je, je mehr Low-Level es wird, ja, umso weniger wird einem abgenommen.
Klar, umso mächtiger ist es natürlich theoretisch auch, aber ganz ehrlich, Speicherbereiche reservieren.
Wer will das denn?
Warum, also, warum, also, also, nee.
Aber gibt's da nicht mittlerweile Sprachen, die so Low-Levelig sind und bei denen du das trotzdem nicht machen musst?
C-Sharp.
Also, was ist denn?
Also ich glaub, C-Sharp ist, äh, ist schon so, mein Bruder programmiert, äh, auch mit C-Sharp und, äh, der ist relativ begeistert davon und sagt, der, den ganzen Kram kannst du dir da sparen.
Und es ist trotzdem noch Low-Level genug, um halt richtig gut zu machen.
Ich bin da jetzt nicht tief drin, aber ist nicht Rust jetzt gerade so der heiße Scheiß?
Rust ist auch, ja, hör ich auch irgendwie an, an jeder Ecke, ja, hab ich mich noch gar nicht mit beschäftigt.
Haben wir, haben wir einen gemeinsamen ehemaligen Kollegen, den wir dazu vielleicht mal befragen können.
Ja, ah, okay, interessant.
Können wir nachher mal drüber quatschen.
Der, der zumindest in seinem Twitter-Profil drinstehen hat, dass er damit irgendwas macht.
Ja, also hört man ganz, ganz, äh, oft.
Also ist jetzt auch so ein, so ein Trend irgendwie.
Ähm, ja, und alleine schon das, das GUI, wie das zusammengewurschtelt ist, ja.
Also dafür gibt's natürlich auch Libraries inzwischen, die es halt damals noch nicht gab, als das irgendwie, keine Ahnung, vor 20 Jahren, glaube ich, oder 25, äh, angefangen wurde.
Aber, also jeder, jeder Button wird da platziert, pixelgenau und jede Tabelle und, wow.
Also ich, ich hab echt versucht, mich da richtig tief durchzuwurscheln, zuwurscheln und mit dem Compiler zu arbeiten und da irgendwie in die Funktion reinzuspringen und rauszuspringen und drüberzuspringen.
Ich hab's nicht, also einen Bug hab ich tatsächlich gefixst bekommen, da bin ich jetzt auch ein bisschen stolz drauf, ja, dass ich ohne zählt, bloß bloß wirklich zu können, äh, den Fehler gefunden hab und tatsächlich ist auch schon, ähm, in den, in den, in den Master jetzt, äh, gemerged, mein Fix.
Und der andere, ja, da hab ich, äh, noch nicht mal einen Kommentar zurück, ich hab selber in dem Issue, glaube ich, irgendwie zehn Kommentare geschrieben, aber noch nix gehört.
Mal gespannt. Es ist auch nur was, also es macht halt nur eine Funktion quasi völlig unnutzbar, ja.
Und das ist auch, das ist halt so ein Ding, ähm, die, das ist durch Entwicklerhände gegangen und immer wieder gewechselt und keiner weiß bei manchen Coachstellen mehr, wie das richtig funktioniert.
Unter anderem bei dem Zusammenbauen von, von GUI.
Kannst du verraten, was du da gemacht hast oder ist das springgeheim?
Naja, was werde ich mit dem Schriftartprogramm gemacht haben? Ich hab, äh, bin dabei gerade eine Schriftart zu basteln.
Ah, die Konstantin Sands?
Äh, nicht ganz, nee.
Nee, für, äh, es ist ein, äh, für den Kunden werde ich sicherlich, wenn's fertig ist, wenn's tatsächlich durch ist, dann, äh, auch hier ein bisschen bewerben, aber, ähm, ja, aktuell kann ich da noch nix, noch nix Genaues dazu sagen.
Aber es gibt eine Schriftart, ja, und ich wollte das, ich, ich hab mich schon früher immer mit, mit, mit, mit Fonts, äh, äh, auseinandergesetzt und gespielt und wollte das auch ewig machen.
Jetzt hat sich's ergeben, dass wir tatsächlich die Möglichkeit haben, das für den Kunden zu machen und, äh, ich bin gespannt, wie das wird.
Aber jedenfalls, die Anwendung ist halt leider voller Bugs und, ähm, wie gesagt, die Leute wissen teilweise auch gar nicht, was da jetzt genau passiert und, also, ich kann sagen, was, was, was der Bug ist.
Also, ich, äh, das gibt so OpenType-Tabellen, diese Features, ja, also, dass irgendwie Legaturen erzeugt werden oder kontextuell irgendwelche Änderungen passieren in den Buchstaben, Zusammenstellungen.
Und wenn ich so eine Tabelle anlege, dann steht statt des Tabellennamens da nur eine Zahl in der Spalte.
Und das deutet für mich darauf hin, dass entweder irgendwas, äh, von der Typisierung, da wird halt irgendwie ein Integer reingeschrieben statt einem String, ähm, aber mit dem Debugger hab ich festgestellt, das wird zuerst richtig reingeschrieben und dann steht dann plötzlich doch ein Integer da.
Oder es ist irgendwas mit, eben mit der Speicherverwaltung, ja, dass da irgendwelche Zufallszahlen irgendwie aussehen.
Also, jedenfalls, das sind so Sachen, es sind wirklich, also, da funktionieren einfach Features nicht und die funktionieren halt irgendwie schon seit Jahren nicht in der Anwendung.
Das finde ich halt bei, bei OpenSource immer so ein bisschen schade, dass das halt, also, das würde dir halt bei einer kommerziellen Software eher nicht passieren, dass da wirklich was einfach über, über ein, zwei Jahre hinweg gar nicht funktioniert.
Und viele, viele nutzen halt die, naja, also, es ist schon, also, die Wahrscheinlichkeit ist schon geringer.
Also, zahlende Kunden würden einem da aufs Dach steigen.
Aber es ist halt OpenSource, also, da kannst du dich halt nicht, äh, ja, in dem Fall finde ich es halt nicht ganz unwichtig.
Also, jedenfalls frage ich mich, wer macht das freiwillig, sich so Low-Level, äh, auseinanderzusetzen.
Ist gut, dass es Leute gibt, die das machen, für mich wäre es nix.
Vielleicht landet dein Fix ja in der Arktis.
Genau, möglich, ja.
Ja, das, das war voll meine Vermutung, dass das vielleicht als Projekt dabei ist, aber dafür ist die, ist der, das zu neu, das war jetzt erst vor ein paar Tagen.
Äh, ja, genau, also, ich will auch nicht, ich will jetzt auch nicht Fontforge schlechtreden.
Das ist ein cooles Tool und es ist auch als Command-Line-Tool sehr gut brauchbar und das unterstützt inzwischen auch Python-Scripting, auch wenn ich jetzt Python nicht so doll finde.
Aber, ähm, ich glaube, ich werde versuchen, das, äh, eher per Command-Line anzusprechen, als über das GUI, weil damit funktioniert es nämlich dann.
Also, wenn jemand Probleme hat mit Fontforge, ähm, und da irgendwelche Bugs hat, äh, was, was OpenType-Features, ähm, anbelangt, dann macht euch die Mühe und lest euch kurz an, wie Feature-Files für OpenType funktionieren.
Schreibt euch die Feature-Files selber und importiert die dann in Fontforge.
Das funktioniert nämlich sehr gut.
Dann, äh, wenn ich das jetzt eh schon, ich wollte das eigentlich gar nicht, weil Schriftabdarstellung ist jetzt nicht unbedingt Frontend,
wobei vielleicht teilweise auch, ich mach's ja auch, ähm, ich poste mal den Link zu einem Artikel, äh, schreib mir gleich mal auf, Link zum Artikel, ähm, Feature-Files.
Äh, der hat mir nämlich sehr geholfen, das dann am Ende doch so hinzubekommen mit diesen Features und den Legaturen und den, äh, Dings, wie ich das wollte.
So, jetzt, jetzt haben wir eine Dreiviertelstunde, eine Dreiviertelstunde Retro gemacht und, äh, ja, jetzt mag ich nicht mehr.
Also, Vodafone und Telekom, schaut zu,
dass ihr unser Internet nicht mehr ausfallen lasst, sonst habt ihr das an der Backe, Dreiviertelstunde Retro, das ist nicht unsere Schuld.
Mann, Mann, Mann.
Haut überhaupt noch jemand zu? Jetzt oder?
Schon vorbei?
Hallo, hallo, ist da jemand?
Nee, ich hab die ganz, ich hab schon lange keinen mehr gehört, die sind alle schon nach Hause gegangen.
Oh, oh, oh, oh.
Wir müssen mal eine Live-Folge machen vielleicht.
Oh.
Ja, ja, ja, äh, der weiß nicht.
Können wir mal überlegen.
Ja, vielleicht.
Machen wir ja nachher was live quasi.
Ähm, wir machen nachher was live.
Ja, erst machen wir die Property der Woche.
Bitteschön.
Ja, die ist, die kommt heute von mir.
Äh, das ist was, was ich tatsächlich in den letzten Tagen mal gebraucht hab und, äh, neu entdeckt hab für mich.
Und zwar, äh, Mask-Image.
Ähm, kennst du das, Konstantin?
In CSS, Mask-Image.
Ich hab überlegt, ob ich das schon mal tatsächlich irgendwo produktiv eingesetzt habe.
Mir ist aber kein Beispiel eingefallen.
Ich glaub's nicht.
Was ist denn dein Anwendungsfall gewesen?
Mein Anwendungsfall ist, also, ähm, ich erklär vielleicht erst mal ganz kurz, wie das funktioniert und was das, was das tut.
Ähm, mit Mask-Image kann ich ein Bild nehmen oder auch bei, anstatt, anstatt Bildern kann man ja oft auch, äh, in CSS Gradients nehmen.
Das ist mein Anwendungsfall nämlich.
Ähm, kann man ein Bild nehmen, das, äh, transparente Bereiche hat und nicht transparente Bereiche.
Also, ein SVG kommt in Frage oder auch ein PNG.
Ähm, es darf auch halbtransparente Bereiche geben und damit kann ich, äh, ein anderes Element maskieren.
Das bedeutet, äh, die, die Bereiche in dem Bild, die transparent sind, werden dann auch transparent dargestellt bzw. abgeschnitten von dem Element, äh, wo ich das drauf anwende.
Und, äh, die Bereiche, wo was ist in dem Bild, die werden dargestellt, die sind, die sind dann da.
Aber, äh, ich glaube nicht, dass, da bin ich mir gerade nicht sicher, da ich jetzt kein echtes Bild ausprobiert habe, ich glaube, das Bild selbst nicht, wird nicht angezeigt, sondern nur die Form davon.
Also, es wird nur die Form davon genommen, angewendet auf das Element, ähm, das ich dann habe.
Mein Anwendungsfall war, äh, ich wollte Text am Ende des Absatzes ausblenden, langsam ausfaden lassen, aber ohne, dass ich was drüber lege, sodass der Text immer noch markierbar ist.
Und, äh, da gibt es natürlich eine Menge, äh, Ideen, wie man das machen kann.
Und früher hat man da halt unten dann irgendwie, ähm, noch ein Element drüber gelegt mit einem Verlauf oder so in der Hintergrundfarbe.
Ähm, aber ich wollte echte Transparenz haben an der Stelle.
Ich wollte sagen, dass das ist unabhängig von der Hintergrundfarbe oder von dem, was da irgendwie hinten dran passiert ist, soll, ich will echte Transparenz.
Ähm, und ich habe, ich hatte diesen Fall und dachte mir, naja, im schlimmsten Falle muss ich es halt irgendwie mit einem Bild machen und das da drüber legen.
Und dann habe ich nochmal kurz recherchiert und gesehen, nein, dafür gibt es jetzt eine geile Methode, nämlich Mask-Image.
Und das, jetzt habe ich das wirklich mit einem CSS-Einzeiler gelöst.
Die Demo, äh, kommt in die Shownotes.
Ähm, und zwar, ich kann es mal kurz vorlesen.
Also, ich habe jetzt auf das Element, äh, das relativ viel Text enthält, ähm, ein Mask-Image gelegt.
Und zwar Linear, Gradient, äh, Black 50 Prozent und dann zu Transparent.
Also, 50 Prozent, bei 50 Prozent beginnt das.
Äh, und bei 100 Prozent ist dann Transparent.
Also, das ist ein Verlauf von, von, äh, Schwarz, ähm, zu Transparent.
Ab der Hälfte des Elements nach unten.
Und, äh, habe ich genau den Effekt, dass das nämlich dann ausgefadet wird.
Der Text ist aber noch, äh, verwendbar und markierbar.
Genau.
Sehr cool, dass man das mit, mit dem Gradient auch kombinieren kann.
Und halt eben dann keine Grafik braucht, sondern halt wirklich die, die Grafik sich quasi generiert.
Genau, die Grafik generiert sich.
Und das macht es halt wirklich zum, zum echten Einzeiler in CSS.
Und das finde ich, äh, ziemlich mächtig.
Also, Mask-Image, äh, da gibt es auch noch, man kann das auch noch irgendwie,
ich glaube, es gibt auch noch Mask-Repeat.
Es gibt noch mehr Eigenschaften, die da ein bisschen mit reinspielen.
Ich habe jetzt aber tatsächlich nur Mask-Image, äh, gebraucht.
Und ich fand das, äh, ziemlich, also, eigentlich ist das der Weg, wie man sowas machen will.
Das ist, also, ich kann mir nicht vorstellen, dass man das irgendwie noch besser oder eleganter machen kann.
Das ist genau der Weg, wie man es haben, wie man es schon immer haben wollte.
Cool.
Also, gerade für diesen Anwendungsfall.
Ja, ich glaube, ich habe es…
Man kann natürlich noch verrückte Sachen mitmachen.
Ich kann natürlich jetzt, äh, auch ein Element, äh, irgendwie ein verrücktes Bild nehmen mit einem verrückten Rand,
was irgendwie am, äh, am Rand noch, äh, irgendwie langsam ausfädet oder so.
Und kann da alle möglichen verrückten Sachen mitmachen.
Äh, mein Fall war halt relativ einfach.
Genau, du wolltest noch was sagen, glaube ich.
Ja, ich glaube, ich habe es bei unserer Seite tatsächlich noch mit einem, mit einem Overlay von einem Verlauf, äh, das wäre tatsächlich was, wo ich das ändern könnte, zum Mask-Evage.
Ja, das, das Blöde ist, wenn man was drüber legt, ähm, dann bin ich immer von der Hintergrundfarbe abhängig.
Mhm.
Normalerweise.
Genau, das ist da auch das Problem, ja.
Und ich überdecke den Text, das heißt, der ist dann auch an der Stelle nicht mehr markierbar.
Das ist nicht unbedingt schlimm, aber geil wäre es, wenn er trotzdem noch markierbar wäre bis zum Ende.
Cool.
Genau, und das geht, das geht damit.
Ich weiß nicht, ob man es extra erwähnen muss, weil eigentlich ist es logisch, dass es so ist, aber ich wollte noch sagen, es betrifft auch die, das Before und, Before und After, äh, Pseudo-Element.
Aber ist eigentlich klar, wenn man drüber nachdenkt, weil das fügt ja quasi nur am Anfang des Text-Contents und am Ende des Text-Contents ein Element ein.
Äh, dementsprechend ist das auch mit abgeschnitten.
Wenn da eine Maske drüber liegt.
Aber ich dachte, ich erwähne es mal zusätzlich.
Genau, ja, in den Shownotes habt ihr dann auf jeden Fall noch die, äh, so eine kleine Erklärung, ähm, von, von, äh, MDN.
Ähm, Can I use, äh, kann ich noch kurz was zu sagen, ähm, geht in Firefox seit Version 53, wenn ich das gerade richtig sehe, äh, in Chrome mit Prefix seit Version 4.
Wow.
Das finde ich jetzt gerade verrückt.
Das, das, das, das erstaunt mich gerade selbst ein bisschen.
Ähm, also das scheint schon eine frühe Webkit-Geschichte zu sein, weil in Safari ist das auch seit Version 4 irgendwie schon mit drin.
Ähm, auch in dem neuen Edge logischerweise dadurch, aber in Chrome tatsächlich immer noch nur geprefixt mit, äh, Webkit.
Aber das habe ich getestet, das funktioniert da eigentlich auch so, wie man es erwarten würde.
Jo, äh, wollte ich dazu, äh, ja genau, es gibt auch noch ein paar Demos, die auch noch in die Shownotes kommen, so ein paar, ähm, habe ich noch so einen Blogartikel gefunden, wo noch, ähm, so ein paar Anwendungsbeispiele, was man damit noch machen kann.
Ähm, also, äh, so ein bisschen drin sind, muss ich jetzt nicht, äh, weiter drauf eingehen.
War eine schnelle Property der Woche, außer du hast noch Fragen.
Nee, nee.
Dann kann man es auch verlängern.
Nee, nee, nee, um Gottes Willen.
Ja, jetzt, äh, jetzt käme normalerweise eigentlich der Spam-Spot, aber wir haben heute was, was anderes vor.
Ich bin mal gespannt, ob das funktioniert.
Ich hab ein bisschen Angst.
Es ist, es ist quasi live, ähm, wir haben es mal, äh, ich spiel einfach mal, ich spiel mal den, den, den, den, oder sowas erst erklären und dann den Trailer, also das Intro.
Ja, wir, wir, wir erklären es vielleicht erst.
Ähm, also, ich hab, ähm, ich hab die Tage, oder ich, ich hab vor ein paar Tagen, ähm, so ein paar Sachen bei Ebay Kleinanzeigen reingestellt und unter anderem einen, äh, Bluetooth-Audio-Receiver, den ich verkaufen wollte, ähm, und hab dazu eine Anfrage bekommen, ähm, und, ähm, den Dialog, den tragen wir euch jetzt mal live vor.
Also, der Konstantin, sie liest das jetzt zum ersten Mal. Ich, ich, ich kenn's natürlich schon. Ich spreche mich und der Konstantin spricht den anderen Part. Wir nennen ihn einfach mal Horst. Ist aber auch egal, wie der andere heißt. Also, der hieß nicht wirklich Horst, der hatte einen anderen Namen.
Wenn ich das richtig sehe, dann, äh, äh, sehe, dann ersetze ich jetzt alle Rauten durch Horst.
Äh, nee, nee, nee, nee. Die Rauten, die Rauten im Text, ähm, kurz zur Erklärung, ich hab ein kleines Transkript geschrieben. Ähm, die Rauten im Text sind eigentlich nur,
dass da längere, größere Abstände sind, dass man das besser sieht. Die sind nicht, da steht nicht immer Horst.
Alles klar.
Weil dann steht, dann würde nämlich unter meinem auch immer Horst stehen.
Stimmt, okay, du hast recht. Du hast recht. Ich setze einfach Horst ein, wo ich, äh, wo es, wo es passt.
Okay.
Spam-Mail für dich.
Boop.
Hallo, ich bin bereit, Ihnen einen Betrag von 20 Euro inklusive Versandkosten anzubieten. Mit freundlichen Grüßen, Horst.
Äh, ich mach das mit meiner normalen Stimme jetzt, ähm, ja, hi, ich kann das, ich kann das, ich kann das, ich kann das Nachrichtengeräusch jetzt nicht machen.
Okay, ich bin so angespannt.
Okay, danke.
Hi, äh, 20 Euro inklusive Versand geht, äh, dann aber als Päckchen, in Klammern ohne Tracking, versichert mit Tracking, 22 Euro, passt, Fragezeichen.
Gut, ich brauche Ihren Vor- und Nachnamen sowie IBAN. Grüß, Horst.
Äh, an der Stelle eine kurze Erklärung. Ähm, ich hab, ich fand das ein bisschen krass, dass er sofort, äh, gesagt hat, jetzt gib mal hier Name und IBAN, weil wir hatten noch überhaupt nichts weiteres vereinbart.
Ähm, und bei sowas werde ich, werde ich dann normalerweise misstrauisch und guck dann, könnte das vielleicht eine Masche sein, von der ich noch nichts weiß.
Also hab ich kurz gegoogelt, ähm, und hab rausgefunden, es gibt tatsächlich eine Masche bei eBay Kleinanzeigen, ähm, wo Leute, ähm, versuchen eben IBAN und, äh, Vor- und Nachname irgendwie zu bekommen, um dann, weiß ich nicht, weiß nicht genau, wahrscheinlich versuchen die dann Geld von deinem Konto abzubuchen, ohne dass du's merkst.
Ähm, ich fand's auf jeden Fall sehr pushy, gleich in der zweiten Nachricht, jetzt gib mir mal schnell deine IBAN, weil wir hatten noch nicht mal drüber geredet, wie wir überhaupt das mit dem Geld machen wollen oder, oder, er ist auch nicht drauf eingegangen, ähm, was er jetzt für einen Versand haben will.
So, genau, also dann meine nächste Nachricht, ähm, also, ich war auf jeden Fall misstrauisch, ähm, versichert oder nicht versichert? Fragezeichen.
Wir hatten die Zahlung noch nicht besprochen, bei mir geht nur PayPal.
Sorry, leider funktioniert mein PayPal nicht. Für mich ist es besser, also Überweisung. Also, jetzt hab ich mich verlesen. So, so schlecht war's gar nicht. Für mich ist es also besser Überweisung.
Dann geht's leider nicht.
Viele Käufer und Verkäufer und Käufer wissen nicht, wie man mit PayPal arbeitet und Geld über Überweisung überweist.
Büüb.
Warum geht, warum es geht nicht über Überweisung? Ich kaufe teurere Sachen per Überweisung und aus irgendeinem Grund haben Sie Angst um Ihre 22 Euro?
Büüb.
Sind Sie von Angst beherrscht?
Büüb.
Was soll ich tun, wenn ich wirklich kaufen möchte? Haben Sie Angst, per Banküberweisung zu verkaufen?
Büüb.
So, jetzt ganz kurz. Das kam jetzt einen Tag später. Ich hab nicht mehr reagiert. Und einen Tag später kam dann quasi wieder die erste Nachricht sozusagen, weil dann ist er plötzlich wieder freundlich geworden.
Hallo. Und wie haben Sie Ihre Meinung zur Zahlung geändert? Ich kann Ihnen sofort Geld überweisen. Mit freundlichen Grüßen.
Horst. Das war's. Vielleicht fand auch nur ich das lustig. Aber mein Moneyquote war, sind Sie von Angst beherrscht?
Ja, krass. Also, ich nenne das immer manuellen Spam, nenne ich sowas. Das ist, also, wenn es E-Mails sind, auch im Posteingang, die nicht offensichtlich einfach solche Massen-E-Mails sind, ja, sondern wo schon jemand dahinter steckt, wo du merkst, okay, der fragt auch mal irgendwie nach einem Tag nach und so.
Also, ich fand's super krass, dass der sehr, sehr schnell eigentlich, der ist so super pushy geworden. Und das ist ja eigentlich schon frech, wie der mich da angeschaut hat. Sind Sie von Angst beherrscht? Und hast du jetzt ja Angst um deine 22 Euro? Naja, ich will halt nicht Geschäfte machen mit einem, der mich verarschen will. Ganz einfach.
Ja, und auch dann dieses 20 Nachrichten dann hinterher schicken, weil du nicht reagierst und so. Also, sehr dubios das Ganze.
Ich hatte da auch mal eine Anfrage zu einer Anzeige von einem Musikinstrument, was ich verkaufen wollte bei Thomann. Die haben sich auf Englisch gemeldet und dann hab ich hinterher auch rausgefunden, dass das so eine Masche ist, die die da fahren.
Ja, also, da gibt's eine Menge. Also, wenn euch was komisch vorkommt bei irgendwelchen Verkäufen, dann vielleicht, bevor ihr irgendwie schnell antwortet, erst mal googeln, ob das nicht vielleicht irgendwie eine komische Masche ist, die da versucht, einer mit euch abzuziehen.
Hatte ich jetzt schon mehrfach, bin zum Glück nie drauf reingefallen. Vielleicht meint das ja wirklich nur gut, ich fand's einfach komisch.
Ja, so, äh, Trailer.
Hier ist WWS IV mit dem Tagesthema.
Ja, wir haben jetzt noch gleich die Stunde, die erste Stunde voll und kommen schon zum Thema. Mensch.
Ja, und wir setzen das ...
Ja, eigentlich hab ich den anderen erwartet, aber macht nix. Wir können noch ein Thema.
Ja, wir hatten, ich hab das Outro von, ja, egal.
Egal.
Das kommt nächstes Mal. Das kommt nächstes Mal am Anfang oder so.
Genau. Wir können es nachher als Outro nutzen für, weil wir ja immer noch nix haben für, äh, bevor das Ende kommt.
Hm.
Also da hatten wir das Geilteil rückwärts, aber egal. Wir quatschen schon wieder.
Ähm, genau. Wir kommen zum Tagesthema und das Tagesthema ist, oh, Überraschung, äh, die Fortsetzung von Teil 1 von letzter Folge.
Also es geht auch wieder um CSS-Wünsche, um Features, die es noch nicht gibt.
Und, äh, unser erster Punkt hier ist Container-Queries.
Das war tatsächlich was, was relativ schnell aus der Pistole geschossen kam, als wir auf Twitter da gefragt haben.
Ähm, kam gleich, äh, ja, Container-Queries.
Ähm, möchtest du da was direkter zu sagen?
Äh, ich kann mal sagen, was damit eigentlich gemeint ist.
Ähm, also gerade in der modularen Web-Entwicklung, also wenn ich, ähm, jetzt nicht irgendwie eine Seite als Seite baue, sondern irgendwie kleine Module, die ich am Ende zusammenstecken möchte, kommt man immer mal wieder an den Punkt, wo man, äh, wo man gerne Responsiveness eingebaut hätte, aber modulbasiert.
Also wirklich nur, dass das Modul im Prinzip, ähm, sich anpasst an den, an den Platz, den es bekommt, äh, im Layout.
Und das kann ja durchaus mal unterschiedlich sein, wenn ich so ein Modul habe, das kann mal irgendwie 1000 Pixel breit Platz haben und das kann halt auch irgendwie mal 300 Pixel breit Platz haben.
Und dann möchte ich vielleicht darauf reagieren können.
Ähm, und so wie Media-Queries, äh, bei Media-Queries kann ich ja, ähm, auf dem Body quasi schauen und sagen, äh, der Body ist jetzt gerade so breit, ähm, oder er ist jetzt gerade so breit.
Und darauf kann ich reagieren und bei Container-Queries wäre das dann quasi für den Container meines Moduls.
Also, dass ich sage, ja, ähm, Section, äh, Sidebar, äh, ist jetzt irgendwie der Container und soll irgendwie, äh, was weiß ich, irgendwelche Elemente, die innen drin sind, sollen sich anders anordnen ab einer bestimmten Breite von dieser Sidebar.
Ähm, genau, also das ist jetzt so als, als ganz einfaches Beispiel. Hast du vielleicht noch ein anderes Beispiel oder ein besseres Beispiel?
Beispiel nicht, aber vielleicht wird es klarer, wenn man sich anguckt, was, was für eine Syntax, äh, man verwenden könnte.
Ähm, da habe ich mal geschaut, was ist das, oder da gibt es so verschiedene Vorschläge, wie man das umsetzen könnte.
Also das eine wäre, du hast einen Selektor, also Punkt Elements, sage ich jetzt mal, äh, dann Doppelpunkt Media und Klammer auf und dann eben, wie ich, wie ein Media-Queries schreiben würde, äh, Max-Width 600 Pixel zum Beispiel.
Ja, das heißt, wenn dieses Element, das ich mit dem Selektor ausgewählt habe, eine Maximalbreite von 600 Pixeln habe, dann verhalte dich so und so.
Das wäre ein möglicher Vorschlag, finde ich eigentlich gar nicht so doof.
Ähm, und die andere Idee, die da in den Raum geworfen wurde, war Nesting, also, äh, verschachtelte Queries, ähm, und alles, was, was verschachtelt ist, ist dann im Scope, äh, des umgebenden Elements, beziehungsweise des Selektors.
Da finde ich, wir haben Nesting schon bei diesen Prä-Prozessoren wie LES oder SAS, äh, und so weiter, das hat schon so eine, so eine Syntax als Entwickler.
Ähm, das dann jetzt umzumodeln auf, auf Media-Queries, hm, äh, fände ich nicht so gut, zumal man ja vielleicht tatsächlich irgendwann mal in der zukünftigen CSS-Version vielleicht, äh, Nesting haben möchte.
Da, das fände ich nicht gut, das jetzt irgendwie für, für zwei verschiedene Sachen zu nutzen. Also, da gefällt mir das mit dem Media doch deutlich besser.
Ja, das mit dem Media, das gefällt mir eigentlich auch von den vorgeschlagenen Möglichkeiten am besten. Ähm, bist du da auch auf diesen Artikel von dem, ähm, Philipp Walton gestoßen? Äh, Ingenieur?
Weiß ich gar nicht mehr, ich hab mir jetzt da keinen, keinen Link notiert.
Ähm, Responsive Components is a solution to Container Queries Problem. Das ist, glaub ich, so der Artikel, auf den man da stößt, wenn man da ein bisschen tiefer sucht.
Der hat, ähm, der hat, ähm, der hat einen Vorschlag gemacht, äh, das mit JavaScript zu lösen und, äh, sagt auch, dass das sehr performant sei. Ähm, dazu kann ich vielleicht noch kurz was sagen.
Also, er sagt auch, ähm, am liebsten wäre ihm eine CSS-Möglichkeit, das zu machen. Ähm, aber so lange, bis wir das haben, hab ich halt hier mal was gebaut.
Und er hat da auch so ein paar Demos, ähm, die ich, die ich ganz schick finde. Da kann man so ein bisschen hin und her schieben. Äh, tun wir auch in die Shownotes. Ähm, und der hat halt so eine Möglichkeit geschaffen, dass er
abhängig davon, ähm, wie viel, wie breit ein Element ist, und das wird mit dem, äh, Resize Observer, äh, in JavaScript dann, äh, performant berechnet, ähm, setzt er dann Klassen, die so, äh, auf das Element, die sowas heißen, wie, äh, MD für Medium und so weiter. Ähm, warte mal, wie heißen, wie heißen die anderen, bevor ich jetzt hier, äh, genau, SM für Small, Medium, ähm, und dann gibt's, glaub ich, noch Large oder so. Genau, also kann man dann aber auch selbst vergeben, also der hat da so ein paar Standard, äh, Größen definiert, kann man aber auch
selbst vergeben für jedes einzelne Element, ähm, was für Klassen das bekommt, bei welcher Größe. Ähm, und das kannst du dann quasi in CSS direkt verwenden, also das heißt, letzten Endes, ähm, die einzige Dom-Änderung, die stattfindet, ist eben, dass Klassen hinzugefügt werden auf die Elemente.
Und der hat das, äh, glaube ich, auch so gebaut, dass das, äh, wenn er dann noch, äh, eine Mutation-Observer-Geschichte in JavaScript dazu baut, ähm, dass, das dann auch, äh, das bei dynamischen Seiten
funktioniert, wo Elemente dynamisch hinzugefügt, äh, oder entfernt werden. Oder auch mal vielleicht die Größe ändern, das soll ja auch vorkommen.
Jo, also das, das finde ich, ähm, also das, auf seiner, auf seiner Demo wirkt das alles ziemlich fluffig und schnell. Ich hab das jetzt noch nicht
eingesetzt, ähm, das wäre aber was, womit ich irgendwie leben könnte, wenn ich das umsetzen wollte jetzt, oder wenn ich das jetzt
wirklich, äh, hart brauchen würde. Ich hab jetzt leider keine besseren, keine besseren, äh, bessere Möglichkeit gefunden als das. Und diese, ich hab mich dann, weil sowas
frage ich mich jetzt seit unserer Houdini-Folge immer, kann man das nicht mit Houdini? Ähm, ähm, ja, gute Frage. Da bin ich, äh, zu, nicht tief genug, äh, drin in Houdini, aber, äh, wenn ich das richtig
verstanden hab, äh, kannst du damit, äh, eigentlich alles machen. Wahrscheinlich nicht jetzt gleich in den, das waren ja so verschiedene, ähm, Levels, in die das
aufgeteilt war. Wahrscheinlich jetzt nicht gleich mit den ersten Modulen von Houdini, die da, äh, auf den Markt kommen, wenn sie
denn mal kommen, ähm, aber mit Sicherheit mit diesen tiefer greifenden, wenn ich das richtig verstanden hab, kannst du damit
alles machen. Ja. Also du definierst sie ja quasi per JavaScript, das heißt, warum solltest du nicht dann darin wieder
einen, einen, äh, Media Observer, ähm, irgendwie benutzen? Ja. Also Media, äh, was sag ich, Media Query, sag ich, Media Query,
das gibt's ja schon ewig, äh, hab ich zum ersten Mal, glaub ich, gesehen auf einer Konferenz 2010 in Action Media Queries, ähm, ich erinnere mich noch, äh, an einen geschätzten Kollegen, der damals auf der Bühne stand und sein Handy, sein iPhone, glaub ich, damals in der Hand hielt und dann eine Seite gebaut hat, äh, die, wenn man sie gedreht hat, dann einen anderen Text angezeigt hat, irgendwie so hochkant und Querformat oder sowas.
Und alle haben, alle haben, alle haben, ja genau, das war die Reaktion im Publikum, wow, das war damals auch wirklich krass.
Das war vor zehn Jahren. Also, äh, ich hab das jetzt ja schon so ein bisschen etabliert, wenn ich was von dem Browser herstellen will, dann komm ich ein bisschen näher zu euch und sage,
Container Queries, einbauen.
Aber, aber, aber, sag ich.
Gut, hast du noch was dazu?
Sonst?
Nö, nö.
Kann man zum nächsten.
Äh, Background Opacity.
Das hatte ich tatsächlich, äh, letztens den Fall, dass ich ein Bild in den Hintergrund setzen wollte, ich weiß gar nicht mehr, ja doch, ist auch egal, also ich wollte ein Bild in den Hintergrund setzen, ich wollte das aber transparent haben.
Und, das geht nicht.
Also, ich hab echt, ich hab gedacht, nee, das kann doch, also, da hab, das kann doch nicht sein, dass das nicht geht, also, da muss ich doch was übersehen haben, irgendein Attribut, das ich nicht kenne, irgendein Property, ähm, das muss doch gehen.
Also, es geht mit Farben, klar, mit RGBA-Notation, ähm, es geht, wenn ich dem Hintergrundbild die Opacity mitgebe, das heißt, äh, entweder eine PNG-Grafik, die natürlich dann riesig ist, entsprechend, oder, was auch so ein Trick ist, den man anwenden kann, wenn man große Bilder, vor allem Fotos, äh, mit Alpha-Kanal haben will, ein SVG nehmen, in dem dann der Alpha-Kanal drin ist, und, äh, das Bild an sich ist trotzdem JPEG.
Da aber das JPEG dann als Base64 in dem SVG drin ist, ist das natürlich auch entsprechend groß, das heißt, das SVG sollte man dann möglichst vom Server mit Gzip ausgeben lassen, ähm, das heißt, es ist immer ein bisschen größer noch als das JPEG, aber es ist nicht so groß in der Regel wie ein PNG, wobei man da aber auch echt abwägen muss, also, manchmal ist das JPEG mit Alpha-Kanal im SVG trotzdem größer als PNG.
Also jedenfalls, es kann doch nicht sein, dass ich, dass, dass das so, nur so umständlich geht. Also ich meine, klar, die andere Möglichkeit ist, ich mache ein Pseudo-Element oder ein Extra-Element, äh, und positioniere das dann, aber da ist dann wieder das Problem mit dem Positionieren, ja, es ist halt viel einfacher zu sagen, ähm, Background-Size-Cover oder Background-Size-Contain, als jetzt da wieder irgendwas mit Min-Height und Max-Height und Min-Width und 100% und Auto und, und was weiß ich, und, ähm, also, das ist für mich so rudimentär, das, das wundert mich echt.
Da gibt's auch was, ja, du kannst, äh, Image-Elemente jetzt auch quasi so, genau, Object-Fit, ähm, hab ich auch eingesetzt schon und, ja, natürlich, das geht, aber warum, warum soll ich das überhaupt müssen? Also, gut, wenn's jetzt wirklich eine Grafik ist, die halt auch, äh, Thema Accessibility, ähm, ähm, ja, wenn die jetzt accessible sein soll, wirklich als Grafik vorhanden sein soll, okay, ja, wenn's aber wirklich jetzt eine Hintergrund-Grafik ist, die völlig wurscht ist, also, die wirklich nix zur Sache tut, eigentlich nur Schmuck ist,
dann möchte ich die einfach mit Opacity in den Hintergrund legen können. Gibt's aber nicht. Ja. Gibt nicht. Und, also, Background-Opacity, einfach wie, wie normale Opacity, ja, warum nicht?
Muss man sich auch mit Houdini basteln, vielleicht.
Ja, ja, hätte ich, äh, äh, bastelt das doch mal schwer mit Houdini.
Du wirst, du wirst, du wirst wieder Abnehmer dafür haben. Äh, ja, äh, kann ich auch nicht verstehen, ich hab jetzt grad nochmal nachgeschaut, äh, ja, also, ich hätte wahrscheinlich jetzt tatsächlich, äh, das, das extra Element eingebaut und, äh, ich glaube,
Gott, jetzt darf ich, äh, weiß ich nicht, ob ich jetzt zu viel verrate, ähm, das Bild auf unserer Homepage vom Podcast ist auch ein extra Element mit Hintergrund, aber das ist nicht, das ist nicht transparent.
Nee, nee, da ist auch schon, also, da ist so ein transparenter Overlay, aber das ist auch im Bild drin, ja.
Und das hatte aber auch, ich weiß nicht mehr genau, warum, ich kann's nicht mehr auswendig sagen, aber das hatte auch einen Grund, dass das ein extra Element ist, das ist, hab ich auch nicht gemacht.
Klar, das BG, ähm, aber hat auch kein Object-Fit, also, das hat, ähm, das ist auch ein extra Element, aber wiederum mit einem Background-Image und dann halt Background-Size-Cover.
Also, dieses Object-Fit hab ich im Einsatz tatsächlich bei unserer, äh, Firmenwebseite, also 48design, äh, .com, ähm, da kommt das an diversen Stellen zum Einsatz und da hab ich das auch das erste Mal benutzt, also, das ist wie Background-Size im Endeffekt nur für, ähm, ja, Bild-Elemente.
Ich glaub, ich weiß gar nicht, äh, also, Picture-Element, äh, geht auch, ähm, Video, ähm, weiß ich jetzt gar nicht, ob das auch Object-Fit, doch, müsste aber eigentlich Object-Fit auch unterstützen.
Aber können wir mal, wir verlinken auch mal, ähm, hier Object-Fit, trage ich mir auch mal gleich ein, dass wir da, äh, auf die Specs verlinken.
So.
So, genau, ähm, das war's eigentlich von mir auch schon zu dem, zu, zu, zu, zu Background-Opacity.
Ja, dann kommen wir doch gleich zum nächsten, ähm, und das ist, äh, was von mir wieder, oder das hab ich auf die Liste geschrieben, und zwar hätte ich gern multiple, äh, Orgasmen, nein, multiple Pseudo-Elemente.
Ja, kann ich dir nicht helfen.
Ja, das ist schade.
Äh, multiple Pseudo-Elemente, also, ihr kennt wahrscheinlich, äh, before und after Pseudo-Elemente, also, ähm, Elemente, die ich an Elemente, innerhalb dranhängen kann, wo dann, ähm,
Ich weiß nicht, was, was ist denn, was ist denn eigentlich der ursprüngliche Gedanke dafür gewesen, so Anführungszeichen oder sowas, oder?
Ähm, ja, schöne Anführungszeichen, ähm, weiß ich nicht, was derjenige, der sich gedacht hat, wir müssen das unbedingt in die Speck aufnehmen, was der sich dabei gedacht hat, aber, ja, irgendwie an Text halt vorne was, oder hinten was dranhängen zu können, was, ähm.
Also, ich hab immer mal wieder den Fall, wo ich denke, mir reichen die zwei Pseudo-Elemente, before und after, pro Element nicht aus, ich hätte gerne noch mehr.
Und ich hab dafür auch, äh, vielleicht eine komisch aussehende Syntax schon im Sinn, ich hätte gerne Doppelpunkt before, Doppelpunkt before, Doppelpunkt before, so oft ich das eben machen will, ähm, oder Doppelpunkt after, Doppelpunkt after und so weiter, ähm.
Um einfach mehrere von denen zu haben, ich kann jetzt gar nicht sagen, ob da irgendwie aus Specksicht irgendwas dagegen spricht, oder ob das dann mega kompliziert wäre.
Vermutlich eher aus, äh, Rendering- und Performance-Sicht könnte ich mir vorstellen, dass das so der, ja, der ausschlaggebende Punkt ist.
Ja gut, aber ich meine, ich darf ja auch, äh, unendlich viele Dom-Notes, äh, haben.
Ja, ja, also ich versteh's auch nicht, es hat bestimmt Gründe.
Und HTML-Verschachtelung darf auch unbegrenzt sein, warum soll ich nicht, äh, unbegrenzt Pseudo-Elemente haben dürfen?
Also, falls du, Browser-Hersteller, mir das sagen möchtest, warum das nicht geht, äh, dann sag's mir, aber ansonsten bitte, hätte ich das gerne.
Obwohl, ähm, ich glaub, wir kommen später noch, das hab ich in, äh, in unseren Notizen schon gesehen.
Wir kommen zu einem Anwendungsfall, ja, ich hab überlegt, ob ich das jetzt schon sag, aber ich hab dann tatsächlich ein Geilteil draus gemacht, ähm.
Ja, dann lassen wir es, dann lassen wir es.
Ja.
Wir sagen nur, es gibt noch, äh, wir kommen noch zu einem Anwendungsfall und einer Seite, die ich auch ziemlich geil finde, also passend, ich glaube, beim Geilteil, ne?
Mhm.
Ähm, genau, da, dafür wäre das auch sehr gut.
Übereignet.
Ähm, ja, wie gesagt, ich glaub, da kann man nicht, nicht mehr dazu sagen, äh, hätte ich einfach gerne.
Haben ist besser als brauchen, wie ein, äh,
Haben ist besser als brauchen, danke schön, Oliver.
Wie ein gemeinsamer Kollege zu sagen pflegte, ja.
Ich glaub, man kann auch mal, danke, Oliver, das ist wirklich pure Weisheit.
Ist auch bei mir in den absoluten Sprachgebrauch übergegangen, dieser Sprache.
Ja, absolut, bei mir auch.
Ähm, genau, und dann, äh, würde ich schon zum nächsten springen, ähm, und das nächste ist auch, äh, eine, eine Submission oder etwas, was im Gespräch mit einem Kollegen,
äh, rauskam, mit dem, der das Bier spendiert hat.
Jetzt bin ich ins Mikrofon gestoßen, das war bestimmt ein furchtbares Geräusch für den Hörer.
Ähm, und zwar hätte der gerne Previous Sibling.
Also so wie der Plus-Operator, so next Sibling, hätte der gerne Previous Sibling.
Und ich hab dann kurz drüber nachgedacht und hab überlegt, was wär denn jetzt so ein klassischer Anwendungsfall dafür.
Und mir ist tatsächlich sehr schnell was eingefallen. Ähm, nämlich so, der, der, der Klassiker ist irgendwie bei Formularelementen, ähm, dass ich irgendwie, ich hab ein Label und danach kommt ein Input.
Und jetzt möchte ich vielleicht, wenn das Input Invalid ist, mit dem Label irgendwas machen. Das soll dann irgendwie anders aussehen, das soll dann irgendwie einen, äh, einen roten Rahmen kriegen, eine andere Textfarbe, was weiß ich.
Und da wär's ja geil, wenn ich einen Previous Sibling Selector hätte und das nicht irgendwie anders verschachteln müsste, ähm, um, äh, um da das dann anzuzeigen.
Ich glaub, es geht mit Focus Within, mit, mit diesen, diesen Fall kann ich, glaub ich, mit Focus Within auch abfackeln, aber das wär auch cool, wenn es da eine andere Möglichkeit gäbe. Also, es gibt bestimmt noch mehr Anwendungen.
Ja, ich glaub, du hast, du hast bei den, äh, Kommentarformularfeldern auf, äh, unserer Seite, da hattest du auch irgendwie gekämpft mit den Labeln und so. Und ich glaube, da wäre das auch hilfreich gewesen.
Also, Previous Sibling ist wahrscheinlich das gleiche, äh, Problem, das man hat mit Parent, wie mit Parent.
Genau, das sehe ich nicht, ja.
Und zwar geht's immer nur in eine Richtung, nämlich nach unten, beziehungsweise nach rechts. Es geht nie in die andere Richtung, es geht nie zurück.
Und das hat halt auch wieder Gründe, ne? Also, das ist halt die, das, das Rendern, wir haben das ja schon mal, hatten das auch verlinkt, ähm, dieses, diese, ja, dieses Video, diese animierte Grafik, wo man gesehen hat, wie denn die Rendering-Engine von, äh, Firefox das zusammenbaut.
Also, dass die halt echt dann guckt, okay, das Element hat die Werte und dann spannt sich das so auf und dann wird das so nach und nach aufgebaut.
Und wenn ich jetzt halt wieder zurück muss, dann muss ich halt eventuell wieder was verändern, was ich eigentlich schon festgeschrieben hab und so.
Also, mir ist schon klar, warum diese Restriktion besteht, aber es wäre halt trotzdem nice to have.
Absolut. Ähm, und bei der Recherche danach bin ich auf was gestoßen, ähm, wie man das vielleicht, äh, mit schon spezifizierten Dingen vielleicht in der Zukunft lösen kann.
Ich sag ganz bewusst in der Zukunft, weil das Feature, was ich euch jetzt sage, das ist, ähm, bei Can I Use ist es gelistet, es ist ein Working Draft und es ist komplett rot.
Ein Browser ist da dabei, der irgendwas davon schon könnte. Ähm, und zwar ist das Has.
Ähm, und mit Has, äh, das hat ein, ein finniger, äh, Stack Overflow-Nutzer, ähm, bemerkt, könnte man sowas machen wie, ähm, Previous Sibling, Doppelpunkt Has, in Klammern, Next Sibling.
Mhm.
Somit könnte ich vom, vom Vorherigen, äh, vom nächsten Bezug auf das Vorherige nehmen und das damit selektieren.
Aber wie gesagt, also das wäre CSS Selectors Level 4.
Das ist eigentlich, das ist ja echt geschickt, weil das eben genau diese Geschichte, dass ich halt nur immer von oben nach unten, vom Großen ins Kleine komme, das würde das ja nicht wirklich aushebeln, sondern ich würde halt zu dem Zeitpunkt dann gucken, obwohl es eigentlich vielleicht noch nicht an der Reihenfolge wäre, vom, vom Rendering-Prozess her, was hab ich denn für, für Child Notes und ist der denn vorhanden?
Das ist eigentlich echt geschickt.
Genau, genau, genau, genau.
Ja, wie gesagt, leider, leider ist das noch weit weg von Implementierung und ich, warte mal, ich kann mal gerade ganz kurz live da auf den Link klicken, da ist nämlich ein Link dabei, nämlich MS Edge Status, da gibt es ja eine Seite von, äh, ah, toll, na super, jetzt weiß ich auch nicht mehr.
Ja, genau, genau, es gibt ja von, von Microsoft so eine Seite, ähm, wo die einzelnen Features aufgelistet werden, also das ist dieses, ähm, Microsoft Edge Plattform Status, ähm, und dann wird, äh, gesagt, ja, ab welchem, ab welcher Version ist welches Feature denn, äh, vorhanden oder ist es denn schon vorhanden oder noch nicht oder wird da schon dran gearbeitet?
Ähm, und da steht bei, äh, Pseudoklasse has, naja, is not supported, äh, oh Wunder, in keinem Browser und ich sehe da auch nicht, dass irgendwie da stehen würde, dass da dran gearbeitet wird oder sonst irgendwas, ist einfach nicht supported, also da ist, keine Ahnung, also das scheint doch, ja, scheint doch eher ein Ding zu sein, ein größeres.
Aber das Schöne ist ja, jetzt, wo wir eigentlich nur noch Evergreen Browser haben, äh, wobei ich den Safari aktuell noch mal noch dazu aus, äh, klammern möchte, der ist so ein bisschen der neue IE, hab ich das Gefühl, aber es geht ja in der Regel jetzt relativ schnell, also wenn mal einer von denen, äh, aufspringt, ähm, entweder Firefox oder, oder Chromium, äh, mit der Blink Engine, dann ist das eigentlich relativ schnell überall drin.
Ja.
Also schauen wir mal, vielleicht kommt's ja doch schneller, als man denkt.
Ach, vielleicht, vielleicht müssen wir auch einfach mal anfangen, noch ein bisschen mehr Code in die Arktis zu schaufeln, indem wir einfach Pull-Requests stellen bei Mozilla und damit hätten wir das dann auch schon, wir müssen es einfach nur implementieren, ich mein, es ist ja easy, oder ich glaub, ist das, äh, ist das C++ oder C, oder?
Ja, ja, ich glaube, äh, ich weiß nicht, in was die Rendering Engine geschrieben ist, aber man kann's auf GitHub bestimmt schnell rausfinden.
Ich will das gar nicht.
Ich will nicht.
Also, in fünf Jahren ist es bestimmt Rust.
Ja.
So lange dauert die Migration, wenn überhaupt, also, vielleicht dauert's auch noch länger.
Keine Ahnung, ich weiß es tatsächlich nicht.
Äh, ich meine aber, das ist irgendwie schon so, so was C-mäßiges, glaube ich, äh, meine ich mal gehört zu haben.
Gut, also, äh, Has ist am Horizont, aber gibt's noch nicht und, äh, bitte einbauen.
Dankeschön.
Jo.
Next.
Äh, next.
Ja, text, text, text heißt, äh, fit.
Kannst du dich, warte mal, stopp, stopp, stopp, kannst du dich noch, äh, jetzt müssen wir noch kurz, äh, jetzt mein Gehirn, was das wieder für Sachen macht.
Ähm, es gab mal so eine MTV-Sendung, die hieß Next, glaube ich.
MTV Next, ja.
Kennst, kennst du das noch?
Oh, du ist, äh, hab ich, glaube ich, nicht so wirklich antifiziert.
Oder so ein Typ, ja, also es ist so eine, so eine Dating-Show gewesen, ähm, da steht dann so ein, so ein Mädel oder so ein Typ, ähm, und dann kommt so ein Bus, jeweils mit dem bevorzugten, äh, Geschlecht, also für, für, äh, für Beziehungen oder so, ähm, und dann steigt da einer nach dem anderen aus, und dann stellt die halt so drei, vier Fragen oder er, und jedes Mal, wenn irgendwas kommt, äh, was ihm oder ihr nicht passt, ähm, sagt die Person halt, next, und dann kommt, dann muss der gehen, und dann kommt der nächste aus dem Bus raus.
Okay.
Und manchmal, und manchmal, ähm, glaube ich, war das so, dass dann am Ende gar keiner irgendwie, äh, mit, bis, das bis zum Ende durchgehalten hat, und dann gab's halt einfach nichts mehr, war halt, ja, also das zunächst.
Ja.
Das, äh, könnt ihr, könnt ihr überspringen.
Zu spät, jetzt, jetzt, jetzt, jetzt haben sie ja schon gehört.
Egal.
Ähm, gut, ja, ich glaub, Text, Size, äh, Fit, Box, ich glaub, da musst auch du was dazu sagen.
Ja, ich hab das einfach mal so genannt.
Ich glaub nicht, dass das irgendwie, äh, offiziell irgendwie so heißt.
Ähm, ich kann mal beschreiben, welchen Effekt ich damit meine.
Ähm, ich weiß auch nicht, ob das bei den aktuellen, ähm, iPhones noch so ist.
Früher beim iPhone, ähm, bei dem, bei dem, äh, bei der Telefon-App war das so, dass, wenn man eine Nummer getippt hat, du tippst eine Nummer, und die wird immer länger, und es kommen immer mehr Zahlen dazu.
Und irgendwann ist nicht mehr genug Platz auf dem Display, dass, äh, dass die, dass die komplette Nummer hinpasst.
Und in dem Augenblick wird der Text kleiner, sodass er immer noch komplett hinpasst in das umgebende Element sozusagen.
Mit jeder dazu, äh, dazugekommenen Ziffer wird's dann immer ein Stückchen kleiner.
Genau, es ist ein schmaler Use-Case, das geb ich zu.
Aber geil wär's, wenn's das als CSS-Eigenschaft gäbe, irgendwie Font-Size-Fit-Container oder irgendwie sowas.
Und dann kannst du noch sagen, und dann möchte ich noch sagen, wie viele Zeilen das sein sollen.
Wollte ich grad sagen, ja, das wird dann doch ein bisschen komplexer.
Und dann, genau, und das, das wäre dann, das fände ich dann irgendwie ziemlich cool, wenn du, wenn du das, äh, wenn du die Textgröße so anpassen könntest, dass er, dass er perfekt in den Container passt auf so viele Zeilen, wie ich definiere.
Ja, wäre, wäre auf jeden Fall witzig. Also, ja, generell für Formulare auch, Kontaktformulare, wo dann irgendwie, du willst nicht gleich so Riesenplatz reservieren für die Felder, für die E-Mail-Adresse oder so, und dass das dann automatisch passiert wird.
Also, ich hab das, glaub ich, auch schon gesehen, dass das dann halt mit JavaScript entsprechend umgesetzt wurde, dass da geguckt wird, wie breit ist das und so.
Ja, wär, wär, wär auch wieder halt einfach so nice to have.
Ja, ich hab, ja, ist wirklich nice to have. Das ist, das ist nix, wofür ich jetzt nah ans Mikrofon müsste.
Ich hab diverse Möglichkeiten gesehen, wie das umgesetzt wird. Und ich weiß nicht, ob da in meinem Browser was kaputt war, aber alle Demos, die da mit JavaScript gebaut waren, und es gab auch eine Idee, das mit, äh, mit SVG zu machen, fand ich eigentlich auch cool.
Keine davon, das waren alles Code-Pen-Demos, keine davon war so dynamisch, dass ich den Text dynamisch ändern konnte und sich das automatisch angepasst hat, sondern die waren alle so, dass der Text, der mal drinsteht, dass es auf den dann passt.
Also nicht, ich kann jetzt noch mehr Nummern hinzufügen und das Ding, äh, dann wird der Text irgendwie kleiner.
Challenge-exacted.
Ja, nein, da gibt's garantiert irgendeine Umsetzung, vielleicht war da auch bei mir irgendwie in den Demos was kaputt.
Mich hat's gewundert, dass das da überall nicht funktioniert hat.
Äh, ich kann mir aber, also ich kann mir eigentlich nicht vorstellen, dass das nicht irgendjemand schon irgendwo umgesetzt hat.
Also, falls ihr sowas habt, bitte gerne in die Kommentare.
Bin ich sehr interessiert dran.
Dann kann ich nämlich irgendwie meine Kollegen nerven mit so fancy, fancy schmancy Text rumgedönse.
Gut, äh, mehr hab ich dazu auch nicht.
Dann kommen wir, glaub ich, zu unserem letzten.
Letzter oder vor der Zeit, wir gucken mal, wie viel Zeit.
Wir haben jetzt schon fast eineinhalb.
Ja, ich glaub, wir lassen den letzten weg und machen den dann irgendwann bei Punkt drei.
Aber ich glaub, den dritten Teil werden wir nicht in der nächsten Folge machen, sondern mal dann doch wieder was anderes zwischendurch.
Aber wie dem auch sei, äh, ich, ich wusste nicht so ganz, wie ich das bezeichnen sollte.
Ich hab's jetzt mal Scroll-Hooks oder Viewport-Hooks genannt.
Und, ähm, mein Use-Case wäre, wenn ich, man sieht das ja immer, immer häufiger, wenn man irgendwie rumscrollt und dann ein Element zum ersten Mal in den Viewport gescrollt wird,
dass dann irgendwie irgendwelche Icons kurz so aufplöppen oder reinfliegen von mir aus wie in so einer schlechten PowerPoint.
Ähm, aber dass einfach irgendwas passiert zu einem Zeitpunkt, wo ich irgendwo hinscrolle.
Und natürlich ist das aktuell mit JavaScript gemacht, obwohl es ja eigentlich, also es ist ja nicht viel.
Ich muss, es geht ja wirklich nur darum, erkenne, sobald das Element, äh, in den Viewport kommt und mach dann was, verändere das Element irgendwie.
Und, ähm, das wäre halt schön, das direkt in CSS machen zu können und entsprechende Animations oder Transitions irgendwie laufen lassen zu können.
Und ich hab mir überlegt, wie man das, also ich hab, ich hab dazu gar nicht so viel gefunden.
Ich wusste jetzt auch gar nicht nach, was ich so genau suchen soll.
Ähm, jedenfalls hab ich geguckt irgendwie halt nach, äh, Element, Enters Viewport, ähm, ähm, äh, Apply CSS oder so.
Also, und da kam irgendwie nicht viel, nicht das, was ich so im, im, äh, im, im Hirn habe, wenn ich da dran denke.
Und, äh, ich hab mir überlegt, wie könnte die Syntax aussehen.
Also, das wäre irgendwie, ähm, Doppelpunkt Viewport Enter und Doppelpunkt Viewport Leave zum Beispiel, könnte ich mir vorstellen.
Und dann halt irgendwie, äh, dass dann da eine Animation gestartet wird.
Oder, dass man da eben halt sagen kann, nur beim ersten Mal, entweder dann in Klammern hintendran eine Eins, wobei ich da nicht weiß, ob das Sinn macht, dass man da irgendwie dann das zwei- oder dreimal machen lassen will.
Aber vielleicht, äh, Doppelpunkt First, äh, Viewport Enter und First Viewport Leave, wäre so meine Idee, wie man das machen könnte.
Ich weiß nicht, ob das jemals schon mal jemand so gedacht hat, äh, wie gesagt, nicht viel dazu gefunden, aber ich fände das cool, sowas nicht wieder mit JavaScript machen zu müssen.
Also, ich will eigentlich, ich mag JavaScript, ja, aber ich möchte eigentlich solche grafischen Sachen und was halt mit Styling zu tun hat, das möchte ich eigentlich nativ in CSS lösen können.
Ja, kann ich total verstehen. Also, ich mein, letzten Endes wäre das dann, äh, eine Pseudoklasse, so wie, so wie Hover eben, also irgendein bestimmtes Event passiert, in dem Fall Viewport Enter, ja, kann ich mir sehr gut vorstellen.
Vielleicht gibt's da noch mehr Sachen, also, was man halt eben mit Scrolling oder je nachdem, ob's nach oben gescrollt wird oder nach unten gescrollt wird zum Beispiel, könnte ich mir vorstellen.
Oder vielleicht, also generell vielleicht solche Hooks, solche Events, ja, dass man, äh, gut, da macht man aber halt vielleicht einen Riesenfass auf, ja, also native Swipe-Events in CSS zum Beispiel.
Ach, also, das wäre doch echt ein Ding.
Also, äh, dann geht's dann auch wieder, es gibt x JavaScript-Libraries und dann ist es teilweise vielleicht doch verbuggt und dann funktioniert das irgendwie auf iOS nicht.
Ach, das will ich filmen und das haben.
Und dann musst du irgendwie Distanz messen und dann vielleicht hat der User das aber auch nur aus Versehen gemacht.
Das, da möchte ich mich ja eigentlich nicht, gar nicht mit befassen müssen und das vor allem nicht in JavaScript machen.
Also, das ist was, das, aber, okay, ja, gut, ähm, ich glaub, so Basis, so Basis-Events gibt's ja, die sind mittlerweile im Browser, also, JavaScript seitlich eingebaut, aber so, äh, Swipe, glaub ich, oder, oder irgendwie so Pinch, das gibt es nicht.
Das musst du, glaub ich, immer selbst rein implementieren, oder?
Das ist, also, im Browser, ich glaube, in so, in so richtigen mobilen Betriebssystemen ist das ja mit drin, ne?
Ja, ja, klar.
Geh ich, äh, geh ich, geh ich jetzt gerade schwer davon aus, ich hab jetzt noch keine Native-App gebaut, aber ich kann's mir eigentlich nicht anders vorstellen.
Ja, warum das nicht auch? Also, wär ich großer Fan, nur, das ist dann, ja, aber das Fass, das du damit aufmachst, ist tatsächlich wahrscheinlich ein größer.
Ja, es verwischt halt tatsächlich so die Grenzen zwischen CSS und JS so ein bisschen, ja, also ich verstehe, warum vielleicht jemand sagt, nee, das, da verwehren wir uns dagegen, dass das passiert in CSS, aber es ist halt irgendwie, ja, also, es ist halt, der Anwendungsfall ist jetzt nicht so selten, sondern das sind schon häufigere Sachen und warum sollte man das nicht direkt in CSS machen können, ohne dafür jetzt wieder ein zusätzliches Request für eine JavaScript-Datei und, äh, Performance und was weiß ich, also.
Ich bin dafür.
Sehr gut, sind wir schon mal zwei.
Bauen wir morgen, bauen wir morgen einen Firefox ein. Nachdem du C gelernt hast, kannst du das ja jetzt machen.
Gut, ähm, ja, ich glaube, wir lassen den, lassen den, äh, letzten Punkt weg, oder?
Wir lassen den, wir lassen den letzten Punkt weg und wir sagen euch auch nicht was.
Wir machen das bei, bei Folge 3, den nächsten Punkt, den wir jetzt noch hätten.
So, was ich jetzt gerade noch geschaut habe, ist, ähm, in was für einer Sprache die, äh, Firefox-Engine geschrieben ist, ist das eigentlich immer noch Gecko?
Ähm, nee, wie heißt sie denn, ähm ...
Ah, warte mal, Moment.
Äh, äh, hier, ich hab's doch erwähnt vor, vor einer Folge oder zwei.
Aber 57, das ist nicht mehr Gecko-Lautopädie? Ähm, äh, äh, äh, ach doch, weil so in 850 sind.
Wenn du es jetzt sagst, dann, dann denke ich, ja, klar. Äh, äh, ich hab's erwähnt letztes Mal.
Äh, äh, äh, äh, äh, äh, warte mal, Version 57, 14, nee, das kann nicht sein.
Das kann nicht sein. Nee, ich, äh, ich, äh, ich sehe es hier jetzt gerade auf den ersten Blick nicht.
Ich wollte nämlich mal nachgucken. Also, die Gecko-Engine ist auf jeden Fall in C++ geschrieben.
Ähm, vielleicht hilft dir das ja.
Nee, hilft mir nicht.
So, HTML-Renderer. Ach, Wikipedia ist wirklich toll.
So, Servo. Nee.
Es gibt so viele komische.
Quantum, Mozilla, National Project Quantum.
Ach, ist, äh, ist ja auch, eigentlich ist das ja auch egal.
Ist egal. Also, Gecko ist in C++ geschrieben, der, der Nachfolger ist.
Wenn er in was Neuerem geschrieben ist, dann ist er bestimmt in Rust geschrieben.
Behaupte ich jetzt einfach.
Könnt ihr uns korrigieren, weil wir wissen ja eh nix, wir reden ja nur drüber.
Äh, von, ist, äh, ich glaube es, ich merke, ich merke schon, es wird jetzt, wir sind jetzt schon wieder an dem Punkt, ne?
Wir sind jetzt schon wieder an dem Punkt, wo wir jetzt eigentlich aufhören sollten.
Aber ihr seid noch nicht entlassen.
Nee, nee.
So schnell nicht. Also, eine halbe Stunde machen wir noch.
Mindestens.
Also, ich glaube, ich, ich glaube, ich komme durch Mainz relativ schnell durch, aber.
Ja, Mainz ist auch nicht so, bei mir ist es auch nicht so viel.
Aber, ähm, wir quatschen ja immer wieder zwischendrin und schweifen ab.
Also, wir kennen uns doch.
Ich wollte noch abschließend sagen zu dem Thema, wenn du nichts noch sonst zum Thema hast.
Nö, ich hab nichts mehr.
Also, man merkt so, auch schon letzte Folge, und auch jetzt gerade eben habe ich es ja eigentlich schon genau gesagt,
Ähm, es geht immer darum, bei diesen CSS-Features eigentlich JavaScript so ein bisschen zu minimieren
oder zusätzliche unsemantische Elemente zu minimieren.
Und da möchte man ja eigentlich hinkommen, dass man nur noch semantischen Code im Markup hat.
Das wäre schön, aber ich glaube, das wird so schnell nicht passieren.
Ja, mir geht es auch noch um was anderes.
Also, das auf jeden Fall auch unterschreibe ich so.
Mir geht es auch darum, dass es für, äh, sag ich mal, ähm, unterschiedliche Implementierungen von bestimmten Dingen,
die unterschiedlich stabil, Entschuldigung, stabil laufen auf unterschiedlichen Systemen,
Ähm, dass es dafür Standard-Implementierungen gibt.
Standard-Implementierungen, die einfach immer funktionieren, wo ich mir keine Gedanken mehr drüber machen muss,
wie ich jetzt meinen Swipe oder meinen Pinch oder sonst irgendwas, ähm,
Das, das funktioniert in dem Browser dann einfach, weil es mit eingebaut ist.
Also, es ist genau so, ich glaube, der Klassiker ist irgendwie Drag-and-Drop.
Ja.
Drag-and-Drop war lange, ein komplett kleinseitiges, also eine komplett selbstgeschriebene Geschichte mit JavaScript
und dann gab es irgendwann eine Drag-and-Drop-API. Ich weiß gar nicht, heißt die so? Drag-and-Drop-API?
Auf jeden Fall, damit funkt...
Ja, keine Ahnung.
Wir haben doch gar keine Ahnung, Fabian ist das Zeug.
Ja, Sachen, auf die wir uns nicht vorbereitet haben, haben wir keine Ahnung von.
Und Sachen, auf die wir uns vorbereitet haben, haben wir auch keine Ahnung von.
Ähm, nee, aber das wurde irgendwann standardisiert, spezifiziert und jetzt gibt's ja irgendwie standardisiertes Drag-and-Drop
und das funktioniert, glaube ich, seitdem auch vernünftig.
Und dann musst du nicht mehr irgendwie überlegen, hab ich jetzt die richtige Drag-and-Drop-Library genommen
und muss ich die jetzt updaten oder irgendwie so ein Käse, sondern du kannst halt einfach damit Sachen machen.
Und das ist, also, das ist ja auch eine Bewegung, die ist eigentlich seit, seit die Standards ein bisschen schneller entwickelt werden,
als alle fünf Jahre kommt ein neuer Browser raus.
Ähm, ist das ja auch immer das Ding gewesen, dass eben solche Sachen, ähm, in, in Browser irgendwann eingebaut werden.
Es dauert nur meistens länger, äh, als man möchte.
Und manchmal ist es so, dass das dann irgendwie eingebaut wird und dann denkt man so,
ach stimmt, vor fünf Jahren hat man sowas noch gebraucht.
Ah, jetzt ist es fertig, jetzt brauch ich's nicht mehr.
Jetzt will ich was anderes Geiles machen.
Das heißt, wenn, äh, wenn, wenn dein, wenn dein, ähm, wie hast du das genannt?
Ähm, deine, deine Scroll-Viewport-Hooks, wenn die dann eingebaut sind, dann denkst du, ah ja, jetzt ist aber was ganz anderes irgendwie hip, das will ich gar nicht mehr machen.
Wer scrollt denn heute noch?
Da ist dann der Trend irgendwie zu Seiten, die sich, äh, wie so alte Flash-Seiten, wo dann alles in so Kästchen, ja, keine Ahnung.
Ich frage mich ja schon seit über zehn Jahren, wann übernimmt 3D das Web? Und das ist immer noch nicht passiert.
Web-Chain, ja, da kommen wir dann wieder zurück zur Folge, jetzt muss ich mal ganz langsam reden, damit ich schnell die Folgenummer nachgucken kann.
Ähm, Folge Nummer drei, äh, ist das noch Frontend oder kann das weg? Äh, nachhören, wenn noch nicht geschehen.
Da geht's um 3D unter anderem.
Genau. Äh, ich hab ja eher gedacht an, also das geht ja mittlerweile, man kann ja mittlerweile, ähm, äh, CSS,
äh, mit CSS, äh, HTML-Elemente im 3D-Space ausrichten, aber ich glaube, sowas wie, ich mach da jetzt mal einen Würfel hin,
ist, glaub ich, immer noch relativ kompliziert, weil du den dann selbst zusammenbauen musst.
Ja, hab ich auch schon mal gemacht, ja, ist nicht so schön.
Also, äh, ich glaub, jetzt sind wir schon weit genug abgeschwufen.
Juuuut, dann.
Vielleicht kommen wir zum ...
Das Geiltein.
Geiltein.
Das war der Special Move.
Aha.
Aber wir müssen eigentlich, wir müssen das eigentlich mit Video machen, also eigentlich,
viel Witziges bleibt, glaub ich, verborgen, weil wir hier ...
Dieses Schitzi hier hat sowohl eine Recording-Funktion als auch eine Streaming-Funktion,
aber live dürfen wir sowas auf keinen Fall machen.
Nee, nee, nee.
Ähm, gut, übergehen wir das einfach.
Ähm, wer will denn anfangen mit seinem Geiltein?
Äh, du hattest ... Also, mir ist es egal. Wir könnten aber sagen, du hattest das letzte CSS-Thema, dann fang ich mit dem Geilteil an.
Gerne.
Ähm, wobei meins ... Das hat eigentlich überhaupt gar nichts mit Technik zu tun. Es war nur so ein ...
Ähm, es war so ein verrückter Moment, den ich hatte und den wollte ich jetzt einfach mal teilen.
Ähm, und zwar ...
Ähm, ist es so, ich mache ja auch ab und zu mal Musik oder habe viel Musik gemacht und ich höre gerne Musik und auch sehr aufmerksam und ich habe da auch mittlerweile keine Berührungspunkte mehr, was irgendwelche Genres angeht.
Also, ich höre momentan viel Popmusik. Ähm, einfach weil ... Weil ich, ich habe große Freude an guten Produktionen, an Sachen, wo ich das Gefühl habe, meine Kopfhörer müssen mal so richtig was leisten, so in alle möglichen Richtungen.
Also, so eine richtig geile Produktion. Ähm, und ich bin, ähm, einfach, also mein, ähm, mein Streaming, mein Musik-Streaming-Dienst hat mir halt irgendwelche Popmusik, neue Sachen empfohlen und da war ein Song dabei von Katy Perry.
Ähm, und zwar, ähm, Never Really Over. Das ist relativ neu, glaube ich noch. Und ich habe, ich habe den gehört und dachte so, das ist ja eine geile Nummer.
Und, äh, immer, immer, wenn ich so ein, so ein Song höre und denke, das ist ja eine geile Nummer. Also, ich finde, ich fand halt irgendwie, das hat, das hat, das Ding hat mich so richtig mitgenommen.
Also, so, so, so, so irgendwie ein geiler Groove und ich habe, ich habe den in Dauerschleife gehört. Ich konnte den hundertmal hintereinander hören und der ist mir nicht langweilig geworden. Ich fand den einfach gut.
Ähm, und wenn, wenn ich, wenn das passiert, ähm, dann normalerweise ist der nächste Schritt dann, dass ich gucke, wer hat den produziert? Weil, ich meine, ja, klar, Katy Perry hat bestimmt da irgendwas dran mitgemacht, aber heutzutage in der Popmusik ist es oft so, da steht irgendein bekannter Produzent dahinter.
Der, der den Song geschrieben hat oder oft sind es auch richtig ganze Kollektive, manchmal zehn, fünfzehn, zwanzig Leute, die an einem Song mitgeschrieben haben.
Ähm, und ich habe, äh, vielleicht noch kurz zur Erklärung bei, ah, Konstantin, ja?
Ich höre schon, ja.
Achso, du, ja, Konstantin, du denkst gerade ab.
Ja, ich bin, ich bin mal gespannt, was du sagst. Ähm, äh, der, der Link, äh, zu dem Song und zu dem Video kommt auch noch, äh, in die Shownotes.
Ähm, also, was ich da mache, ist, ich gucke, wer hat das Ding geschrieben? Ähm, und, äh, komischerweise, ganz oft bei Popmusik, äh, wenn ich ne geil, wenn ich einen geilen Song finde, kommt raus, Max Martin hat ihn geschrieben.
Und, ähm, der steht auch diesmal in der Produzentenliste dabei, aber es steht halt noch jemand anderes dabei, nämlich Zett.
Und dann dachte ich mir, Zett, Zett, keine Ahnung, wer ist denn Zett? Äh, und dann habe ich rausgefunden, dass Zett aus meiner Heimatstadt Kaiserslautern stand.
Ach!
Ähm, und mittlerweile, und, und, es ist komplett an mir vorbeigegangen, muss ich sagen, der hat, der hat, der hat Musik gemacht, der hat Musik produziert für Lady Gaga, für Justin Bieber, äh, und eben für Katy Perry, und der hat auch einen, äh, Song produziert, äh, für Ariana Grande, und das war 2013 schon, der hat schon ein Grammy gewonnen.
Ja, der ist ne richtig dicke Nummer im Popgeschäft.
Auslauter.
Der hat irgendwie ne, ne Million, der hat ne Millionenvilla in Los Angeles, da kannst du dir irgendwie auf YouTube angucken, und das ist halt einfach ein Typ aus Kaiserslautern, der irgendwie ein bisschen jünger ist als ich, und das finde ich wahnsinnig beeindruckend.
Also, mein Geilteil diese Woche ist Zett, und, äh, wir können, äh, mal dieser eine Song, aber der hat noch ganz viele andere geile Nummern, also, wenn man, wenn man Pop oder auch, äh, was, was er viel macht, EDM, wenn man dem nicht abgeneigt ist, äh, der macht richtig, ich finde, der macht richtig geile Produktionen, und man merkt auch an seinen Produktionen,
Das ist nicht nur einfach uffz, uffz, uffz, sondern man merkt, ähm, der hat ne musikalische Ausbildung, also der weiß, was er da tut, der hat irgendwie Klavier, äh, gelernt im Alter von vier Jahren, und hat auch irgendwie mal Schlagzeug, äh, gespielt in einer Metalband, und man merkt, dass das ein richtig guter Musiker ist, das ist nicht einer, der einfach nur, äh, an seinem Laptop Samples zusammenklickt, solange bis es irgendwie halb, halbwegs gut klingt, sondern der weiß, was er da tut, und ich finde, das merkt man in der Musik.
Und, äh, davon war ich jetzt einfach irgendwie diese Woche so begeistert, dass das mein, mein Geilteil der Woche ist.
Cool.
Genau.
Und wir können ja in den Sommer reinhören.
Ja, wir haben ja gesagt, das muss nicht immer, muss nicht immer technisch sein, das Geilteil.
Nee, genau.
Also, ich bin, ich bin begeistert von Set, ich bin Fan, und, äh, seitdem ich weiß, dass, dass er, äh, aus meiner ursprünglichen Heimatstadt stammt, und ich dachte ja, da kommt nur schlechter Fußball her, und irgendwie, äh, ich weiß gar nicht, was, was gibt's denn, was gibt's denn aus Kaiserslautern noch, da ist ein Opel-Werk, aber Opel ist jetzt auch aus Kaiserslautern.
Und, äh, halt, die Amis kommen aus Kaiserslautern.
Die Amis da halt, äh, sitzen, und dass es da noch so Diner gibt, und, äh, ja, also, das verbinde ich so mit Kaiserslautern.
Ja, und da gab's auch mal ein Autokino, vielleicht gibt's das auch noch.
Ähm, also, äh, ich sag's mal so, wenn man, wenn man aus Kaiserslautern kommt, dann ist das für einen erst mal die Welt, und wenn man da weggeht und was anderes sieht, dann denkt man sich, aha, Kaiserslautern.
Und deswegen ist Set auch mit gutem Grund jetzt in Los Angeles.
Genau.
Mein Geilteil der Woche Set.
Gut, dann mach ich zum Ausgleich.
Ähm, jetzt auch wieder was Technisches, und wir bleiben auch beim Thema CSS, haben wir ja vorhin schon kurz angekündigt, und zwar sind, ähm, gleich zwei Seiten.
Einmal css-art.com, äh, da gibt's so Basteleien mit purem CSS, also grafische Basteleien, also, äh, Porträts, ähm, Gemälde, also zum Beispiel ganz oben die Mona Lisa, äh, mit purem CSS, ähm, oder irgendwelche Gesichter.
Ähm, aber teilweise wirklich, also fast schon fotorealistisch, ähm, oder zumindest so, so, so, so, animationsfilmmäßig, ähm, gemacht.
Also wirklich richtig Hammer-Sachen, ähm, wird auf jeden Fall in den Show Notes natürlich verlinkt, äh, was gibt's noch hier, ja, wie gesagt, äh, Gemälde, äh, eine Violine hier zum Beispiel gebaut, alles aus, aus CSS, ähm, Anweisungen, ja, also, das ist ein Diff und dann manchmal noch, noch Before- und After-Element und manchmal, äh, mit verschachtelten Elementen, manchmal auch ohne.
Und dann wirklich nur mit, ähm, mit irgendwelchen Outlines und Bordern und, äh, Gradients und schlag mich tot.
Ähm, also wirklich echt cool und beachtlich, was da teilweise auch mit Animationen und so weiter erzeugt wird.
Und, äh, wenn man das auf die Spitze treiben will, dann macht man das, wie gesagt, mit einem einzigen Diff-Element.
Ist nicht immer möglich, weil dann einen das natürlich doch sehr einschränkt und das wäre eben auch, ähm, der Anwendungsfall für diese mehreren Pseudo-Elemente, Before und After, äh, dass man da eben verschiedene verketten kann und dann käme man immer auf jeden Fall mit einem Diff-Element auch tatsächlich zu Potte.
Ähm, und Lynn Fischer betreibt die Seite a.singlediff.com und hat dort eben solche, solche Beispiele und solche Basteleien, wo sie wirklich ein einziges Diff benutzt und das ist einfach nur krass, was sie damit rausholt.
Also unbedingt mal anschauen, mal durchscrollen, ähm, wird auch öfter mal aktualisiert und, äh, ist einfach der Hammer.
Also zum Beispiel dieses, äh, Gefährt von einem Elektro-Auto-Hersteller, ohne den Namen jetzt zu nennen, dieses komische, zackische, dass da ja auch teilweise belächelt wurde und, äh, schon ein Beam wurde.
Äh, auch das mit CSS nachgebaut und halt, wie gesagt, alles in einem einzigen Diff und ich hab dann, ich hab das schon länger.
Ja, ich muss mal kurz, ich muss mal kurz einhaken, äh, du musst mal deine, ähm, deine E-Mail-Adresse bei CodePen verify, damit ich dein, dein Pen in Full-View, Page-View sehen kann.
Habe ich, habe ich das nicht gemacht, tatsächlich?
Das ist witzig, so eine Meldung hab ich noch nie gesehen.
Ja, verrückt, aber warum muss ich das, ähm, das muss ich machen, damit du das angucken kannst.
Ähm, dachte ich eigentlich, hätte ich gemacht, äh, ja, guck ich mal, bevor wir die Sendung veröffentlichen, dass ich das mache.
Jedenfalls hab ich schon lange mal gedacht, äh, müsste man eigentlich auch mal, ähm, versuchen, was zu basteln, aber mich hat so ein bisschen abgeschreckt, ich bin halt kein, kein Grafiker, also Grafik ist jetzt nicht so meine Welt und, äh, deswegen hab ich gedacht, brauch ich eigentlich erst gar nicht versuchen, aber, äh, ich hab dann gesehen, dass auch ganz viele, die sowas basteln, sich halt einfach eine Grafik in den Hintergrund legen und dann versuchen, das nachzubasteln.
Und auf der Basis hab ich dann tatsächlich, äh, mal versucht, sowas zu machen, bin aber schon daran gescheitert, tatsächlich nur ein Diff-Element zu benutzen.
Also ich hab am Schluss, äh, tatsächlich, es gibt ein, ein Root-Diff-Element und, äh, zwei, also dann jeweils ein Diff nochmal drin und da drin nochmal ein Diff.
Ähm, ich meine, wahrscheinlich, wenn man sich richtig gut auskennt, also, ähm, hier, äh, Lynn Fischer hätte das vermutlich auch in einem Diff hinbekommen, ich bin dran gescheitert.
Aber wer sich's mal angucken möchte, ich hab da auf, auf, äh, CodePen was gebastelt, ich habe, äh, Baby Yoda aus, äh, The Mandalorian nachgebaut und ich muss sagen, also, ich, ich bin schon ein bisschen stolz, dass ich das so hinbekommen hab, ja, auch wenn, wenn auch mit, mit, mit drei Elementen statt nur einem, ähm, aber es ist doch so annähernd, annähernd geworden, wie ich mir das vorgestellt hab.
Ähm, ja, ich hab noch ein paar Verbesserungsideen, wie man, wie man da noch was machen könnte, aber so im Großen und Ganzen, äh, hat es Spaß gemacht, das mal zu machen und das schult einfach so ein bisschen,
äh, äh, ein, wie man, wie man mit wenig Diff-Suppe grafisch groß was bewirken kann mit CSS und auch wirklich keine Grafiken braucht für, für irgendwelche Verläufe und selbst für irgendwelche ausgefallenen Formen, also
echt erstaunlich, also ich hab natürlich vorher angeguckt, wie machen das andere, ich hab jetzt die Techniken dazu jetzt nicht erfunden, ähm, aber das war eben, dass man multiple, äh, Radial Gradients im, im Background-Property zum Beispiel benutzt oder was ich ganz interessant fand, ähm, dass man, äh, Box-Shadow-Property vergewaltigt, um, um zum Ziel zu kommen.
Also das war echt mal spannend, das zu machen, hat Spaß gemacht und, äh, kann ich eigentlich nur empfehlen, das selber mal zu versuchen, so ein bisschen was zu basteln.
Vielleicht nehme ich das eine oder andere mit tatsächlich, äh, so ins, ins Interface-Design, äh, statt da irgendwelche Rapper außenrum zu bauen oder so, ein bisschen, ein bisschen rumzuspielen und sich, sich einfach Elemente zu sparen.
Erinnerst du dich noch an unser Rock, Paper, Scissors, Lizards, Spock?
Ja.
Dass wir mal angefangen und die fertig gemacht haben, ja.
Ja, da ist mir grad eingefallen, also ich, als ich deinen Baby-Yoda gesehen habe, ich hab, ich hab, äh, nicht viele Versuche unternommen, äh, mit CSS irgendwie was zu zeichnen oder irgendwelche Bilder zu machen, aber das ist, glaub ich, so einer, einer der okayen Versuche, die ich da mal gemacht hab.
Übrigens, ähm, ich finde deinen Baby-Yoda so gut, ich würde, ich würde mal an deiner Stelle, ähm, ein bisschen Fame damit, äh, versuchen zu kriegen.
Ich werd's, ich werd's twittern, sobald die Folge, äh, ausgestrahlt ist, ja.
Twitter das mal und erwähn mal den CodePen-Account, mach den mal auf CC mit da drauf, die retweeten dann sowas ganz gerne, das machen die.
Also wenn das, wenn das, was du machst, irgendwie ein bisschen halbwegs vernünftig aussieht, ähm, dann featuren die das.
Ah, okay.
Das, das, das passiert dann.
Schreib ich mir mal auf.
Also, ich hab grad gesehen, das Ding hat jetzt gerade drei Views, wahrscheinlich sind das wir beide.
Ja, das dürften wir sein, ja.
Genau, also ich, ich glaube, also das, das hab ich schon ein paar Mal gemacht, ich hab ja mal so ein, ähm, so ein Player gebaut, oder diese, diese, diese Playing Animation, falls du dich erinnerst, für die, wo wir sind, ist Vorne-Seite, ähm, mit diesen, mit diesen Balken, die so hoch und runter gehen.
Und, äh, das hab ich da auch, äh, bei denen, äh, irgendwie auf CC mit, äh, hey, CodePen, schaut mal.
Und die haben das dann entweder getweetet oder das war, glaub ich, sogar gefeatured dann.
Also, und dann haben das irgendwie, äh, warte mal, ich kann mal gucken, wo ist denn das?
Das hat dann irgendwie 800, äh, Views bekommen oder so, warte mal, wo haben wir's?
Ja, genau, da ist es.
Äh, 1300 Views hat das dann mal eben so bekommen und 56 Herzen, nur, dass, dass ich die bei Twitter mal eben erwähnt hab.
Also, das kann ich dir auf jeden Fall empfehlen.
Cool, ich glaub, ich hab mir jetzt auch zur Idee gekommen, ich, äh, werde so eine kleine Challenge, äh, vielleicht auch starten.
Äh, die Challenge, make this a single div.
Also, wer schafft es da tatsächlich ein Diff rauszumachen, äh, mal gucken, vielleicht kann ich ja Lynn Fischer auch noch irgendwie, äh, attacken.
Mal gucken. Äh, ja, mal gespannt.
Äh, also, wenn, wenn's jemand von euch schafft, ähm, das in einem Diff nachzubauen, ähm, gerne her damit, würd mich interessieren.
Cool. Dann, äh, mach das mal.
So und ...
Ich hab mal Rock, Paper, Scissors, Lizards, Bock noch, äh, verlinkt.
Äh, das ist sogar ein bisschen animiert.
Ähm, hast du erinnert mich?
Ach so, nicht das Spiel, äh, du hast, äh, ich weiß nicht, wer's sogar gebastelt hast.
Es geht um, es geht um eine CSS-Animation auf CodePen, ich hab's dir mal eben kurz geschickt noch, ähm, wo du auch dann auswählen kannst, wie die Hand gerade aussehen soll.
Äh, mit dem, mit dem, äh, Lizard hab ich mir ein bisschen schwer getan.
Vor allem, weil man die Hand eigentlich immer von oben sieht, ähm, ja, genau.
Sorry, der gute Lösung.
Ja, das könnt ihr euch da mal hingucken, das ist jetzt, wir sind ja ein Audio-Podcast und das ist was zum Angucken, aber der Link ist in den Shownotes, das könnt ihr euch mal anschauen.
Also, das ist, ich hab versucht, eine mit CSS und HTML-Elementen, und das bin ich, da bin ich weit davon entfernt, irgendwie nur ein Element, äh, verwendet zu haben.
Ich hab wirklich für jeden Finger von der Hand ein eigenes Element genommen.
Also, ich glaube, Hände sind ja auch immer so die, das ist so die Königsdisziplin, glaube ich, auch beim Zeichnen.
Also, ganz viele Leute, die zwar eigentlich gut zeichnen können, die scheuen, glaube ich, Hände.
Weil das irgendwie immer so ein Ding ist, das sieht ganz oft komisch aus.
Und dafür finde ich, also, jetzt mal den, den Lizard jetzt vielleicht mal vorgenommen, aber ansonsten finde ich die, finde ich die Hand eigentlich sehr cool, äh, stilisiert und, und gut gelungen.
Ja, sie bewegt sich auch ein bisschen komisch, geh mal von Rock of Paper, die Finger werden einfach länger.
Ja, weil die ausklappen, das ist doch klar.
Ja, natürlich, die klappen aus, das sieht man so ganz einfach.
Wenn du das 2D siehst, dann werden die einfach länger.
Macht schon so.
Genau.
Danke, dass du mir erklärt hast, dass das vielleicht doch gar nicht ganz scheiße ist.
Gerne.
Ego boosten kann ich.
Gut.
Ja, dankeschön.
Sind wir dann jetzt tatsächlich am Ende?
Ja, wir haben es geschafft und wir sind unter zwei Stunden.
Wow.
Wir sind echt jetzt, wir haben, wir haben extrem viel retro gelabert und das ist dank Telekom und Vodafone, wollte ich nochmal betonen, nur deswegen, die sind schuld.
Und dann tatsächlich nur eine Dreiviertelfolge, Thema und Geilteil zusammen und Property.
Ja, wir haben einfach nichts zu sagen gehabt, offenbar.
Ja.
Vielleicht nehmen wir die Folge, wir haben nichts zu sagen.
Nein, wir wissen schon, wie die Folge heißt, wussten wir jetzt diesmal schon vorher.
Und die heißt halt Teil 2.
Sonst hätten wir uns immer hinterher einladen.
Wir hatten ja schon Teil 1, jetzt heißt sie halt Teil 2.
Genau, dann bleibt uns.
Dann kommen wir jetzt, dann spielen wir jetzt.
Das Outro, das vorhin vergessene Outro ist jetzt unser Trenner zu unserem Endgeschwafel.
Das hast du sehr gut gemacht.
Danke, danke.
Ja, einmal pro Folge muss der Quatsch sein.
Dann bleibt uns noch.
Euch nochmal aufzufordern, natürlich.
Und ich weiß, das wird irgendwie nervig und die überspringt das jetzt wahrscheinlich schon alle, aber die, die es hören, die hören es ja vielleicht jetzt zum ersten Mal.
Bewertet uns in Podcast-Portalen.
Natürlich nur gute Bewertungen, alle anderen werden wir löschen, sofern das geht.
Teilt uns auf Social Media, wir freuen uns, also wir haben da so ein paar, bei der letzten Folge so ein paar Retweets bekommen, das hat uns sehr, sehr gefreut, wenn ihr die Post zu unserer, zu unserer aktuellen Folge jeweils teilt.
Das freut uns sehr.
Das hilft uns sehr, dass wir weitermachen können und dass wir irgendwie mit Freude bei der Sache sind und schickt uns natürlich Bier, ganz wichtig.
Und Oliven.
Bier und Oliven.
Und dem Konstantin dürft ihr auch Oliven schicken, über die Parkstationsadresse auf unserer Homepage.
Ja, erzählt weiter, ich meine, wenn ihr das gut findet, macht ihr das sowieso und wenn ihr es schlecht findet, dann erzählt einfach trotzdem weiter, das haben wir jetzt ja schon ein paar Mal gesagt.
Genau, und wenn ihr es schlecht fandet, dann schickt uns ungern öffentlich, lieber per DM, nein, aber schickt uns auf jeden Fall euer Feedback, also wenn ihr jetzt sagt, zwei Folgen hintereinander, das gleiche Thema zum Beispiel ist total doof und war total langweilig heute oder ihr übertreibt es tatsächlich mit eurer Retro total, das interessiert doch keine Sau und steckt lieber mehr Hirnschmalz ins Thema,
Dann sagt uns das und wenn ihr Glück habt, dann nehmen wir uns das zu Herzen und wenn nicht, dann vielleicht auch einfach nicht.
Ich wollte sagen, es kann sein, weil da muss man jetzt mal kurz sagen, das hier ist eine Veranstaltung, die soll uns beiden Spaß machen, das heißt, wenn da jetzt irgendein Vorschlag kommt, der uns keinen Spaß macht oder der uns überhaupt gar keinen Spaß macht, dann werden wir wahrscheinlich nicht drauf eingehen, aber wenn ihr konstruktive Vorschläge habt, wie wir das irgendwie besser machen können, immer her damit, wir können nicht versprechen, dass wir alles machen, wie gesagt, wir
Wir verdienen ja hier auch kein Geld mit oder so, es muss für uns irgendwie noch eine gute Veranstaltung bleiben und wenn ihr im Rahmen dessen irgendwie einen Vorschlag habt, dann immer her damit, da freuen wir uns auf jeden Fall über Feedback.
Ganz genau.
Jetzt habe ich was gesagt, wo dann am Ende kein Feedback mehr kommt, weil die sagen, die machen das ja dann eh nicht.
Nee, also es interessiert uns natürlich schon, also wenn ihr sowas sagt, dass irgendwas total doof war oder so, natürlich nehmen wir uns das dann irgendwo zu Herzen.
Wir werden halt natürlich nicht das komplette Sendungskonzept jetzt über den Haufen werfen, aber es interessiert uns einfach, also wir haben ja schon mal gesagt, wir kriegen relativ wenig Feedback, es ist schon besser geworden, aber es ist halt einfach nur, man denkt sich dann so, das gibt's doch gar nicht, sonst sind doch alle immer so schnell dabei beim Meckern.
Und ja, es kommt so wenig, also es kommt eigentlich immer so, ja, es ist cool.
Wie wir in einem Podcaster-Forum gelesen haben, müssen wir nur einfach mehr Quatsch erzählen und dann kriegen wir auch mehr Feedback, dass wir doof sind.
Gut, dann machen wir nächste Folge eine Spezialsendung zu Low-Level-Programmiersprachen.
Also ich glaube, wir haben das eh schon in unseren Ideen-Sammelsurium, dass wir mal eine Folge machen, wo wir über was sprechen, wovon wir keine Ahnung haben.
Vielleicht sollten wir das einfach mal demnächst in Angriff nehmen.
Wir tun dann aber so als ob.
Ja, natürlich, das machen wir ja sowieso.
Und zwischendurch sprechen wir dann noch eine selbsterfundene Sprache, also wir machen es dann richtig unangenehm für euch, die Folge zu hören, aber für die Leute unter euch, die die Compulsive Disorders haben, die dann nicht, die trotzdem dann alles hören müssen, also Sheldon, ich rede von dir, du musst ja alles abschließen, das heißt, wenn du eine Serie mal angefangen hast, dann musst du alle Folgen hören und für dich wird's dann richtig hart.
Aber so ist das, aber so ist das dann.
Aber jetzt ist glaube ich …
Jetzt ist der Punkt erreicht.
Ich glaube, jetzt ist der Punkt. Obwohl ich jetzt eigentlich, ich könnte jetzt eigentlich noch ein Bier trinken, habe ich gerade gedacht. Vielleicht trinke ich noch kurz.
Vielleicht trinken wir zusammen noch ein Bier. Ich habe glaube ich keins mehr.
Trinken wir zusammen noch ein Bier.
Aber damit belästigen wir jetzt nicht die Hörer und Hörerinnen und Diverse, sondern ich würde sagen, wir machen Schluss. War mir eine Freude, mal wieder, nach drei Wochen, endlich. Und ja, bleibt uns gewogen und lasst es euch gut gehen.
Ja, bis dann.
Jetzt finde ich den Knopf, ist auch noch nicht. Ja, dann reden wir doch noch ein bisschen. Nee, also macht's gut und bis zum nächsten Mal.
Ciao.