Sowohl für Anfänger, die lernen möchten, als auch für erfahrene Profis gibt es einige Websites, auf denen Sie Codezeilen ausprobieren und das Ergebnis in der Vorschau und fast in Echtzeit sehen können. Dies sind echte Anwendungen, bei denen der Bildschirm in zwei Teile geteilt ist, wobei Sie einerseits den Code schreiben, der HTML, CSS, PHP, Javascript oder andere sein kann, andererseits nach dem Drücken einer Taste zum Ausführen Sie sehen tatsächlich, wie es aussieht, wenn sich dieser Code in einer Website befindet.
Dies sind keine einfachen Code-Editoren, sondern Orte, an denen Sie Ihre Programmierung testen können, ohne sich Gedanken über Fehler machen zu müssen, und schnell herausfinden können, wo die Fehler liegen. Codepen und JSFiddle sind die beiden beliebtesten Websites in dieser Kategorie, aber es gibt auch viele Alternativen.
LESEN SIE AUCH: Hauptprogrammiersprachen für Apps und Websites
1) CodePen
CodePen ist die beliebteste Website und wird von Programmierern verwendet, da sie kostenlos, intuitiv und einfach zu bedienen ist. Nachdem Sie ein Standard in der Welt der Programmierer geworden sind, suchen Sie einfach bei Google nach Seiten, die bereits von Codepen zusammengestellt wurden, und prüfen Sie sofort, ob Sie danach gesucht haben. Die flexiblen Anzeigefenster und die sofortige Ausführung des geschriebenen Codes machen es perfekt genug, um Javascript- und CSS-Animationen auszuprobieren. Darüber hinaus kann es problemlos mit externen Skripten (React, Vue und allem anderen, was über CDN verfügbar ist) verbunden werden.
CodePen verdient den ersten Platz in dieser Kategorie, jedoch werden einige Funktionen bezahlt, wie z. B. kollaboratives Codieren und ganzseitige Live-Ansichten (teilweise Live-Ansichten sind kostenlos).
2) JSFiddle
An zweiter Stelle (obwohl chronologisch gesehen eine der ältesten) in der Welt der Websites zum Schreiben und Ausprobieren von Programmcode steht JSFiddle, das sich vor allem an der Erstellung und dem Testen von JavaScript orientiert. Es kann auch für HTML und CSS verwendet werden und unterstützt Tipps zur Code-Vervollständigung. Für weniger erfahrene Benutzer ist es möglicherweise auch CodePen vorzuziehen.
Ein wichtiger Punkt für JSFiddle ist, dass es einen kostenlosen Kollaborationsmodus (einschließlich Sprach- und Text-Chat) bietet, sodass Sie gleichzeitig mit anderen Personen am Code arbeiten können.
3) Panne
Auf vielen Code-Sites können Sie HTML / CSS / JS codieren und statische Webseiten generieren, während Glitch einen kleinen freien Speicherplatz zum Speichern von Projekten bietet und das Ausführen von serverseitigem Code von Node.js. ziemlich einfach macht. Sie können gemeinsam auf Glitch programmieren,
Es kommt auch mit einer Reihe anderer fantastischer Funktionen: kollaboratives Codieren, Versionskontrolle, viele Lernressourcen, gute Integration in GitHub, einfaches Einbetten, eine Community, die um Rat fragt, bereits erstellte Projekte, die Sie frei ändern oder verwenden können, und das Visual Studio-Integration. Es ist eine großartige, schnelle und einfache Möglichkeit, eine Web-App zu starten (oder zu lernen, wie man das macht).
4) CodeSandbox
CodeSandbox ähnelt Glitch, ist jedoch etwas komplexer und vollständiger. CodeSandbox verfügt über eine flexiblere und anpassbarere Oberfläche, ermöglicht das Verteilen kompletter Web-Apps, bietet Platz zum Speichern von Dateien und erledigt die meisten grundlegenden Arbeiten, sodass der Programmierer nur noch schreiben muss.
5) Repl.it
Repl.it ist eine Entwicklungsumgebung zum Testen verschiedener Arten von Programmiersprachen wie Python mit Unterstützung von Front-End- und Back-End-Code. Sie ermöglicht das Verteilen von Websites und Apps, ist in GitHub integriert und verfügt über eine intuitive Benutzeroberfläche. Es mag für jemanden, der nur versucht, Webseiten zu entwerfen, etwas zu schwierig sein, aber für bereits erfahrene Programmierer ist es eine Ressource, die in Betracht gezogen werden muss. Wenn Sie nur Front-End planen oder wenn Sie neu im Code sind, aber wenn Sie alles regelmäßig planen, lohnt es sich, es zu erkunden.
6) Liveweave ist ein Web-Editor, der JSFiddle sehr ähnlich ist und mit dem Sie Code schreiben und ausprobieren können, der auf Websites verwendet werden kann. Er bietet Live-Vorschau-Funktionen, Code-Hinweise für HTML5, CSS3, JavaScript und jQuery und ermöglicht es Ihnen, das Projekt als Datei herunterzuladen zip. Sie können auch ganz einfach externe Bibliotheken wie jQuery, AndgularJS und Bootstrap hinzufügen.
7) CodeSandbox ist ein kostenloser Online-Bereich, in dem Sie Web-App-Projekte mit verschiedenen Frameworks wie React, Vue, Angular und vielem mehr starten können.
8) StackBlitz ist ein ausgezeichneter Javascript-Anwendungseditor, der verschiedene Frameworks wie Vue und React unterstützt.
9) Flems, minimalistische Seite, perfekt für schnelle Tests.
10) JSBin, eine minimalistischere Version von JSFiddle, um Webseitencode zu schreiben und zu sehen, wie er aussieht.
11) CSSDeck ist eine einfache Site zum Testen einiger grundlegender HTML / CSS- und JS-Ideen.
12) ICECoder, eine andere Online-Umgebung zum Testen von Code, in der Sie ein Programm herunterladen müssen, das im Browser ausgeführt wird und auch offline verwendet werden kann.
13) Plunker, ein Front-End-Tool, mit dem Sie Code, Dateien und Webseiten schreiben und auf Github speichern können.
14) Scrimba ist eine innovative Kombination aus Video- und Code-Editor, die eine perfekte Lernumgebung für Schüler und diejenigen darstellt, die lernen möchten.
15) WebMaker, ein Webanwendungsersteller mit Offline-Funktionalität und Integration in CodePen.
16) Dabblet, um zu versuchen, HTML / CSS / JS-Code mit schönen Grafiken und automatischer Korrektur für CSS-Code zu schreiben.
17) PlayCode ist auch eine Umgebung zum Echtzeit-Testen von grundlegendem HTML / CSS / JS-Code.
19) JSItor ist eine weitere Alternative zu Codepen und JSFiddle, bei der Sie Code schreiben können, indem Sie HTML, CSS und Javascript kombinieren und sofort das Ergebnis sehen.
LESEN SIE AUCH: Websites zum Erlernen des Programmierens durch Spielen mit interaktiven Kursen und Herausforderungen
Dies sind keine einfachen Code-Editoren, sondern Orte, an denen Sie Ihre Programmierung testen können, ohne sich Gedanken über Fehler machen zu müssen, und schnell herausfinden können, wo die Fehler liegen. Codepen und JSFiddle sind die beiden beliebtesten Websites in dieser Kategorie, aber es gibt auch viele Alternativen.
LESEN SIE AUCH: Hauptprogrammiersprachen für Apps und Websites
Websites zum Testen von Online-Code
1) CodePen
CodePen ist die beliebteste Website und wird von Programmierern verwendet, da sie kostenlos, intuitiv und einfach zu bedienen ist. Nachdem Sie ein Standard in der Welt der Programmierer geworden sind, suchen Sie einfach bei Google nach Seiten, die bereits von Codepen zusammengestellt wurden, und prüfen Sie sofort, ob Sie danach gesucht haben. Die flexiblen Anzeigefenster und die sofortige Ausführung des geschriebenen Codes machen es perfekt genug, um Javascript- und CSS-Animationen auszuprobieren. Darüber hinaus kann es problemlos mit externen Skripten (React, Vue und allem anderen, was über CDN verfügbar ist) verbunden werden.
CodePen verdient den ersten Platz in dieser Kategorie, jedoch werden einige Funktionen bezahlt, wie z. B. kollaboratives Codieren und ganzseitige Live-Ansichten (teilweise Live-Ansichten sind kostenlos).
2) JSFiddle
An zweiter Stelle (obwohl chronologisch gesehen eine der ältesten) in der Welt der Websites zum Schreiben und Ausprobieren von Programmcode steht JSFiddle, das sich vor allem an der Erstellung und dem Testen von JavaScript orientiert. Es kann auch für HTML und CSS verwendet werden und unterstützt Tipps zur Code-Vervollständigung. Für weniger erfahrene Benutzer ist es möglicherweise auch CodePen vorzuziehen.
Ein wichtiger Punkt für JSFiddle ist, dass es einen kostenlosen Kollaborationsmodus (einschließlich Sprach- und Text-Chat) bietet, sodass Sie gleichzeitig mit anderen Personen am Code arbeiten können.
3) Panne
Auf vielen Code-Sites können Sie HTML / CSS / JS codieren und statische Webseiten generieren, während Glitch einen kleinen freien Speicherplatz zum Speichern von Projekten bietet und das Ausführen von serverseitigem Code von Node.js. ziemlich einfach macht. Sie können gemeinsam auf Glitch programmieren,
Es kommt auch mit einer Reihe anderer fantastischer Funktionen: kollaboratives Codieren, Versionskontrolle, viele Lernressourcen, gute Integration in GitHub, einfaches Einbetten, eine Community, die um Rat fragt, bereits erstellte Projekte, die Sie frei ändern oder verwenden können, und das Visual Studio-Integration. Es ist eine großartige, schnelle und einfache Möglichkeit, eine Web-App zu starten (oder zu lernen, wie man das macht).
4) CodeSandbox
CodeSandbox ähnelt Glitch, ist jedoch etwas komplexer und vollständiger. CodeSandbox verfügt über eine flexiblere und anpassbarere Oberfläche, ermöglicht das Verteilen kompletter Web-Apps, bietet Platz zum Speichern von Dateien und erledigt die meisten grundlegenden Arbeiten, sodass der Programmierer nur noch schreiben muss.
5) Repl.it
Repl.it ist eine Entwicklungsumgebung zum Testen verschiedener Arten von Programmiersprachen wie Python mit Unterstützung von Front-End- und Back-End-Code. Sie ermöglicht das Verteilen von Websites und Apps, ist in GitHub integriert und verfügt über eine intuitive Benutzeroberfläche. Es mag für jemanden, der nur versucht, Webseiten zu entwerfen, etwas zu schwierig sein, aber für bereits erfahrene Programmierer ist es eine Ressource, die in Betracht gezogen werden muss. Wenn Sie nur Front-End planen oder wenn Sie neu im Code sind, aber wenn Sie alles regelmäßig planen, lohnt es sich, es zu erkunden.
6) Liveweave ist ein Web-Editor, der JSFiddle sehr ähnlich ist und mit dem Sie Code schreiben und ausprobieren können, der auf Websites verwendet werden kann. Er bietet Live-Vorschau-Funktionen, Code-Hinweise für HTML5, CSS3, JavaScript und jQuery und ermöglicht es Ihnen, das Projekt als Datei herunterzuladen zip. Sie können auch ganz einfach externe Bibliotheken wie jQuery, AndgularJS und Bootstrap hinzufügen.
7) CodeSandbox ist ein kostenloser Online-Bereich, in dem Sie Web-App-Projekte mit verschiedenen Frameworks wie React, Vue, Angular und vielem mehr starten können.
8) StackBlitz ist ein ausgezeichneter Javascript-Anwendungseditor, der verschiedene Frameworks wie Vue und React unterstützt.
9) Flems, minimalistische Seite, perfekt für schnelle Tests.
10) JSBin, eine minimalistischere Version von JSFiddle, um Webseitencode zu schreiben und zu sehen, wie er aussieht.
11) CSSDeck ist eine einfache Site zum Testen einiger grundlegender HTML / CSS- und JS-Ideen.
12) ICECoder, eine andere Online-Umgebung zum Testen von Code, in der Sie ein Programm herunterladen müssen, das im Browser ausgeführt wird und auch offline verwendet werden kann.
13) Plunker, ein Front-End-Tool, mit dem Sie Code, Dateien und Webseiten schreiben und auf Github speichern können.
14) Scrimba ist eine innovative Kombination aus Video- und Code-Editor, die eine perfekte Lernumgebung für Schüler und diejenigen darstellt, die lernen möchten.
15) WebMaker, ein Webanwendungsersteller mit Offline-Funktionalität und Integration in CodePen.
16) Dabblet, um zu versuchen, HTML / CSS / JS-Code mit schönen Grafiken und automatischer Korrektur für CSS-Code zu schreiben.
17) PlayCode ist auch eine Umgebung zum Echtzeit-Testen von grundlegendem HTML / CSS / JS-Code.
19) JSItor ist eine weitere Alternative zu Codepen und JSFiddle, bei der Sie Code schreiben können, indem Sie HTML, CSS und Javascript kombinieren und sofort das Ergebnis sehen.
LESEN SIE AUCH: Websites zum Erlernen des Programmierens durch Spielen mit interaktiven Kursen und Herausforderungen
