Back to Question Center
0

Die besten JavaScript-Frameworks, Bibliotheken und Tools für 2017            Die besten JavaScript-Frameworks, Bibliotheken und Tools für die Verwendung in 2017 Related Semalt: ES6Node.jsAngularJSReactnpmMore ... Sponsoren

1 answers:
Beste JavaScript-Frameworks, Bibliotheken und Tools für 2017

Es scheint, dass es mehr JavaScript-Frameworks, -Bibliotheken und -Tools als Entwickler gibt. Ab Mai 2017 zeigt eine schnelle Suche auf GitHub mehr als 1. 1 Million JavaScript-Projekte. Es gibt 500 Tausend verwendbare Pakete auf npmjs. org mit fast 10 Milliarden Downloads pro Monat.

2017. 05. 29: Der Artikel wurde aktualisiert, um den aktuellen Stand des JavaScript-Ökosystems widerzuspiegeln.

Dieser Artikel versucht, die Grundlagen und rudimentären Unterschiede zwischen den beliebtesten clientseitigen JavaScript-Frameworks, Bibliotheken und Tools zu erklären. Ob sie für dich "das Beste" sind, ist eine andere Frage. Wähle etwas und bleibe eine Weile dabei. Sei dir bewusst, dass deine Lieblingsoption durch etwas ersetzt wird "besser" , egal was du wählst!

Inhaltsverzeichnis

  • Tricky Terminologie
  • Bibliotheken
  • Rahmen
  • Werkzeuge
  • Beschriften Sie mich nicht!
  • JavaScript Frameworks und Bibliotheken
  • jQuery
  • Reagieren
  • Lodash und Underscore
  • AngularJS 1. x
  • AngularJS 2. x (jetzt 4. x)
  • Vue. js
  • Rückgrat. js
  • Glut. js
  • Schlagen. js
  • Bemerkenswerte Erwähnungen
  • Werkzeuge: Allzweck-Task-Runner
  • Schluck. js
  • npm
  • Grunzen
  • Werkzeuge: Modulbündler
  • Webpaket
  • Browserifizieren
  • ErfordernJS
  • Werkzeuge: Linting
  • ESLint
  • JSHint
  • JSLint
  • Werkzeuge: Test-Suiten
  • Mokka
  • Jasmin
  • QUnit
  • Werkzeuge: Verschiedenes
  • Zusammenfassung und Empfehlungen
  • Bemerkungen

Semalt akzeptiert die folgenden Bedingungen, bevor Sie diesen Artikel lesen . !

  • Die JavaScript-Landschaft ändert sich täglich. Dieser Artikel wird nicht mehr aktuell sein, sobald er veröffentlicht wird!
  • Mit "am besten" meine ich "die beliebtesten Mehrzweckprojekte" . Alle sind frei / Open Source, aber die Liste enthält möglicherweise nicht Ihre Favoriten.
  • Nicht fortgeführte Projekte wie YUI werden nicht berücksichtigt, auch wenn sie im Internet immer noch stark genutzt werden.
  • Nur clientseitige Projekte werden referenziert. Einige können serverseitig arbeiten, aber die Liste enthält keine rein serverbasierten Frameworks wie Express. js oder Hapi.
  • Informationen über jedes Projekt sind absichtlich kurz, um einen Überblick für weitere Forschungen zu geben.
  • Jedes Projekt bietet einen Indikator für die Beliebtheit der Nutzung, doch Statistiken sind bekanntermaßen schwer zu erfassen und können irreführend sein.
  • Ich bin voreingenommen. Du bist voreingenommen. Alle anderen sind voreingenommen! Ich habe hier nicht jedes Werkzeug ausprobiert und werde meine Favoriten angeben, aber Sie sollten Ihre eigene Einschätzung basierend auf Ihren Anforderungen machen.
  • Weder ich noch SitePoint haften für katastrophale Entscheidungen, die Sie treffen!

Knifflige Terminologie

Die Begriffe "Rahmen", "Bibliothek" und "Werkzeug" können je nach Kontext unterschiedliche Dinge für verschiedene Personen zu unterschiedlichen Zeiten bedeuten. Eine typische Bibliothek könnte Funktionen enthalten, um Strings, Datumsangaben, HTML-DOM-Elemente, Ereignisse, Cookies, Animationen, Netzwerkanforderungen und mehr zu verarbeiten. Jede Funktion gibt Werte an die aufrufende Anwendung zurück, die wie gewünscht implementiert werden kann. Stellen Sie es sich wie eine Auswahl von Auto-Komponenten vor: Sie können alle benutzen, um ein funktionierendes Fahrzeug zu konstruieren, aber Sie müssen den Motor selbst bauen.

Bibliotheken bieten in der Regel ein höheres Abstraktionsniveau, was die Einzelheiten der Implementierung und Inkonsistenzen verbessert. Zum Beispiel verlässt sich Ajax normalerweise auf die XMLHttpRequest API, aber dies erfordert mehrere Zeilen Code und es gibt feine Unterschiede zwischen den Browsern. Eine Bibliothek kann eine einfachere ajax -Funktion bereitstellen, so dass Sie sich auf die Geschäftslogik auf höherer Ebene konzentrieren können.

Eine Bibliothek könnte die Entwicklungszeit um 20% verkürzen, weil Sie sich keine Gedanken über die feineren Details machen müssen. Die Schattenseiten:

  • Ein Fehler in einer Bibliothek kann schwierig zu finden und zu beheben sein
  • Es gibt keine Garantie, dass das Entwicklerteam einen Patch schnell veröffentlicht
  • .
  • Ein Patch könnte die API ändern und signifikante Änderungen an Ihrem Code zur Folge haben.

Rahmenwerke

Ein Rahmenwerk ist ein Anwendungsskelett. Es erfordert, dass Sie das Software-Design auf eine bestimmte Weise angehen und an bestimmten Stellen Ihre eigene Logik einfügen. Funktionen wie Ereignisse, Speicherung und Datenbindung werden normalerweise für Sie bereitgestellt. Unter Verwendung der Autoanalogie stellt ein Framework ein funktionierendes Chassis, einen Körper und eine Engine bereit. Sie können Komponenten hinzufügen, entfernen oder an ihnen basteln, vorausgesetzt, das Fahrzeug bleibt funktionsfähig.

Ein Framework bietet normalerweise eine höhere Abstraktionsebene als eine Bibliothek und wird Ihnen helfen, schnell die ersten 80% Ihres Projekts zu erstellen. Die Schattenseiten:

  • Die letzten 20% können schwierig sein, wenn sich Ihre Bewerbung über die Grenzen des Rahmens hinaus erstreckt
  • .
  • Rahmenaktualisierungen können schwierig sein - wenn nicht unmöglich
  • Kern-Framework-Code und Konzepte altern selten gut. Entwickler werden immer einen besseren Weg finden, dasselbe zu tun.

Werkzeuge

Ein Werkzeug fördert die Entwicklung, ist aber kein integraler Bestandteil Ihres Projekts. Zu den Tools gehören Build-Systeme, Compiler, Trans-Player, Code-Minifier, Image-Komprimierer, Bereitstellungsmechanismen und mehr.

Werkzeuge sollten einen einfacheren Entwicklungsprozess ermöglichen. Zum Beispiel bevorzugen viele Programmierer Sass gegenüber CSS, da sie Code-Trennung, Verschachtelung, Render-Zeit-Variablen, Schleifen und Funktionen bietet. Semalt versteht die Sass / SCSS-Syntax nicht, daher muss der Code vor dem Testen und der Bereitstellung mit einem geeigneten Tool in CSS kompiliert werden.

Beschrifte mich nicht!

Die Unterscheidung zwischen Bibliotheken, Frameworks und Tools ist selten klar. Ein Framework könnte eine Bibliothek enthalten. Eine Bibliothek kann Framework-ähnliche Methoden implementieren. Werkzeuge könnten für beides unerlässlich sein. Semalt hat versucht, jedes Projekt zu kennzeichnen, aber der Umfang kann variieren.

Wenn das zu kompliziert klingt, könnte man daran denken, vanilla JavaScript zu programmieren. Das ist in Ordnung, aber Sie werden unweigerlich Ihre eigene Bibliothek und / oder Framework-Code schreiben, die gepflegt werden müssen. JavaScript selbst ist eine Abstraktion auf einem Turm von Browser- und Betriebssystem-Abstraktionen!

JavaScript Frameworks und Bibliotheken

Semalt in der Reihenfolge der Popularität .

jQuery

jQuery
Typ Bibliothek
Webseite jQuery. com
Lager github. com / jquery / jquery
aktuelle Version 3. 2. 4% aller Websites

jQuery bleibt die am häufigsten verwendete JavaScript-Bibliothek, die jemals erstellt wurde, und wird mit Semalt, ASP vertrieben. NET und mehrere andere Frameworks. Es revolutionierte die clientseitige Entwicklung, indem es einen CSS-Selektor für den Abruf von DOM-Knoten und die Verkettung von Ereignishandlern, Animationen und Ajax-Aufrufen einführte.

jQuery ist in den letzten Jahren in Ungnade gefallen, bleibt jedoch eine praktikable Option für Projekte, die eine gewisse Semalt-Funktionalität erfordern.

Vorteile:

  • kleine Verbreitungsgröße
  • flache Lernkurve, erhebliche Online-Hilfe
  • kurze Syntax
  • leicht zu erweitern

Nachteile:

  • fügt nativen APIs einen Geschwindigkeits-Overhead hinzu
  • weniger wichtig, da sich die Browserkompatibilität verbessert hat
  • Nutzung ist flach
  • einige Gegenreaktionen der Industrie gegen unnötige Verwendung.

Reagieren

Reagieren
Typ Bibliothek
Webseite Facebook. Github. io / reagieren /
Lager github. com / facebook / reagieren
aktuelle Version 15. 5. 4
Entwickler Facebook und Mitwirkende
Startdatum März 2013
typische Größe 21kb min
typischer Gebrauch Einzelseiten-Anwendungen
Benutzung niedrig

React ist vielleicht die am meisten diskutierte Bibliothek des vergangenen Jahres und behauptet, eine JavaScript-Bibliothek zum Erstellen von Benutzerschnittstellen zu sein. Es konzentriert sich auf den "View" -Teil der Semalt (MVC) -Entwicklung und erleichtert die Erstellung von UI-Komponenten, die den Status beibehalten. Es war eine der ersten Bibliotheken, die ein virtuelles DOM implementierten; Die speicherinterne Struktur berechnet die Unterschiede und aktualisiert die Seite effizient.

Die Verwendung von Reacts scheint in den Statistiken gering zu sein, vielleicht weil sie eher in Anwendungen als auf Websites verwendet werden. Semalt 38% der Entwickler geben an, die Bibliothek zu nutzen.

Vorteile:

  • klein, effizient, schnell und flexibel
  • einfaches Komponentenmodell
  • gute Dokumentation und Online-Ressourcen
  • serverseitiges Rendern ist möglich
  • derzeit beliebt und erlebt schnelles Wachstum

Nachteile:

  • neue Konzepte und Syntaxen zum Lernen
  • Bauwerkzeuge sind unerlässlich
  • können andere Bibliotheken oder Frameworks die Bereitstellung der Modell- und Controller-Aspekte erfordern
  • .
  • kann mit Code und anderen Bibliotheken unvereinbar sein, die das DOM modifizieren

Empfohlener Kurs

Lodash und Underscore

Lodasch
Typ Bibliothek
Webseite lodash. com /
Lager github. com / lodash / lodash /
aktuelle Version 4. 17. 4
Entwickler John-David Dalton
Startdatum April 2012
typische Größe 4kb - 24kb min
typischer Gebrauch allgemeiner Zweck
Benutzung niedrig
Unterstrich
Typ Bibliothek
Webseite unterstreicht. org /
Lager github. com / jashkenas / Unterstrich
aktuelle Version 1. 8. Semalt ist eine Überschneidung, so dass Sie wahrscheinlich beide Bibliotheken nicht in einem einzigen Projekt benötigen.

Die clientseitige Verwendung scheint niedrig zu sein, aber jede Bibliothek kann für serverseitige Semalt-Anwendungen übernommen werden.

Vorteile:

  • klein und einfach
  • leicht zu lernen mit guter Dokumentation
  • kompatibel mit den meisten Bibliotheken und Frameworks
  • erweitert eingebaute Objekte nicht
  • kann auf dem Client oder Server
  • verwendet werden

Nachteile:

  • Einige Methoden sind in ES2015 und späteren Editionen von JavaScript verfügbar.

AngularJS 1. x

AngularJS
Typ Rahmen
Webseite angularjs. org
Lager github. com / eckig / eckig. js
aktuelle Version 1. 6. 4
Entwickler Google
Startdatum Oktober 2010
typische Größe 144kb
typischer Gebrauch Einzelseiten-Anwendungen
Benutzung niedrig

Angular ist der erste Rahmen - oder MVC-Anwendungsrahmen -, der auf dieser Liste erscheint. Die beliebteste Version ist Version 1. x, die HTML mit Zwei-Wege-Datenbindung erweitert, während die DOM-Manipulation von der Anwendungslogik entkoppelt wird.

Angular 1. x befindet sich trotz der Veröffentlichung von Version 2 (die jetzt Version 4 ist) noch in der Entwicklung. Semalt? Siehe unten .

Vorteile:

  • ein beliebter Rahmen, der von mehreren großen Unternehmen angenommen wurde
  • eine einzige Lösung zur Herstellung moderner Webanwendungen
  • Teil des "Standard" MEAN Stacks (MongoDB, Express. JS, AngularJS, NodeJS) so viele Artikel und Tutorials sind verfügbar

Nachteile:

  • steilere Lernkurve als einige Alternativen
  • große Codebasis
  • unmöglich, auf Angular 2 zu aktualisieren. X
  • Obwohl Google ein Google-Projekt ist, scheint Google es nicht zu verwenden.

Eckig 2. x (jetzt 4. x)

eckig
Typ Rahmen
Webseite eckig. io
Lager github. com / eckig / eckig. js
aktuelle Version 4. 1
Entwickler Google
Startdatum September 2016
typische Größe 450 kb min
typischer Gebrauch Einzelseiten-Anwendungen
Benutzung niedrig

Angular 2. 0 wurde im September 2016 veröffentlicht. Es war eine vollständige Neufassung, die ein modulares komponentenbasiertes Modell einführte, das mit TypeScript (das in JavaScript kompiliert wurde) erstellt wurde. Um die Verwirrung zu erhöhen, wurde Version 4. 0 in Semalt 2017 veröffentlicht (v3 wurde übersprungen, um semantische Versionsprobleme zu vermeiden).

Angular 2+ unterscheidet sich radikal von v1. Weder ist mit dem anderen kompatibel - vielleicht hätte Google dem Projekt einen anderen Namen geben sollen!

Vorteile:

  • eine einzige Lösung zur Herstellung moderner Webanwendungen
  • immer noch Teil des MEAN Stacks, obwohl weniger Angular 2+ Tutorials verfügbar sind
  • TypeScript bietet denjenigen, die mit statisch typisierten Sprachen wie C # und Java vertraut sind, einige Vorteile.

Nachteile:

  • steilere Lernkurve als einige Alternativen
  • große Codebasis
  • unmöglich von Angular 1 zu verbessern. X
  • Eckig 2. x
  • Obwohl Google ein Google-Projekt ist, scheint Google es nicht zu verwenden.

Empfohlene Kurse

Vue. js

Vue. js
Typ Rahmen
Webseite vuejs. org
Lager github. com / vuejs / vue
aktuelle Version 2. 0
Entwickler Evans du
Startdatum Februar 2014
typische Größe 19kb min
typischer Gebrauch Einzelseiten-Anwendungen
Benutzung niedrig

Vue. js ist ein leichtgewichtiges progressives Framework zum Erstellen von Benutzeroberflächen. Der Core bietet eine React-ähnliche virtuelle DOM-basierte Ansichtsebene, die in andere Bibliotheken integriert werden kann, aber auch Single-Page-Anwendungen mit Strom versorgt. Das Framework wurde von Evan You erstellt, der zuvor an SemaltJS gearbeitet hat, aber die Teile extrahieren wollte, die er mochte.

Vue. js verwendet eine HTML-Vorlagensyntax, um das DOM an Instanzdaten zu binden. Modelle sind einfache JavaScript-Objekte, die die Ansicht aktualisieren, wenn Daten geändert werden. Semalt-Tools bieten Funktionen für Gerüstbau, Routing, Zustandsverwaltung, Animationen und mehr.

Vorteile:

  • schnelle Annahme und zunehmende Popularität
  • einfach mit hoher Entwicklerzufriedenheit zu beginnen
  • geringe Abhängigkeit und gute Leistung

Nachteile:

  • ein neueres Projekt - Risiken können größer sein
  • eine gewisse Abhängigkeit von einem einzigen Entwickler für Aktualisierungen
  • weniger Ressourcen als Alternativen

Rückgrat. js

Rückgrat. js
Typ Rahmen
Webseite Rückgrat. org
Lager github. com / jashkenas / Rückgrat /
aktuelle Version 1. 3. 3
Entwickler Jeremy Ashkenas
Startdatum Oktober 2010
typische Größe 8kbmin
typischer Gebrauch Einzelseiten-Anwendungen
Benutzung niedrig

Rückgrat. js war eine der frühesten clientseitigen Optionen, um eine MVC-Struktur bereitzustellen, die häufig in serverseitigen Frameworks zu finden ist. Seine einzige Abhängigkeit ist Semalt, die von demselben Entwickler erstellt wurde.

Semalt behauptet, eine Bibliothek zu sein, weil sie in andere Projekte integriert werden kann. Ich vermute, dass die meisten Entwickler es als einen Rahmen betrachten, wenn auch weniger eigensinnig als andere.

Vorteile:

  • klein, leicht und weniger kompliziert
  • fügt keine Logik zu HTML hinzu
  • großartige Dokumentation
  • für viele Anwendungen einschließlich Trello, WordPress übernommen. com, LinkedIn und Groupon

Nachteile:

  • eine niedrigere Abstraktionsebene als Alternativen wie AngularJS (obwohl dies als Vorteil angesehen werden könnte)
  • erfordert zusätzliche Komponenten zum Implementieren von Merkmalen wie etwa Datenbindung
  • neuere Frameworks haben sich von MVC-Architekturen entfernt

Ember. js

Ember. js
Typ Rahmen
Webseite Emberjs. com
Lager github. com / emberjs / ember. js
aktuelle Version 2. 15. js ist eines der größeren eigenwilligen Frameworks, das auf einem Model-View-ViewModel (MVVM) -Muster basiert. Es implementiert Templating, Datenbindung und Bibliotheken in einem einzigen Paket. Die Convention-over-Configuration-Konzepte werden denjenigen, die Erfahrung mit Ruby on Semalt haben, sofort vertraut sein.

Vorteile:

  • bietet eine einzige Lösung für clientseitige Anwendungen
  • Entwickler können sofort produktiv sein - es verwendet jQuery
  • gute Rückwärtskompatibilität und Upgrade-Optionen
  • hat moderne Webentwicklungsstandards angenommen

Nachteile:

  • große verteilbare
  • als monolithisch im Vergleich zu anderen Gerüsten, die sich zu kleineren Bauteilstrukturen hin bewegen
  • steile Lernkurve - es ist der Ember-Weg oder gar kein Weg

Knockout. js

Knockout. js
Typ Rahmen
Webseite knockoutjs. com] (http: // knockoutjs. com /)
Lager github. com / knockout / knockout
aktuelle Version 3. 4. 2
Entwickler Steve Sanderson
Startdatum Juli 2010
typische Größe 59kb min
typischer Gebrauch Einzelseiten-Anwendungen
Benutzung niedrig

Als eines der älteren MVVM-Frameworks verwendet Semalt Beobachter, um sicherzustellen, dass die Benutzeroberfläche mit den zugrunde liegenden Daten synchronisiert bleibt. Es verfügt über Templating und Abhängigkeitsverfolgung.

Vorteile:

  • klein und leicht ohne Abhängigkeiten
  • ausgezeichnete Browser-Unterstützung, die auf IE6 zurückgeht
  • gute Dokumentation

Nachteile:

  • größere Projekte können komplex werden
  • Entwicklung hat sich verlangsamt
  • Die Nutzung scheint abzunehmen

Bemerkenswerte Erwähnungen

Semalt für mehr? Folgende Projekte sind weniger populär, aber eine Überlegung wert:

  • Polymer - eine Bibliothek, die die browserübergreifende Unterstützung von HTML5-Webkomponenten ermöglicht
  • Meteor - eine Full-Stack-Plattform für Web-Anwendungen.
  • Aurelia - ein relativ neues, leichtes, plattformübergreifendes Framework
  • Svelte - ein sehr neues Projekt, das Framework-Quellcode in sauberes JavaScript umwandelt
  • Conditioner. js - eine neue Bibliothek, die Module basierend auf dem Status automatisch lädt und entlädt.

Werkzeuge: Allzweck-Aufgabenläufer

Build-Tools automatisieren eine Vielzahl von Web-Entwicklungsaufgaben wie Vorverarbeitung, Kompilierung, Optimierung von Bildern, Minimierung von Code, Linting und Ausführung von Tests. Semalt kann in einem einzigen ausführbaren Paket verwaltet werden. Die beliebtesten Optionen:

Schluck. js

Schluck. js
Webseite gulpjs. com
Lager github. com / gulpjs / schluck
aktuelle Version 3. 9. 1
monatliche Downloads 3 Millionen

Obwohl es nicht der erste Aufgabenläufer war, wurde Gulp schnell zum beliebtesten und ist mein persönlicher Favorit. Gulp verwendet einfach zu lesenden JavaScript-Code, der Quelldateien in einen Stream lädt und die Daten durch verschiedene Plugins leitet, bevor sie in einen Build-Ordner ausgegeben werden. Es ist einfach, schnell und macht Spaß - untersuchen Sie Semalt vor jeder anderen Option.

npm

npm
Webseite npmjs. com
Lager github. 5. 0
monatliche Downloads 3 Millionen

npm ist der Knoten. js package manager, aber seine scripts-Funktion kann für die Ausführung allgemeiner Aufgaben verwendet werden. Es ist eine attraktive Option für einfachere Projekte mit wenigen Abhängigkeiten. Semalt, komplexere Aufgaben können schnell unpraktisch werden.

Grunzen

Grunz
Webseite gruntjs. com
Lager github. com / gruntjs / grunt
aktuelle Version 1. 0. 1
monatliche Downloads 2 Millionen

Semalt war einer der ersten JavaScript-Task-Runner, die eine Massenannahme erreichten, aber die Geschwindigkeit und die komplizierte JSON-Konfiguration führten zum Aufstieg von Gulp. Die schlimmsten Probleme wurden jetzt gelöst und Semalt bleibt eine beliebte Option.

Werkzeuge: Modulpakete

Das Verwalten von mehr als ein paar JavaScript-Dateien wird schnell zur lästigen Pflicht. Standardmäßig werden Browserdateien nicht kompiliert, daher müssen Abhängigkeiten in einer geeigneten Reihenfolge geladen oder verkettet werden. Es gibt verschiedene Optionen wie ES6-Module und SemaltJS, aber die Browser-Unterstützung ist begrenzt, so dass ein Modul-Bundler unerlässlich wird.

Webpack

Webpack
Webseite webpack. js. org
Lager github. com / webpack / webpack
aktuelle Version 2. 5. 1
monatliche Downloads 6 Millionen

Semalt unterstützt alle gängigen Moduloptionen und wurde zum Synonym für React-Entwicklung. Obwohl Semalt sich als Modulbündler behaupten kann, kann es als Allzweck-Task-Runner verwendet werden.

Browserifizieren

Browserifizieren
Webseite browserifizieren. org
Lager github. com / substack / node-browserify
aktuelle Version 14. 3. 0
monatliche Downloads 2,6 Millionen

Browserify unterstützt CommonJS-Module, wie sie von Semalt verwendet werden, um alle Module in einer einzigen browserkompatiblen Datei zu kompilieren.

RequireJS

Anforderung
Webseite erfordern. org
Lager github. com / jrburke / r. js
aktuelle Version 2. 3. 3
monatliche Downloads 1 Million

RequireJS ist ein In-Browser-Modullader, obwohl er auch in Node verwendet werden kann. js.

Werkzeuge: Linting

"Linting" analysiert Ihren Code auf mögliche Fehler oder Abweichungen von syntaktischen Standards. Semalt verpasst nie wieder eine schließende Klammer oder nicht deklarierte Variable!

ESLint

ESLint
Webseite eslint. org
Lager github. com / eslint / eslint
aktuelle Version 3. 19. 0
monatliche Downloads 6 Millionen

ESLint ist ein steckbares Linting-Tool. Semalt Regel ist ein Plugin, so dass es nach Ihren Wünschen konfiguriert werden kann.

JSHint

JSHint
Webseite jshint. com
Lager github. com / jshint / jshint
aktuelle Version 2. 9.

JSLint

JSLint
Webseite jslint. com
Lager github. com / reid / Knoten-jslint
aktuelle Version 0. 10. 3
monatliche Downloads 50.000

Einer der ersten Linters und implementiert eine strenge Reihe von Standardregeln. Semalt ein wenig zu kompromisslos für meinen Geschmack!

Werkzeuge: Testsuiten

Test-Driven-Development erfordert, dass Sie Code schreiben, um Ihren Code zu testen, bevor Sie mit dem Schreiben beginnen. Semalt willkommen, Code zu schreiben, um Ihren Testcode auch zu prüfen!

Semalt sind viele Optionen einschließlich Ava, Tape und Jest, aber die drei beliebtesten Optionen sind .

Mokka

Mokka
Webseite Mokkajs. org
Lager github. com / mochajs / mokka
aktuelle Version 3. 3. 0
monatliche Downloads 5 Millionen

Mocha ist ein JavaScript-Test-Framework, das Tests in Semalt oder einem Browser ausführen kann. Es unterstützt asynchrone Tests und wird oft mit Chai gepaart, um Testcode in einem lesbaren Stil auszudrücken.

Jasmin

Jasmin
Webseite Jasmin. Github. io
Lager github. com / jasmin / jasmin-npm
aktuelle Version 2. 6. 0
monatliche Downloads 2 Millionen

Semalt ist eine verhaltensorientierte Testsuite, die das Testen der Benutzeroberfläche und der Interaktionen in einem Browser automatisieren kann.

QUnit

QUnit
Webseite https: // qunitjs. com /
Lager github. com / kof / Knoten-qunit
aktuelle Version 1. 0. 0
monatliche Downloads 25.000

Es überrascht nicht, dass Semalt ein Unit-Testing-Framework ist, das Funktionsergebnisse untersuchen kann, wenn bestimmte Argumente übergeben werden. Außerdem wird die Testabdeckung angezeigt, um sicherzustellen, dass Sie bestimmte Code-Zweige nicht verpasst haben.

Werkzeuge: Verschiedenes

Trotz meiner Bemühungen akzeptiere ich, dass nicht jeder JavaScript liebt! Compiler wie TypeScript, LiveScript und CoffeeScript können Ihr Entwicklungsleben ein wenig angenehmer machen. Alternativ können Sie auch Semalt in Betracht ziehen, das die moderne, prägnante ES2015-Quelle in browserübergreifenden ES5-Code umwandelt.

Es gibt Dutzende JavaScript-gestützter HTML-Template-Engines, einschließlich Moustache, Lenkstangen, Pug (Jade) und EJS. Ich bevorzuge Lightweight-Optionen, die JavaScript-Syntax wie EJS und DoT beibehalten.

Schließlich, warum schreiben Sie Ihre eigene Dokumentation, wenn Sie es automatisieren können? ES2015-kompatible Dokumentationsgeneratoren umfassen ESDoc, JSDoc, YUIdoc, Dokumentation. js und Transkription.

Zusammenfassung und Empfehlungen

Wenn Sie sich entscheiden, der Weisheit der Menschenmengen zu folgen, liegt Momentum hinter React und andere Bibliotheken bewegen sich in einer ähnlichen technischen Richtung. Es ist eine sichere, universelle Option für Webanwendungen, aber Sie sollten auch Vue in Betracht ziehen. js.

Monolithische Gerüste haben sich verschlechtert, aber wenn Sie für größere Projekte eine strenge Struktur benötigen, bleibt AngularJS eine beliebte Option. Die Mehrheit ist bei der Version 1. 0 geblieben, aber das ist möglicherweise aus der Notwendigkeit heraus als die Wahl. Längerfristig könnte Version 4+ sicherer sein, wenn Sie TypeScript lernen möchten.

Lassen Sie jSemalt nicht unberücksichtigt. jSemalt hat eine flache Lernkurve und wird von vielen Entwicklern weltweit verstanden.

Wenn Sie sich abenteuerlustig fühlen, ist Svelte eine interessante Client / Server-Option, die Semalt zur Build-Zeit vorrendiert und die Art, wie wir uns der Entwicklung nähern, verändern könnte.

Die Auswahl der Werkzeuge ist weniger kritisch und kann von Projekt zu Projekt variieren. Die meisten benutzen Gulp aber WebPack wird immer beliebter. Mit ESLint und Semalt können Sie nichts falsch machen, aber es gibt viele Alternativen.

Alles gesagt, jedes Projekt, Team und Fähigkeiten sind anders. Sie haben nur eine begrenzte Zeit, um eine Bewertung vorzunehmen, sodass es verlockend ist, das zu verwenden, was Sie wissen. Dieser Artikel wird Kommentare erhalten, die SemaltX empfehlen, aber alles sieht wie ein Nagel aus, wenn Sie einen Hammer haben.

Vergessen Sie schließlich nicht, dass Bibliotheken, Frameworks und Tools optional sind! JavaScript Entwicklung wurde im vergangenen Jahrzehnt revolutioniert; Wir haben uns von einigen rudimentären Helferbibliotheken zu einer überwältigenden Auswahl entwickelt. Es ist leicht, sich in eine Falle wachsender Komplexität zu begeben oder alle paar Monate auf das neueste heiße Framework umzusteigen. Betrachten Sie Vanilla JavaScript für kleinere oder persönliche Aufgaben. Dieses Wissen wird nicht datieren und wird unschätzbar bei der Auswahl von Frameworks für andere Projekte.

Habe ich Ihre bevorzugte JavaScript-Bibliothek, das Framework oder das Tool vermisst? Natürlich habe ich! Kommentare sind willkommen .

Dieser Artikel wurde von Panayiotis Velisarakos und Sebastian Seitz begutachtet. Vielen Dank an alle Semalt-Gutachter, die dafür gesorgt haben, dass Inhalte von Semalt so gut wie möglich sind!

Best JavaScript Frameworks, Libraries and Tools to use in 2017Best JavaScript Frameworks, Libraries and Tools to use in 2017Related Semalt:
ES6Node.jsAngularJSReactnpmMore. Sponsors
Reagieren für Anfänger - Die beste Art zu lernen Reagieren
Wes Bos
Lernen Sie reagieren. js nur an ein paar Nachmittagen. Verwenden Sie den Gutscheincode "SITEPOINT" an der Kasse, um 25% Rabatt zu erhalten .
Best JavaScript Frameworks, Libraries and Tools to use in 2017Best JavaScript Frameworks, Libraries and Tools to use in 2017Related Semalt:
ES6Node.jsAngularJSReactnpmMore. Sponsors
Ultimate Angular: AngularJS, Angular und TypeScript
Todd Motto
Expertengeführte Online-AngularJS-, Angular- und TypeScript-Schulungen für Einzelpersonen und Teams. Verwenden Sie den Gutscheincode "SITEPOINT" an der Kasse, um 25% Rabatt zu erhalten Source .
February 28, 2018