Warum ich elm-css lieber nicht verwende

import Css
import Html.Styled as H
import Html.Styled.Attributes as HA

main =
    H.toUnstyled <|
        H.section
            [ HA.css [ Css.lineHeight (Css.px 0) ] ]
            [ H.img [ ... ] [] ]

<Abschnitt>



<p>Super, Problem gelöst. Fahren Sie mit dem nächsten fort. Aber warte. Wie Josh zu Recht betont: Wenn man das Problem genau versteht, erkennt man, dass dies nicht der beste Weg ist, es zu beheben. Und das führte mich zu einer wichtigen Erkenntnis.</p>

<h2>
  
  
  Wichtige Erkenntnisse
</h2>

<p>All diese Abstraktionen, ELM-CSS, CSS-Module, CSS-in-JS, Tailwind usw., die versuchen, CSS zu abstrahieren, scheitern daran, weil <strong>sie das mentale Modell NICHT ändern</strong> Sie müssen über Styling-Probleme nachdenken. Sie machen die Verwendung von CSS auf jeden Fall bequemer, aber wenn Styling-Probleme auftreten, wird die Person, die nicht genau versteht, wie CSS funktioniert, Schwierigkeiten haben, eine Lösung zu finden.</p>

<p>Gehen Sie einen Schritt zurück und denken Sie darüber nach. Sie schreiben in diesen Technologien, denken aber in CSS. Du musst. Diese Technologien bieten keinen Wert, wenn es darum geht, grundlegende Styling-Probleme zu lösen. Wie entscheiden Sie überhaupt, wann eine Styling-Lösung besser ist als eine andere? Sie müssen die Philosophie des Webs, die Philosophie von HTML und die Philosophie von CSS verstehen. Es ist nicht alles technisch. Es gibt eine Art und Weise, Dinge zu tun, und einen Grund dafür.</p>

<p>Denken Sie so darüber nach. Angenommen, ein Entwickler tritt Ihrem Team bei, der kein CSS versteht, aber ein Elm-Experte ist, wissen Sie, besser als Richard Feldman. Sie geben ihnen eine Elm-Ansicht, die mit elm-css gestaltet ist und das Bild in einem Containerproblem enthält. Kann ihnen das Denken in Typen helfen, eine gute Lösung für das Problem zu finden? Die line-height: 0-Lösung, die wir oben in elm-css geschrieben haben, besteht die Typprüfung. elm-css hat uns nicht zu einer besseren Lösung geführt, da es typsicher ist. Nein, das Nachdenken über Layoutmodi geht dem Problem auf den Grund und führt schließlich zu einer besseren Lösung. Der einzige Weg dorthin bestand darin, in CSS zu denken, nicht in Elm. Im Grunde handelt es sich um ein CSS-Problem.</p>

<p>So sehr wir CSS auch ablehnen würden, wir müssen es noch lernen. Aber was ist mit elm-ui?</p><h2>
  
  
  Ulme-ui
</h2>

<p>elm-ui verändert Ihr mentales Modell, da Sie bei der Verwendung nie in HTML und CSS denken müssen. Das ist neu. Das ist beeindruckend. Keine der anderen Technologien, die ich erwähnt habe, schafft das auch nur annähernd. Melde mich an, ich bin verkauft. Allerdings passt es nicht ins Web. Es widerspricht dem Strich des Internets.</p>

<p>Die beiden Hauptprobleme, die ich mit elm-ui habe, haben mit Starrheit und Divitis zu tun. Es kommt darauf an, die Philosophie des Bereichs, in dem Sie arbeiten, zu verstehen und zu verstehen, was von dieser Community als Ganzes erreicht werden soll. Für z.B. elm-ui wäre wahrscheinlich großartig für native Desktop-Anwendungen. Aber im Web werden Flüssigkeit und Zugänglichkeit zu hoch geschätzt.</p>

<p>Können Sie sich in diesem Kontext vorstellen, dass diese Schaltfläche eine schreckliche Art ist, eine Schaltfläche für das Web zu implementieren? Bitte versuchen Sie zu verstehen, was ich sage. Es ist kein technologisches Problem, sondern ein philosophisches. Diese Schaltfläche ist unflexibel und unzugänglich.</p>

<h2>
  
  
  Warum ziehe ich es also vor, elm-css et al. nicht zu verwenden?
</h2>

<p>Einfach. Sie bieten Ihnen mehr Abstraktion für sehr wenig Gewinn. Ich habe mir vor langer Zeit die Zeit genommen, CSS zu lernen. Ich bin kein Experte, komme aber mit BEM und ein paar Utility-Kursen zurecht.</p>

<p>Hier ist die Sache. Ich kann jede dieser anderen Technologien sofort erlernen, wenn ein Projekt sie erfordert, weil ich weiß, wie man in CSS denkt. Diese anderen Technologien helfen Ihnen lediglich dabei, CSS auf eine andere Art und Weise zu schreiben. Ja, ich weiß, dass die Probleme, die sie lösen, echte Probleme sind, aber insbesondere in den letzten Jahren gibt es sehr gute alternative reine CSS-Lösungen.</p>

<p>CSS führt nirgendwo hin. Wenn Sie vorhaben, über einen längeren Zeitraum Websites und Webanwendungen zu erstellen, ist es eine großartige Investition, sich die Zeit zu nehmen, sich gründlich mit CSS zu befassen.</p>

<h2>
  
  
  Abschluss
</h2>

<p>elm-css, CSS-Module, CSS-in-JS, Tailwind usw. sind wunderbare Technologien. Leider entbinden sie Sie nicht von der Notwendigkeit, CSS zu erlernen und gründlich zu verstehen. Wenn Sie sich bereits mit CSS auskennen, sollten Sie auf jeden Fall diese Technologien verwenden, da sie manchmal praktisch sein können, insbesondere Tailwind, das die Erstellung von Prototypen für Benutzeroberflächen vereinfacht. Wenn Sie jedoch Schwierigkeiten mit der Verwendung von CSS haben und es insgeheim nicht mögen, denken Sie einfach daran, dass Sie Ihre Stile möglicherweise zusammen mit Ihrem Code schreiben und Spezifität vermeiden, aber CSS wird Ihnen trotzdem im Kopf herumschwirren. Allerdings wäre Ihr mentales CSS-Modell so schwach, dass jedes grundlegende Stilproblem, auf das Sie stoßen, Sie nur noch mehr hassen würde. Lassen Sie sich nicht in dieser Spirale verstricken. Lernen Sie stattdessen CSS.</p>

<h2>
  
  
  Abonnieren Sie meinen Newsletter
</h2>

<p>Wenn Sie daran interessiert sind, Ihre Fähigkeiten bei Elm zu verbessern, dann lade ich Sie ein, meinen Newsletter „Elm with Dwayne“ zu abonnieren. Um mehr darüber zu erfahren, lesen Sie bitte diese Ankündigung.</p>