Sie müssen nichts einrichten, um mit JavaScript zu beginnen

Feb 19 2023
Wenn wir mit dem Codieren beginnen, machen wir uns Gedanken darüber, wie wir die Entwicklungsumgebung richtig einrichten, welche externen Abhängigkeiten wir installieren müssen und welches Framework wir verwenden sollen. Um all dem entgegenzuwirken, zeige ich Ihnen drei Möglichkeiten für den einfachen Einstieg mit clientseitigem JavaScript! 1. Die Browser-Konsole Wir können Variablen inklusive Funktionen direkt in der Konsole erstellen und diese manipulieren, neu zuweisen oder die Funktionen auch aufrufen.

Wenn wir mit dem Codieren beginnen, machen wir uns Gedanken darüber, wie wir die Entwicklungsumgebung richtig einrichten, welche externen Abhängigkeiten wir installieren müssen und welches Framework wir verwenden sollen

Um all dem entgegenzuwirken, zeige ich Ihnen drei Möglichkeiten, wie Sie ganz einfach mit clientseitigem JavaScript beginnen können!

Bild von OpenClipart-Vectors von Pixabay

1. Die Browserkonsole

Wir können Variablen inklusive Funktionen direkt in der Konsole erstellen und diese manipulieren, neu zuweisen oder die Funktionen auch aufrufen.
Bei Ausführung jeder Zeile erhalten wir die Ausgabe in der nächsten Zeile.

Codierung direkt in der Konsole

Vorteile

  • Wir bekommen einen sehr schnellen Start und eine gute Intelligenz.
  • Hierfür ist neben dem Browser keine zusätzliche Software erforderlich, die installiert werden muss.
  • Die Ausgaben erfolgen in Echtzeit.
  • Dies ist nur dann nützlich, wenn wir etwas debuggen oder Manipulationen an den Dom-Knoten vornehmen möchten, die bereits von der Seite gerendert werden.
  • Dies ist nicht sinnvoll, um komplette Programme zu schreiben, da es schwierig wird, Code Zeile für Zeile zu schreiben und auszuführen.
  • Es gibt keine Dateistruktur.
  • Wir können nur Vanilla-JavaScript ausführen.

Während wir in der Konsole Code Zeile für Zeile schreiben müssen, ermöglichen uns Browser Snippets das Schreiben von Programmen in eine Datei.
Auf diese Weise können wir den vollständigen Code schreiben und die Datei ausführen.
Wir können auch Haltepunkte hinzufügen, um den Code zu debuggen, falls etwas schief geht.

Codierung in Chrome-Snippets

Vorteile

  • Auch hier erhalten wir mit der Debugging-Unterstützung einen sehr schnellen Einstieg.
  • Hierfür ist neben dem Browser keine zusätzliche Software erforderlich, die installiert werden muss.
  • Wir können Programme in Dateien organisieren und die Dateien ausführen.
  • Dies ist nicht sinnvoll, wenn wir Projekte erstellen, die externe Abhängigkeiten erfordern.
  • Wir müssen alle äußersten Variablen als let definieren . Dies liegt daran, dass Variablen bei der erneuten Ausführung der Datei
    nicht aus dem Bereich entfernt werden .
  • Wir können nur Vanilla-JavaScript ausführen.

Wenn wir gemeinsam mit Frameworks oder HTML/CSS/JS arbeiten möchten, können wir Online-Spielplätze nutzen.
Sie liefern uns Echtzeitausgaben basierend auf Änderungen in HTML/CSS/JS und ermöglichen uns auch die gemeinsame Nutzung der gesamten Codebasis.
Außerdem können wir externe Abhängigkeiten installieren und im Projekt verwenden.

Codierung auf CodeSandBox

Vorteile

  • Mit der Unterstützung der Verzeichnisstruktur erhalten wir hier einen sehr schnellen Einstieg.
  • Wir können neue Pakete schnell und problemlos installieren.
  • Diese sind wirklich nützlich, wenn wir eine Bibliothek eines Drittanbieters ausprobieren und das Paket nicht zuerst in unserem lokalen Arbeitsbereich installieren möchten.
  • Wir bekommen schöne Starterprojekte.
    Versuchen Sie, React Start Project zu googeln – CodeSandBox.
  • Dies ist nicht sinnvoll, wenn wir Produkte auf Produktionsebene herstellen.
  • Je nach Plattform gibt es möglicherweise keine Debugging-Unterstützung.

Danke