\n F\u00fcr einen Entwickler entsteht alles aus Code, daher ist es nur nat\u00fcrlich, mit dem besten Bearbeitungstool zu beginnen, das Sie finden k\u00f6nnen. Komodo Edit ist f\u00fcr all das und mehr ziemlich koscher. Es ist ein netter plattform\u00fcbergreifender, mehrsprachiger Texteditor, in dem Sie Ihren Code schreiben und bearbeiten k\u00f6nnen. Oh, und er ist kostenlos.\n<\/p>\n
\n Das Tool funktioniert unter Windows, Mac, Linux\/UNIX, also kein Problem. Wir m\u00f6gen es auch wegen seiner automatischen Code-Vervollst\u00e4ndigungsfunktion f\u00fcr Sprachen wie HTML, CSS, JavaScript, Java, PHP, Ruby, Perl (f\u00fcr etwa 5 Personen auf der Welt) usw. Das ist ein intelligenter Texteditor.\n<\/p>\n
\n Bonuspunkte f\u00fcr zus\u00e4tzlichen Komfort der Projektmanager-Funktion zum Organisieren und Verfolgen von Dateien.\n<\/p>\n
\n 2 CSS 3.0-Ersteller
\n<\/h5>\n
\n \n Seien wir ehrlich, trotz allem, was Sie an CSS3 lieben, k\u00f6nnen Sie nicht anders, als es ein wenig zu hassen, wenn es darum geht, Syntax f\u00fcr Dinge wie abgerundete verdammte Kanten zu schreiben. Es ist so ein triviales Detail, um den Schlaf zu verlieren, aber Sie tun es trotzdem. Sie k\u00f6nnen sich nicht mehr als 100 neue Eigenschaften und ihre jeweiligen Pr\u00e4fixe merken. Also danke dem Herrn f\u00fcr ein Tool wie CSS 3.0 Maker.\n<\/p>\n \n Mit diesem netten kleinen Online-Tool k\u00f6nnen Sie kniffligen Code kopieren und in Ihr Stylesheet einf\u00fcgen. Es generiert Code f\u00fcr Stildetails wie Boxradien, Farbverl\u00e4ufe, Text- und Boxschatten, Transformationen, \u00dcberg\u00e4nge und Drehungen Ihrer Wahl. Es zeigt auch, welche Desktop- und mobilen Browser diese Stileigenschaften unterst\u00fctzen. Ein kleiner Vorschaubereich zeigt den Effekt, der Code kann aus der Ansichtsbox kopiert oder in einer HTML-Datei heruntergeladen werden.\n<\/p>\n \n F\u00fcr diejenigen von uns, die nicht viel Zeit f\u00fcr scheinbar banale Stildetails aufwenden k\u00f6nnen, ist dieses Tool ein Lebensretter.\n<\/p>\n \n \n \u201eBefreien Sie sich von der CSS-Pr\u00e4fix-H\u00f6lle!“ \u2013 Pr\u00e4fixfreie Einf\u00fchrungsseite.\n<\/p>\n \n Dies ist ein sachliches Werkzeug, das von einem Engel namens Lea Verou von Github gebracht wurde, um uns aus der \u201ePr\u00e4fix-H\u00f6lle“ zu befreien. Es f\u00fcgt Stylesheets in\n<\/p>\noder -Elementen ein Herstellerpr\u00e4fix (an einer Stelle, die Sie nicht sehen k\u00f6nnen) hinzu. Au\u00dferdem: Sie m\u00fcssen sich keine Gedanken \u00fcber neue\noder Elemente, \n Was ist nicht zu m\u00f6gen?\n<\/p>\n \n \n \u201eLorem Ipsum“ war viel zu lange der beliebteste Platzhaltertext. Gl\u00fccklicherweise haben wir jetzt Blokk: Die Schriftart, die dem \u201eSchmerz“ des unverst\u00e4ndlichen Lateins ein schreiendes Ende bereitet.\n<\/p>\n \n Blokk gibt Ihnen Blocktext, der als Platzhalter beim Erstellen von Mockups und Wireframes verwendet werden kann. Es versteht sich auch von selbst, dass es die weniger, \u00e4h, Web-aufgekl\u00e4rten Kunden bei Pr\u00e4sentationen nicht verwirren wird.\n<\/p>\n \n \n Bevor Icon-Fonts zu einer Sache wurden, mussten Entwickler die Hilfe von Designern in Anspruch nehmen, um skalierbare Icons zu erstellen. Die Zeit, die es brauchte, um sie zu entwickeln (was \u00fcbrigens das Erstellen, Extrahieren, Implementieren und Anpassen umfasst), grenzte an \u201eabsolut l\u00e4cherlich“. Aber dann verwandelte jemand Symbole in Schriftarten und alle lebten gl\u00fccklich \u2026 f\u00fcr die absehbare Zukunft.\n<\/p>\n \n Fontello ist ein gro\u00dfartiger Icon-Font-Generator. Sie k\u00f6nnen aus Tausenden von Symbolen ausw\u00e4hlen, ihre Zuordnung anpassen oder ihre Namen bearbeiten und sie in einer einzigen Schriftartdatei zusammenstellen. Es ist erstaunlich und es ist kostenlos.\n<\/p>\n \n Wir k\u00f6nnen Vitaly Puzrin nicht genug danken.\n<\/p>\n \n \n Aktivieren Sie das JavaScript Ihres Browsers und testen Sie, wie die von Ihnen gew\u00e4hlte Schriftart auf einer tats\u00e4chlichen Website aussehen wird.\n<\/p>\n \n Typetester ist unkompliziert. Sie k\u00f6nnen damit verschiedene Schriftarten eingeben, vergleichen und ihr Aussehen testen. Sie k\u00f6nnen auch mit Gr\u00f6\u00dfe, Tracking, Farbe usw. herumspielen, bis Sie das bekommen, was Sie wollen. Sie k\u00f6nnen bis zu 36 verschiedene Schriftarten gleichzeitig vergleichen. Stellen Sie sich vor, wie viel Zeit Sie damit sparen k\u00f6nnen.\n<\/p>\n \n Es ist ziemlich cool.\n<\/p>\n \n \n Das Codieren kann manchmal etwas erm\u00fcdend sein, aber Code-Reinigung gibt es auf Level: V\u00f6llige Langeweile. Es ist jedoch notwendig, wenn Sie Fehler vermeiden und schneller laden m\u00f6chten.\n<\/p>\n \n Dirty Markup hilft, die Zeit zu sparen, die Sie ansonsten mit interessanteren Aktivit\u00e4ten verbringen k\u00f6nnen (Bacon-Sandwich, irgendjemand?). Dieser verf\u00fcgt \u00fcber kombinierte Funktionen anderer Single-Syntax-Reinigungswerkzeuge. Wir sprechen von HTML Tidy, CSS Tidy, JS Beautify und Ace Editor. Das ist ein umfassender Reiniger.\n<\/p>\n \n Es ist eine webbasierte App zum Bereinigen und Formatieren von HTML, CSS und JavaScript. Mehr k\u00f6nnen wir nicht verlangen.\n<\/p>\n \n \n Mit diesem leistungsstarken Tool werden Sie vielleicht zu einem Wanzenkiller.\n<\/p>\n \n BugHerd folgt dem uralten Sprichwort \u201eKeep it Short and Simple, Stupid“. Es kann Kunden-Feedback erfassen, kleinere Probleme selbst l\u00f6sen und Fehler verfolgen (die Sie beseitigen k\u00f6nnen). Es spielt auch den Sekret\u00e4r und verwaltet Ihre Projekte.\n<\/p>\n \n Eine supereinfache Point-and-Click-Benutzeroberfl\u00e4che auf Ihrer Website erm\u00f6glicht es Ihren Benutzern, Probleme zu melden. BugHerd verwandelt sie in Berichte mit allen Informationen, die Sie ben\u00f6tigen k\u00f6nnten (wie die Browserversion des Benutzers). Es ist einfach einzurichten, macht Spa\u00df und bietet Funktionen wie automatische Screenshots (Browsererweiterung), direkte Links, Dateianh\u00e4nge, vollst\u00e4ndige Auswahldaten und Diskussionen.\n<\/p>\n \n Bei einem Standardabonnement von 29 $\/Monat ist das ein Haken.\n<\/p>\n \n \n Responsive Webdesign ist mehr als eine neue Modeerscheinung, denn es ist hier, um zu bleiben. Aber im Moment werden Sie fl\u00fcssige Layouts bestenfalls schwierig finden. Sie werden auch feststellen, dass Sie in eine heftige Wut geraten, wenn Sie versuchen, Ihr Layout auf verschiedenen Bildschirmgr\u00f6\u00dfen zu testen.\n<\/p>\n \n Gl\u00fccklicherweise ist Screenfly eine nette kleine Web-App, die Ihre @media-Abfragen f\u00fcr Sie testet. Sie geben Ihre URL ein und es wird angezeigt, wie Ihre Abfragen mit den Ger\u00e4teabmessungen umgehen, durch die Sie im oberen Bereich klicken.\n<\/p>\n \n Es ber\u00fccksichtigt nicht den Rendering-Unterschied zwischen Browsern, aber Sie k\u00f6nnen daf\u00fcr Browser Shots verwenden. Ansonsten ist es eine einfache, sch\u00f6n zusammengestellte Methode, um zu sehen, wie Ihre Website in verschiedenen Aufl\u00f6sungen aussieht.\n<\/p>\n \n \n Da wir \u00fcber RWD sprechen, k\u00f6nnten wir genauso gut \u00fcber Frameworks sprechen, um es zu entwickeln.\n<\/p>\n \n Die Internet-Debatte tobt dar\u00fcber, welches Frontend-Framework besser ist: Bootstrap oder Foundation? Sie k\u00f6nnen das eine oder andere verwenden. Aber Foundation steht etwas mehr im Vordergrund, wenn es um Rastersysteme, proportionale Einheiten f\u00fcr das Design (obwohl Bootstrap 4.0 Alpha zu em- und rem-Einheiten gewechselt ist), Rechts-nach-Links-Unterst\u00fctzung, Preistabellen, Touren und Off-Canvas-Navigation geht .\n<\/p>\n \n Es ist offensichtlich, dass wir Foundation bevorzugen. Es funktioniert mit SASS und CSS, ist vollgepackt mit einer ganzen Reihe von Features und generell komfortabler und flexibler.\n<\/p>\n \n Darin stimmen wir Zurb zu: Es ist ‚crazy fast‘.\n<\/p>\n \n \n Nach einem Jahrzehnt von Software, die Design vor Code stellt, gibt Adobe den Programmierern endlich einen Vorteil.\n<\/p>\n \n Diese ehrlich gesagt erstaunliche Auswahl an Tools und Diensten wurde unter Ber\u00fccksichtigung der neuen Front-End-Codierungstrends entwickelt. Sie haben uns ein ganz besonderes Vergn\u00fcgen bereitet. Edge Animate hilft Programmierern beim Erstellen von Animationen und beseitigt gleichzeitig alle Spuren von Flash. Sorry Adobe, Flash war gro\u00dfartig. Aber Animate verwendet Standard-HTML und JavaScript, und Sie wissen schon, Einheitsgr\u00f6\u00dfe \u2026\n<\/p>\n \n Es gibt Edge Code zum Bearbeiten von CSS aus einem HTML-Dokument heraus. Inspect konsolidiert Browsertests und Ger\u00e4tekompatibilit\u00e4tstests f\u00fcr responsives Design und synchronisiert sie alle f\u00fcr eine superschnelle Aktualisierung\/Anpassung. Das \u00e4u\u00dferst beliebte Typekit ist jetzt Teil der Edge-Familie. Reflow muss noch ver\u00f6ffentlicht werden, aber es wird wahrscheinlich andere Front-End-CSS-Grid-Hersteller aus dem Wasser blasen. Und es gibt noch mehr.\n<\/p>\n \n Wir wissen. Wir mussten auch unsere Kiefer vom Boden aufheben.\n<\/p>\n \n \n Vagrant ist so viel mehr als nur virtuelle Entwicklungssoftware.\n<\/p>\n \n Mit dieser Sch\u00f6nheit k\u00f6nnen Sie tragbare, leicht reproduzierbare Arbeitsumgebungen erstellen. Es konsolidiert die Virtualisierungssoftware, die Server-Basisbox und die Konfigurationstools in einem leistungsstarken Paket. Grunds\u00e4tzlich m\u00fcssen Sie VirtualBox + Ubuntu + Chef nicht mehr haben. Vagrant erledigt die Arbeit aller drei und nimmt dabei weniger Platz ein. Power-User werden Ihnen auch sagen, wie Sie damit Multi-VM-Netzwerke einfach einrichten k\u00f6nnen.\n<\/p>\n \n Es ist in Ruby geschrieben, funktioniert aber f\u00fcr PHP, Java, JavaScript, Python und C#. Sie k\u00f6nnen mit Vagrant unter Windows, Mac OSX, Linux und FreeBSD arbeiten.\n<\/p>\n \n Es ist superschnell, weil es nichts von dem U-freundlichen hat, das gut aussieht, aber den dringend ben\u00f6tigten Platz einnimmt. Es eignet sich gut als Testumgebung f\u00fcr Entwickler.\n<\/p>\n \n Das kommt dem Heiligen Gral so nah wie m\u00f6glich.\n<\/p>\n \n \n Googles PageSpeed \u200b\u200bInsights macht genau das, was es verspricht. Es gibt Ihnen Einblicke in die Front-End-Leistung Ihrer Seite. Das wird vielen hochkar\u00e4tigen Entwicklern da drau\u00dfen die Augen \u00f6ffnen. Also feiern Sie ein Glucksen und beginnen Sie mit der beschleunigten Glatzenbildung von all den Haaren, die gezogen werden sollen.\n<\/p>\n \n Es misst lediglich die verstrichene Zeit zwischen: Anforderung und Rendering von Inhalten ohne Scrollen sichtbar und Anforderung und Rendering der ganzen Seite.\n<\/p>\n \n Es pr\u00fcft die netzwerkunabh\u00e4ngigen Aspekte, um die Leistung Ihrer Seite zu berechnen: Serverkonfiguration, HTML-Struktur, JavaScript, CSS und Bilder.\n<\/p>\n \n Es ist messerscharf und gnadenlos schnell; Es wird also definitiv Ihre Gef\u00fchle verletzen und Sie m\u00f6glicherweise zum Weinen bringen, wenn Sie eine niedrige Punktzahl erzielen. Es wird auch versuchen, dies auszugleichen, indem es Ihnen gezielte Vorschl\u00e4ge zur Verbesserung Ihrer Leistung macht, wie ein herablassender Elternteil.\n<\/p>\n \n Und wir lieben es.\n<\/p>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844581a0a86.webp\")
<\/a>\n<\/p>\n\n 3 \u2013 Pr\u00e4fix-frei
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844583d44dd.webp\")
<\/a>\n<\/p>\n.css()<\/code>die Pr\u00e4fixe von jQuery oder \u00c4nderungen machen, die Sie vornehmen, da es alles abdeckt.<\/p>\n\n 4 Block-Pfund
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445861b498.webp\")
<\/a>\n<\/p>\n\n 5 Fontello
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445880da58.webp\")
<\/a>\n<\/p>\n\n 6 Typpr\u00fcfungen
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384458ad95f3.webp\")
<\/a>\n<\/p>\n\n 7 Schmutziges Markup
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384458e305ed.webp\")
<\/a>\n<\/p>\n\n 8 BugHerd
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844590dfd3c.webp\")
<\/a>\n<\/p>\n\n 9 Fliegengitter
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844592db210.webp\")
<\/a>\n<\/p>\n\n 10 Stiftung
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459574e29.webp\")
<\/a>\n<\/p>\n\n 11 Adobe Edge
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-63844597e33a5.webp\")
<\/a>\n<\/p>\n\n 12 Landstreicher
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459a1429e.webp\")
<\/a>\n<\/p>\n\n 13 PageSpeed-Einblicke
\n<\/h5>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459ca2be9.webp\")
<\/a>\n<\/p>\n\n 14 Git
\n<\/h5>\n
![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-6384459f578c6.webp\")
<\/a>\n<\/p>\n![\"\"](\"https:\/\/inform.click\/wp-content\/uploads\/2022\/11\/post-327128-638445a2c069a.webp\")
<\/a>\n<\/p>\n