Сайт дня: Codepen - отличный подарок на День программиста

Сегодня, в 256-й день года, сайтом дня объявляется Codepen. В те далёкие годы, когда я сам писал не статьи, а код, если бы меня спросили, какой подарок я хочу на день программиста, я бы не задумываясь попросил сервис вроде Codepen. Только тогда у меня не хватило бы фантазии, чтобы предположить, что сервис для программиста может быть настолько крутым.

Сразу оговорюсь, "в далёкие годы" такой сервис, как Codepen был в принципе не возможен. Даже сейчас он поддерживает не все разновидности программирования, а только написание веб-приложений (на Javascript поверх HTML+CSS), но для начала это уже замечательно. К тому же, веб-приложения сейчас активно вытесняют десктопные программы, так что актуальность сайта Codepen растёт с каждым днём.

Если коротко, сайт Codepen позволяет писать и публиковать рабочие фрагменты кода (то, что иногда называют "сниппеты") вместе с результатом их выполнения. Главной фишкой Codepen является наглядность. Это выражено настолько, что в списке опубликованных сниппетов вместо описаний выложены миниатюры страниц, отрисовывающихся прямо в момент вывода списка. Некоторые примеры буквально завораживают далёких от компьютеров людей.

Страница отдельного документа на сайте Codepen содержит три небольших окна с кодом (HTML, CSS и Javascript соответственно), а основную часть страницы занимает результат выполнения кода - предпросмотр страницы с применёнными стилями и запущенными скриптами. Все изменения в коде сразу же отражаются на странице-результате. Нет никакой необходимости долго писать код и думать, как он будет работать, когда запустится в браузере. Можно почти мгновенно видеть результат изменения любого символа в коде.

Когда-то программисты делились своими программами с коллегами просто выкладывая в сеть исходники, которые надо было скачать, скомпилировать и суметь запустить, чтобы вообще понять, как выглядит результат работы программы. Теперь можно просто дать ссылку на страницу, где лежит и код и результат. Вот на такую:

Таким образом сайт Codepen - это отличный способ оперативно обсудить код прямо в процессе написания. Кроме того, это удобное и универсальное учебное пособие для начинающих веб-разработчиков.

Также профили на сайте Codepen можно рассматривать, как предельно наглядные заменители резюме для веб-кодеров, желающих произвести впечатление на потенциального работодатели или инвестора:

Также важно, что сайт Codepen - это не музейный экспонат, а достаточно активный сервис, которым пользуются настоящие программисты, которые работают над реальными проектами. Проще говоря, на Codepen всегда можно понять, чем сейчас заняты умы основной массы веб-кодеров.

В долгосрочной перспективе о многом говорит облако тегов сайта:

Обидно, что это чудо пока только для Javascript. Было бы круто, если бы так можно было выкладывать код на ассемблере, C++ или Erlang. Но когда-то и это было фантастикой. Возможно лет через десять я напишу на очередной день программиста про сайт, который будет поддерживать сотню-другую языков программирования с такой же лёгкостью, как Codepen поддерживает Javascript.

Кстати, это уже третья статья в "Сайтах дня" на Ferra.ru, которая посвящена Дню программиста. Первые две можно прочитать тут и тут.

Знаете ещё хорошие сайты? Пишите на sitesoftheday@ferra.ru.