JSFiddle - React, Tailwind, and code Playground
by mischah
HTML
<h3>CodeKit – Das schweizer Taschenmesser für den Webentwickler</h3>
<p>Ein Tool für alles. CodeKit erspart einem die Kommandozeile, diverse Webapps oder einzelne Tools indem es alles was man sich als Frontendentwickler wünschen kann in einer Oberfläche versammelt. Und vielleicht sogar noch ein bisschen mehr.</p>
<p>Die Benutzung könnte einfacher nicht sein: Einfach ein vorhandenes Webprojekt hinzufügen und schon kann es losgehen. Codekit analisiert die Dateien und kann mit den folgenden Dateietypen umgehen und einem die Arbeit erleichtern:</p>
<ul>
<li><a href="http://sass-lang.com/">Sass</a></li>
<li><a href="http://lesscss.org/">Less</a></li>
<li><a href="http://learnboost.github.com/stylus/">Stylus</a></li>
<li><a href="http://jashkenas.github.com/coffee-script">Coffeescript</a></li>
<li><a href="https://developer.mozilla.org/de/JavaScript">Javascript</a></li>
<li>JPEG und PNG</li>
</ul>
<!-- > Hier kommt der Screenshot hin -->
<p><img src="http://incident57.com/codekit/images/hero-window.png" alt="Screenshot" />
Der einzige Wermutstropfen: Es ist Mac Nutzern vorbehalten und wird es laut dem Entwickler auch bleiben.</p>
<h4>Sass, LESS oder Stylus</h4>
<p>Auch ohne sich mit dem Terminal und Ruby oder Node.js anfreunden zu müssen, kann man jede dieser »dynamischen« CSS Erweiterungen einfach ausprobieren indem man sie benutzt. Codekit überwacht die Dateien und auf Wunsch wird daraus eine herkömmliche CSS-Datei generiert sobald man speichert.</p>
<p>Je nach gewähltem CSS Preprocessor hat man Einfluss auf die Kompilierung. Die Option, CSS direkt bei der Erzeugung zu minifizieren (Whitespaces und Zeilenumbrüche entfernen) ist bei allen dreien gegeben.</p>
<p>Ebenfalls besteht unabhängig vom gewählten CSS Dialekt die Möglichkeit das generierte CSS direkt im Anschluss von <a href="http://blesscss.com">Bless</a> »verarbeiten« zu lassen. Damit kann man man automatisiert die Falle des »CSS Selector Limit« von 4095 Selektoren pro CSS Datei umgehen. Dieses...