Codepen.io Pro Account im Test

CodePen SMS-Service

Für Codedemos und sonstige CSS- oder Javascript-Experimente verwende ich sehr gerne CodePen. Letzte Woche habe ich ein E-Mail bekommen, mit dem Angebot CodePen PRO für 14 Tage gratis zu testen. Und genau das habe ich auch gemacht und meine Eindrücke zusammengefasst.

Live View

Live View ermöglicht es, dass ein Pen, das man gerade bearbeitet, im Fullscreen-Modus in mehreren Browsern und Geräten angezeigt und live aktualisiert wird. Das bedeutet, dass sich die verschiedenen Browser während man tippt automatisch refreshen. Ähnlich wie man es von Livereload oder Emmet LiveStyle kennt.

Auf dem CodePen-Blog gibt es ein Beispielvideo mit Live View im Einsatz.

CodePen Liveview

In meinem Test (siehe oben) habe ich in Chrome auf einem iMac die Änderungen gemacht und den Live View-Link in folgenden Geräten/Browsern geöffnet gehabt:

  • iMac - OS X 10.9. Firefox
  • iMac - Parallels Win 8 IE 11
  • iMac - Parallels Win 7 IE 9 (Live Update hat nicht funktioniert)
  • iMac - iPhone Simulator iPhone 4s
  • LG Nexus - Android 4.4 Chrome
  • Macbook Air - OS X 10.9. Opera
  • iPad Mini Retina - iOS 8 Safari

Die Updates passieren nahezu ohne Verzögerung. Sobald das Pen aktualisiert ist, sind auch die Live Versionen uptodate.

Asset Hosting

Also PRO-User kann man in ein Codepen Assets, wie Bilder, Javascript- oder CSS-Dateien, gemütlich per Drag & Drop hinzufügen. Außerdem gibt es auch den Asset Manager, der es möglich macht Assets zu verwalten und wiederzuverwenden. In zwei kurzen Videos sieht man wie beide Features funktionieren.

CodePen Assets

Collab Mode

Im sogenannten Collab Mode können 2 Leute gleichzeitig an einem Codepen arbeiten und haben zusätzlich auch noch die Möglichkeit direkt in dem Pen zu chatten.

CodePen Collabmode

Professor Mode

Im Professor Mode kann man jemandem auf dem eigenen Screen live beim arbeiten zusehen. Bis zu 10 Zuseher können gleichzeitig an einem Codepen im Professor Mode teilnehmen.

SMS

Wenn man in einem Pen auf den "Share"-Button klickt, kann man das Pen nicht nur auf Social Media Plattformen teilen, sondern sich auch den Link zum Codepen per SMS auf das Smartphone schicken lassen. Standardmäßig kann man 10 SMS im Monat verschicken und als PRO-User 100 im Monat.

Sonstiges

Weitere Features sind:

  • Private Codepens
  • Eingebundene Codepens ohne Restriktionen themen
  • Werbung wird nicht mehr angezeigt
  • Die Wahrscheinlichkeit, dass man mit einem Pen auf der Startseite landet ist höher
  • Man bekommt ein PRO-Badge neben den Namen

Fazit

Die Profeatures in CodePen sind die 75$ im Jahr auf jeden Fall wert, wenn man viel in Codepen arbeitet. Live View eignet sich sehr gut dafür, wenn man schnell und unkompliziert sicher gehen will, dass etwas in mehreren Browsern funktioniert. Der Asset Manager und das Asset Hosting sind essentiell, wenn man viel mit Bildern und externen Dateien arbeitet. Und der Collab und Professor Mode sind ideal für das Arbeiten im Team.

Aktuell investiere ich noch nicht in einen Pro-Account, aber sobald ich mehr in CodePen arbeite, wird sich das sicher ändern.

Manuel Matuzovic

Frontend Developer aus Wien.

Ein Kommentar zu “Codepen.io Pro Account im Test

  1. Hey Manuel.

    Danke für die Zusammenfassung.
    Live View scheint ja wirklich eine interessante Möglichkeit zu sein! Den Professor Mode finde ich auch sehr cool :)

    Falls du die Pro Version wirklich nutzt, wäre noch ein Artikel in zwei, drei Monaten interessant.

    Ahoi.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind markiert *