---
title: Codestall
slug: docs/de/codestall
description: Entdecken Sie, wie Codestall, integriert mit Archbee, die Codierung effizienter macht, indem es Echtzeit‑Bearbeitungen von HTML, CSS und JS ermöglicht – perfekt für Styleguides und den Bildungsbereich.
image: https://cdn.images.archbee.com/bNBm7nPJgXjbjLyfbHNh2/Bvl-ub3oavd0E5Xf7Hpq-_archbee-codepen.png
icon: {"lucideIcon":"Codepen"}
createdAt: 2022-06-10T12:04:54.000Z
---

::Image[]{src="https://api.archbee.com/api/optimize/bNBm7nPJgXjbjLyfbHNh2/Bvl-ub3oavd0E5Xf7Hpq-_archbee-codepen.png" size="60" width="1200" height="676" position="center" showCaption="false"}

### Was ist CodePen?

**CodeStall** ermöglicht es Benutzern, **HTML**, **CSS**, und **JavaScript** in **ihrem Browser** einfach zu bearbeiten, und mit **Archbee** ist dieser Prozess noch weiter optimiert, da keine Softwareinstallation erforderlich ist. Diese Integration verbessert die Effizienz und den Komfort bei der Entwicklung.

Das Beste daran ist, dass Ergebnisse in Echtzeit angezeigt werden können, was schnelleres Debugging ermöglicht. Entwickler und Designer können außerdem Codeausschnitte (sogenannte pens) erstellen und mit dem Rest der Welt teilen.

### Wofür wird CodePen verwendet?

1. **Style-Guide für Ihr Projekt** - Sie können jederzeit den Online-Codeeditor von CodePen verwenden, um das Styling für Ihre Projektkomponenten zu erstellen. Auf diese Weise können Sie sicherstellen, dass Ihre Komponenten nicht durch Code beeinflusst werden, der für andere Komponenten gedacht ist. Sie können es sich als eine leere Leinwand vorstellen.
2. **Ein neues Framework oder eine neue Bibliothek lernen** - Sie müssen nicht jedes Mal eine neue Umgebung einrichten, wenn Sie sehen möchten, ob Ihre Änderungen funktionieren. Die Editoransicht zeigt gleichzeitig die drei Bearbeitungsbereiche und die Vorschau an, wobei die Endergebnisse bei jeder Änderung aktualisiert werden.

### Anwendungsfälle

1. Ein Kunde kann eine CodePen-URL in Archbee einbetten, um ein Beispiel bereitzustellen, das seine Dokumentation unterstützt.
2. Das Einbetten von CodePen kann als Benutzerhandbuch verwendet werden, wenn dies ein Standardvorgang in der Organisation des Kunden ist.

::codepen{url="https://codepen.io/DragosBulugean/embed/vqrgYq"}