Просматривая одно из обучающих видео "Школы разработки интерфейсов" Яндекса, наткнулся на ссылку на офигенный труд израильской веб-программистки Тали Гарсиэль (Tali Garsiel) "How browsers work" (Как работают браузеры).

Она в течение нескольких лет отслеживала всю издаваемую информацию о внутреннем устройстве браузеров, изучала исходный код WebKit и Gecko и, в конце концов, собрала все воедино. Вот что пишет сама Тали:

Когда на 90% компьютеров был установлен IE, приходилось мириться с тем, что это загадочный «черный ящик», однако теперь, когда более половины пользователей выбирает браузеры с открытым исходным кодом, пришло время разобраться, что скрывается у них внутри, в миллионах строк программного кода на C++...

Пролистав, я был поражен — отличная работа. Внутреннее устройство браузеров, алгоритмы разбора — все хорошо иллюстрировано, доступно и понятно. И без излишних подробностей, страниц на 30-40. Как раз то, что нужно. Решил — это надо обязательно перевести. Покопался еще немного — оказалось перевод уже как 1,5 года есть!

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

Под катом содержание перевода, чтобы решить стоит ли читать.

Известные нам по гениальным обучающим скринкастам Rails for Zombies, Try Ruby и Try Git — команда Codeschool объединилась с корпорацией добра для создания Try DevTools — подробнейшего обучающего курса из семи глав, который, конечно же, является абсолютно бесплатным.

Эта маленькая библиотека позволяет очень просто создать пошаговое введение для сайта или приложения. Достаточно добавить атрибуты data-intro и data-step с описанием и номером шага соответственно к нужным элементам страницы. Вот так:

<a href='http://google.com/' data-intro='Hello step one!' data-step='1'></a>

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

Сегодня в детском выпуске:

• вода течет вверх;
• цветы на воде;
• шарик лезет в банку;
• реактивный пакет;
• виноград в бокале;
• атмосферное давление.

Внимание:

В этом выпуске все опыты безопасны для здоровья и полезны для ума. Рекомендуется для демонстрации детям и взрослым :).

Ниже смотрите 6 видео.

С каждым днем сайты становятся все сложнее и динамичнее. Уже недостаточно просто «оживить» интерфейс — все чаще требуется создать полноценное одностраничное приложение. Ярким примером такого приложения является любая web-почта (например, Mail.Ru), где переходы по ссылкам приводят не к перезагрузке страницы, а только к смене представления. А это значит, что задача получения данных и их отображения в зависимости от маршрута, которая всегда была прерогативой сервера, ложится на клиент. Обычно эту проблему решают с помощью простенького роутера, на основе регулярных выражений, и дальше не развивают, в то время как на back-end этой теме уделяют гораздо больше внимания. В этой статье я постараюсь восполнить этот пробел.

Внезапная история из прошлого! Дело было так. Несмотря на то, что я программист «немного другого толку», обратились ко мне со стандартной просьбой – сделать сайт. Обычно я не берусь за подобные дела, но в этот раз решил немного подзаработать, тем более что это был не сайт-визитка или интернет-магазин, а нормальный сайт с базой некоторых объектов, объекты добавляются-редактируются-удаляются (аля CRUD) и с ними необходимо выполнять некоторые операции. О! подумалось мне, да это идеальная задача для (название фреймворка скрыто) и после всяческой бухгалтерии я незамедлительно приступил к делу.

Собственно дальше ничего интересного и необычного так и не произошло. Спустя какое-то время заказчику был продемонстрирован сайт. И… он остался доволен. Очень неожиданное завершение истории.

Правда, появилась небольшая как бы просьба. Файловый менеджер, тот, с помощью которого на сайт в статью можно вставить картинку, ему не понравился. Вот хотелось ему чтобы всё как-то проще было. А тут и кнопок целых 20! Да и действий много. А нужно-то всего-навсего загрузить картинку на сервер и вставить на страничку. Ну ладно, подумал я, их же целый интернет, да и сам я много раз делал подобные решения. Но один страшен, как чёрт, другой по одному файлу загружает за раз, а вот третий ничё так вроде, но платен. В общем, история завершилась быстро, созданием простенького файлового менеджера с нуля. Но как-то сиделось мне, да и взгрустнулось. И выпил я (сока с мякотью, конечно). И открыл IDE и понеслось…

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

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

Формы состоят из самых разных элементов интерфейса. Если вы не знаете, как правильно с ними обращаться, вы можете сильно усложнить заполнение форм. Чаще всего ошибаются, применяя выпадающие списки (select menu).

Когда использовать

Иногда можно встретить выпадающие списки с 2 вариантами, иногда — с более чем 20. В обоих случаях это неправильно. Если у пользователя есть менее 5 вариантов выбора, следует использовать радиокнопки. Так выбор будет проще и быстрее, потому что пользователю нужно лишь взглянуть на варианты и один раз кликнуть. С выпадающим списком ему нужно нажать на него, найти подходящий вариант и кликнуть снова. Также другие варианты не видны, пока вы не нажмёте на выпадающий список. Если их меньше 5, лучше наглядно показать их в форме в виде радиокнопок — пользователи смогут быстро их просмотреть.

На хабре много статей посвященных редактору Sublime Text 2. Обычно они рождают за собой множество комментариев, где сторонники ST2 и всевозможных других редакторов (а также полноценных IDE) предаются веселому процессу «достоинствометрии».
Однако, среди комментариев мне лично ни разу не встречалось упоминаний о плагине SublimeClang, который кардинально меняет работу C++ программиста в этом редакторе. Поиск по хабру выдал всего 4 упоминания плагина в комментариях.
Не знаю, чем вызвано такое игнорирование. Хорошие вещи не обсуждаются? ST2 не используют C и С++ разработчики? Своей статьей я хочу исправить ситуацию. Я расскажу о некоторых, возможно не очевидных, особенностях установки и настройки, а также поделюсь парой собственных приемов и скриптов.

О плагине

Итак, плагин обеспечивает автодополнение кода и проверку ошибок прямо по ходу написания программы. Для файлов C/C++/ObjC/ObjC++ плагин заменяет стандартное автодополнение редактора на свое собственное. Для этого, плагин в фоне прогоняет исходник через компилятор clang, который формирует AST. Полученную информацию плагин использует для интеллектуальных подсказок автодополнения.
Ближайший аналог, который я могу подобрать — это функция IntelliSense в MS Visual Studio.
Использование информации из первых рук — от компилятора — позволяет плагину правильно узнавать, какие переменные, функции, типы и т.п. доступны в данной конкретной точки программы. Так же, в какой-то мере работают Go to definition (alt + d, alt + d) и Go to implementation (alt + d, alt + i). Список остальных горячих клавиш доступен на странице проекта.

Я обожаю twitter bootstrap. Прост, местами логичен, достаточно красив, подходит для быстрого прототипирования веб-интерфейсов. Но этого оказалось недостаточно. Взяв twitter bootstrap в большой проект, мне пришлось целиком его разобрать и переосмыслить css-фреймворки как боевые единицы в веб-проектах. В результате переосмысления родились требования к любому css-фреймворку, удобному как верстальщику, так и frontent-разработчику.

TL;DR
Эта обзорная статья. Такое себе "краткое содержание предыдущих серий". Она будет полезна для новичков, или тех, кто не следил за отраслью в последнее время. Для новичков это будет первый шаг во "Вселенную JavaScript", бывалые смогут освежить свои знания.

У JavaScript очень удивительная судьба. Он преодолел путь от самого не понимаемого до самого удивительного языка. У него было тяжелое детство:
Изначально Автор хотел написать функциональный язык. Но менеджеры хотели получить, «обычный» объектно-ориентированный. И чтобы было легко искать разработчиков для новоиспеченного языка синтаксис решили сделать похожим на Java и даже название сделали похожим.
Но на этом история не заканчивается. Java, JavaScript это торговые марки Sun (а теперь Oracle). Microsoft не мог воспользоваться именем JavaScript (Netcape и Sun дружили против Microsoft). В результате Microsoft решил сделать реверс инжиниринг JavaScript и назвал его JScript. Сделали реверс инжиниринг, и сделали его настолько хорошо, что даже содрали все баги в реализации. Позже решили сделать стандарт и назвали его ECMAScript.

Думаю, многие владельцы форумов на phpBB 3 уже знают, что стандартная капча, идущая в комплекте с форумом, особо не спасает.

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

Приветствую!

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

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

DivShot — отличный новый инструмент для работы с Twitter Bootstrap. С помощью него создавать прототипы интерфейсов с использованием популярного CSS-фреймворка стало до безобразия просто.

Вроде простой вопрос, даже не понятно что на него ответить, правда?
Мы все знаем как создать переменную, как получить значение переменной, как взять ссылку на переменную в конце концов.
Но как они работают изнутри?
Что происходит в интерпретаторе, когда вы изменяете значение переменной? Или когда удаляете ее?
Как реализованы типы переменных?

В этой статье я постараюсь раскрыть именно эти темы.

Abstract

Переменные в PHP выражены в виде неких контейнеров, которые хранят в себе тип переменной, значение, кол-во ссылающихся переменных на этот контейнер, и флаг — является ли эта переменная ссылочной.

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

Веб-сервисы постепенно начинают использовать новый сервис Dropbox Chooser, упрощающий интеграцию с Dropbox, и дополняющий уже существующий Dropbox API. В рамках нового сервиса разработчикам предлагается небольшой JavaScript-компонент, который можно встраивать в приложения, и который автоматически публикует или прикрепляет документы.

Документация по приему Яндекс.Денег не содержит конкретного примера на PHP, чтобы можно было максимально быстро все прикрутить, не разбираясь во всех деталях того, как работает прием Яндекс.Денег на PHP. Сделав автоматический прием Яндекс.Денег для нашего дата-центра, я хотел бы дать пошаговую инструкцию с примерами кода на PHP, чтобы значительно сэкономить время другим разработчикам.

Изначально автоматический прием Яндекс.Денег мне казался очень сложным. Но как выяснилось там все проще чем у WebMoney.

Шаг 1: Создаем HTML-форму для приема платежей

Сам код формы можно сгенерировать тут money.yandex.ru/embed/quickpay/shop.xml Но поскольку наша цель принимать платежи автоматически, то в HTML-форму нужно добавить id счета, который клиент нам оплачивает. И скорее всего, мы хотим получать полную сумму счета, т.е. хотим комиссию Яндекса 0.05% возложить на клиента, поэтому в результате HTML-форма
в нашем php-скрипте будет генериться так:

Не каждый веб-разработчик столкнется с AD хотя бы потому, что модуль для работы с ldap через php должен сперва настроить какой-нибудь администратор сервера. Но иногда это все-таки происходит — в фирме есть хороший админ и потребность в централизованном управлении сотрудниками.

Если сказать очень упрощенно, то именно этим AD и занимается — хранит информацию о сотрудниках и выдает ее разным приложениям и сервисам как база данных, допустим, MySQL. Для настройки и управления AD тоже может быть целый отдельный сотрудник, но реализация доступа через веб-интерфейс предсказуемо ляжет на веб-программиста. И тут могут возникнуть определенные трудности.

Доброго времени суток, хабравчане! В этой статье я подробно расскажу вам о трансформации и вращении в javascripte. Матрица трансформаций, на первый взгляд, штука непонятная и многие ею пользуются даже не осознавая, что она делает на самом деле, используя готовые значения из интернета. На MDC об этом рассказано скудненько, а информацию в английской Википедии тяжело назвать общедоступной. Постараемся разобраться в этом вместе.