Хочу рассказать про популярный инструмент для демонстрации своих примеров — jsFiddle. Например, им очень удобно пользоваться на таких сайтах как Stackoverflow. Я не раз использовал этот сайт для создания узко–специализированных демо для багов. Также он очень уместно использован для проекта Highcharts в качестве наглядных демонстраций различных опций.
Использование
В главном окне предлагается три области для ввода (HTML, CSS, JavaScript) и одна область для вывода результатов.
В верхнем сайдбаре есть две главные кнопки “Run” и “Save”.
“Run” — заставляет область результатов обновиться. “Save” — обновиться и увеличить номер версии демо на один пункт.
Настройки демонстрации
* В первой секции “Choose framework” можно выбрать какой фреймворк (jQuery, MooTools, etc.) использовать и подключать ли normalize.css.
* В секции “Add Resources” можно подключать сторонние JavaScript библиотеки и CSS файлы.
* Секция “Info” позволяет задавать мета-теги title, description и выбирать doctype.
Кабинет
- В разделе Dashboard выводятся все сделанные вами fiddl’ы.
- В раздел Your Public Fiddles попадают только те работы, в которых вы задали
titleв панели Info настроек fiddl’a
От себя
Советую всем научиться пользоваться этим замечательным ресурсом и показывать свои миниработы с помощью этого проекта. Мне кажется, что это самый лучший проект для этих целей.