Verständnis von Client-seitigen Webentwicklungstools

Client-seitige Tools können einschüchternd sein, aber diese Artikelserie soll den Zweck der gängigsten Arten von clientseitigen Tools verdeutlichen, die Tools erklären, die Sie kombinieren können, wie Sie sie mit Paketmanagern installieren und über die Befehlszeile steuern können. Wir schließen mit einem vollständigen Toolchain-Beispiel ab, das Ihnen zeigt, wie Sie produktiv werden können.

Voraussetzungen

Sie sollten wirklich zuerst die Grundlagen der Kernsprachen HTML, CSS und JavaScript erlernen, bevor Sie versuchen, die hier beschriebenen Tools zu verwenden.

Leitfäden

1. Überblick über clientseitige Tools

In diesem Artikel bieten wir einen Überblick über moderne Web-Tools, welche Arten von Tools verfügbar sind und wo Sie ihnen im Lebenszyklus der Web-App-Entwicklung begegnen, sowie wie Sie Hilfe zu einzelnen Tools finden können.

2. Einführung in die Befehlszeile

In Ihrem Entwicklungsprozess werden Sie zweifellos aufgefordert, einige Befehle im Terminal auszuführen (oder auf der "Befehlszeile" — diese sind im Grunde dasselbe). Dieser Artikel bietet eine Einführung in das Terminal, die grundlegenden Befehle, die Sie eingeben müssen, wie Sie Befehle kombinieren und wie Sie Ihre eigenen CLI-Tools hinzufügen.

3. Grundlagen des Paketmanagements

In diesem Artikel betrachten wir Paketmanager im Detail, um zu verstehen, wie wir sie in unseren eigenen Projekten verwenden können — um Projektool-Abhängigkeiten zu installieren, sie auf dem neuesten Stand zu halten und mehr.

4. Einführung in eine vollständige Toolchain

In den letzten beiden Artikeln der Serie werden wir Ihr Werkzeugwissen festigen, indem wir Sie durch den Prozess des Aufbaus einer Fallstudien-Toolchain führen. Wir gehen vom Einrichten einer sinnvollen Entwicklungsumgebung und der Implementierung von Transformationstools bis hin zur eigentlichen Bereitstellung Ihrer App. In diesem Artikel stellen wir die Fallstudie vor, richten unsere Entwicklungsumgebung ein und setzen unsere Codetransformationstools auf.

5. Bereitstellung unserer App

Im letzten Artikel unserer Serie nehmen wir die beispielhafte Toolchain, die wir im vorangegangenen Artikel aufgebaut haben, und erweitern sie, damit wir unsere Beispiel-App bereitstellen können. Wir schieben den Code zu GitHub und stellen ihn auf GitHub Pages bereit, und zeigen Ihnen auch, wie Sie einen einfachen Test in den Prozess integrieren.