[Перевод] Программирование в облаке: Небольшой обзор Онлайн-IDE

Похоже, что всё сегодня переходит в «облака», которые являются туманным термин для определения программных приложений и хранилищ данных, размещенных на удаленных серверах где-то далеко по всему Интернету. Так что, если всё наше ПО переходит на облака, то почему бы не перейти инструментам, используемым для создания этого ПО? Ну, а некоторые инструменты, есть там прямо сейчас. Черт, даже GitHub недавно добавил базовые возможности редактирования. В этой статье мы рассмотрим некоторые многообещающие Онлайн-IDE.

Как сделать один сайт для всех устройств (Responsive Web Design)

Вчера была опубликована хорошая статья «Веб-дизайн. Каждому устройству свое представление». Несмотря на неплохие размышления, к сожалению, вывод в ней довольно глупый. А именно:



«Нужно определить, какими устройствами могут пользоваться ваши посетители, проработать и создать для этих устройств представление вашего сайта, определить устройство посредством проверки заголовков браузеров, и отправить наиболее подходящее представление.»

Почему это глупо

Во-первых, никто не сможет предугадать, какими устройствами будут пользоваться ваши посетители. Нужно ориентироваться не на устройства, а на разрешения.







Это скриншот из презентации «Beyond the mobile web by yiibu» (очень рекомендую).



Во-вторых, если вы не facebook или yandex, скорее всего, вы не потянете создание и поддержку разных версий сайта для каждого устройства. Да и это не имеет особого смысла. Потому что ситуация становится похожа на реалии пятнадцатилетней давности. Тогда делали сайт «под браузер», а сейчас автор предлагает делать сайт «под устройство».

Как сделать один сайт для всех устройств

Копируем исходный код без нумерации строк

Бывает при выводе информации требуется ее декорировать для лучшего восприятия, нередко оформление сопровождается в том числе и текстом. При выделении и копировании этой информации, оформление копировать не нужно, т.к. нужна только сама информация, и желательно в исходном виде. То есть при копировании часть выделенного текста не должна попадать в буфер обмена.
В моем случае это исходный код, который сопровождается нумерацией строк, так нагляднее и есть возможность сослаться на строку кода. Однако, если мы хотим скопировать часть кода, то он должен копироваться без номера строки.
Многие highlighter'ы этим грешат, при копировании кода копируют в том числе и номера строк. Выходят из ситуации по разному: либо используют хитрую верстку, при которой возможно несовпадении нумерации со строками (можно заметить на github например), или используют специальную кнопку, которая показывает в отдельном окне код без форматирования. Мне показались эти подходы неудовлетворительными, потому решил найти другое решение.
В данной заметке я опишу решение, к которому в итоге пришел. Решение, конечно, частное, но может кому то оказаться полезным в решении собственных задач.

HTML в PDF

В далеком 2008 году уже была написана подобная статья и я попытался применить знания, но, к сожалению, не справился с русским языком (на denwer-е работал, на хостинге нет). Возможно сказалось отсутствие опыта. А недавно нашел хорошую библиотеку и решил поделиться. Топик, скорее всего, адресован начинающим программистом и ни на, что не претендует.

[Ссылка] Ipad симулятор

Работающий симулятор Ipad, написаный на HTML + Jquery + CSS3.

Ссылка: http://habrahabr.ru/linker/go/111299/


Источник: Хабрахабр - Web-разработка
Оригинальная страница: [Ссылка] Ipad симулятор

[Перевод] CSS трюки — пишем сайт без html

В качестве предисловия к переводу. Открываем Firefox/Opera, переходим по ссылке, смотрим исходный код страницы и удивляемся. Потому что его нет. Под катом рассказ, как такое можно сделать.

[Перевод] Релиз Firebug 1.6

Рабочая группа Firebug Working Group с гордостью представляет релиз Firebug 1.6!

Мы внедрили множество новшеств, которые приведены на странице заметок к релизу Firebug 1.6. Пожалуйста, просмотрите список изменений и дайте знать, если вам необходима любая дополнительная информация.

Мы тяжело трудились, но большая часть новшеств никогда не увидела бы свет без вклада от сторонних разработчиков, переводчиков и дизайнеров. Полный список участников разработки смотрите на специальной странице в нашей вики.

Мы значительно повысили стабильность Firebug'а и избавились от множеств утечек памяти — мы утверждаем, что это лучший релиз Firebug'а за всю историю.

Онлайн-песочница с табами и файлами

Для публикации примеров и задач на английской версии javascript.ru понадобилась песочница чуть помощнее чем jsfiddle/jsbin.

Написал, выложил бету на javascript.info/play/demo (сам сайт там пока полузакрыт).

Дополнительные возможности включают в себя:

• Файлы
• Табы
• Хоткеи (пока кроме Opera)
• Экспорт в zip
• Сохранение с возможностью листать предыдущие ревизии

Задумывалось оно для простой цели — публикация примеров, задач, решений в удобном для просмотра онлайн и редактирования виде. Буду рад, если сгодится на что-то еще.

P.S. Кстати, в Питере, Москве — завтра и через неделю мастер-классы по javascript — javascript.ru/mk.
В Украине — в декабре. Присоединяйтесь, коли будет интерес :).


Источник: Хабрахабр - Web-разработка
Оригинальная страница: Онлайн-песочница с табами и файлами

[Перевод] WYSIWYG HTML редактор в браузере. Часть 2

Это вторая часть перевода статьи о свойствах designMode и contentEditable, их поведении и особенностях.

В статье рассматриваются базовые принципы и проблемы унификации особенностей редактирования в современных браузерах. Темы рассматриваемые в статье:

• Различные методы включения режима редактирования
• Команды редактирования
• HTML генерируемый в процессе редактирования
• Взаимодействие с DOM

[Перевод] WYSIWYG HTML редактор в браузере. Часть 1

Это первая часть перевода статьи о свойствах designMode и contentEditable, их поведении и особенностях.

В статье рассматриваются базовые принципы и проблемы унификации особенностей редактирования в современных браузерах. Темы рассматриваемые в статье:

• Различные методы включения режима редактирования
• Команды редактирования
• HTML генерируемый в процессе редактирования
• Взаимодействие с DOM