Backbone.js это каркас для создания RIA JavaScript приложений, его автором является Jeremy Ashkenas, создатель CoffeeScript, Backbone является частью компании Document Cloud ей же «принадлежит» Underscrore.js. Backbone — очень легкая библиотека, помогающая вам создавать интерфейсы. Она может работать с любыми библиотеками, к которым вы привыкли.

Backbone это набор классов, размером менее 4Кб, которые формируют структуру вашего кода и помогают создавать качественные MVC веб-приложения.

Backbone формирует структуру тяжелых JavaScript приложений, внесением моделей с key-value подобным хранилищем и своими событиями, коллекций с богатыми API, видов (ориг. views) с декларативной обработкой событий и соединяет все это в в одно приложение, поддерживающее RESTful JSON интерфейс.

Backbone не может работать без Underscore.js. Для поддержки REST API и работы с DOM элементами в Backbone.View настоятельно рекомендуется подключить json2.js и jQuery-подобную библиотеку: jQuery или Zepto

В статье будет рассмотрена структура Backbone.js, будет поэтапно создано простое Todo приложение.

Stephen Woods, фронтэнд-инженер в Flickr, объясняет, как создать простой лайтбокс с поддержкой жестов и дает советы для улучшения восприятия и производительности сенсорных интерфейсов.



Необходимые знания: средний уровень CSS, средний-продвинутый уровень JavaScript
Требования: Android или IOS устройство
Временные затраты: 2-3 часа
Скачать исходники
Просмотр демонстрации

Доброго хабрадня!

Сегодня я расскажу вам, уважаемые хабралюди, о том, как хранить свои данные в облаке и не переживать за них. Точнее, я расскажу об интересной возможности сделать шифрованный образ диска в Mac OS X средствами самой системы.

Для опытных пользователей (коих прошу не судить слишком строго) в данном топике пользы нет, можете не отвлекаться. Но многим, я уверен, информация может пригодиться.

Итак, сейчас мы создадим зашифрованный образ с помощью Дисковой Утилиты и сохраним его на Яндекс.Диск (благо теперь он позволяет хранить шифрованные данные).

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

1) Фотоманипуляции
2) Работа с интерфейсом (сайт и мобильное приложение)
3) Типографика
4) Создание иллюстраций и векторные фишки
UPD 1: Небольшое тестирование производительности и стабильности.

Итак, поехали.

Это продолжение статьи ХХ полезных советов для пользователей Git среднего уровня

Про reset, незапланированно снова про альясы, про замечательный filter-branch, про мерджи и разрешение конфликтов с помощью rerere, про rebase (интерактивный и не очень) и, в завершение, про обслуживание своей гитницы.

Предисловие

Я капризный. Я жалуюсь о многих вещах. Многое в мире технологий мне не нравится и это предсказуемо: программирование — шумная молодая дисциплина, и никто из нас не имеет ни малейшего представления, что он делает. Учитывая закон Старджона, у нас достаточно вещей для постижения на всю жизнь.

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

PHP — единственное исключение. Фактически каждая деталь PHP в какой-то мере поломана. Язык, структура, экосистема: всё плохо. И даже нельзя указать на одну убийственную вещь, настолько дефект систематичный. Каждый раз, когда я пытаюсь систематизировать недостатки PHP, я теряюсь в поиске в глубину обнаруживая всё больше и больше ужасных мелочей(отсюда фрактал).

PHP — препятствие, отрава моего ремесла. Я схожу с ума от того, насколько он сломан и насколько воспеваем каждым уполномоченным любителем нежелающим научиться чему-либо ещё. У него ничтожно мало оправдывающих положительных качеств и я бы хотел забыть, что он вообще существует.

Привет. Давеча мне довелось иметь дело с такой специфической фичей html как карта изображения. Скажу честно, что мне не часто доводилось использовать её, и то, обычно, всё обходилось зонами в форме прямоугольника. Но это был не тот самый случай. Задачей было повесить ссылки на отдельные регионы изображения, которым выступала карта страны, и, к сожалению, ни о каких канвасах или svg не могло быть и речи. Только html только хардкор! Итак, задача поставлена, гугл активизирован, можно и начинать.

Ура! Еще один, свеженький… чем он лучше других?



а) Новенький! Всегда, кто берется что-то делать, то обычно смотрит: есть ли в этом смысл, и если есть — делает это.
б) Красивенький! Можно не точить, а ставить из коробки. Основан на Bootstrap'е и иконках Glyphicons
в) Само собой мультиселект файлов, Drag&drop, прогрессбар и превьюшки фотографий.
г) Поддержка кросдоменного соединения, докачка и ресайз фоток на стороне клиента.
д) Готов для любой платформы сервера (PHP, Python, Ruby on Rails, Java, Node.js, и тому подобное.)

blueimp.github.com/jQuery-File-Upload

Поддержка браузеров:

github.com/blueimp/jQuery-File-Upload/wiki/Browser-support

Аннотация

В статье я попробую рассказать о том, как на базе Twitter Bootstrap можно очень легко реализовать приятный пользовательский интерфейс небольшого (одностраничного) web-приложения, владея лишь базовыми знаниями html. Сразу предупреждаю, специалистам будет не интересно, речь пойдет о базовом стандартном функционале.

jQuery однозначно стал стандартом в индустрии веб-дева. Есть много отличных js-фреймворков, которые заслуживают внимания, но jQuery поразил всех своей лёгкостью, изящностью, магией. Люди пишут с использованием jQuery, люди пишут плагины для jQuery, люди даже пишут статьи про jQuery, но мало кто знает (особенно из новичков), КАК устроен jQuery.

В этой статье проведем небольшой экскурс во внутренности этого фреймворка и разберем, что внутри.
Статья рассчитана на базовые знания Javascript. Задумайтесь и, если вы знаете, как написать клон jQuery, то, скорее всего, вы тут не найдёте ничего нового. Остальным — добро пожаловать под кат

Что такое “API-Centric” Web Application?
Это веб приложение которое большая часть функционала реализуется через API. Например: если вы авторизовываетесь, то вы отправляете свои данные через функции API, а API уже возвращает результат success или же ошибку. Другой характеристикой API является то что API не зависит от состояния пользователя.

Зачем это нужно ?
Как веб разработчики мы видим, что технологии развиваются каждый день. И все знают, что люди используют не только браузеры на pc, но и android, apple, windows phone и прочие гаджеты для доступа в интернет к своим любимым сайтам.

Так причём же тут API ?
Одним из преимуществ создания api-centric приложения это помощь в построении функциональности, которая может быть использована на любом другом девайсе, будь это браузер, мобильник, планшет или даже десктопное приложение. Все, что нужно сделать, это создать API, таким образом, чтобы все эти устройства могли взаимодействовать с ним.

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

Итак, первый совет. Забудьте всё что вы знаете о юнит-тестах. Швырните табуреткой в человека, который сказал вам, что без них не обойтись. Попробуем разобраться, в каких случаях нужно их использовать, а в каких — нецелесообразно.

Каждый программист оказывается в ситуации, когда ему необходимо изучить какую-либо новую технологию или же фреймворк. Если в вашем ToDo листе в графе «Изучить» есть такой компонент, как jQuery, то данный курс для вас.
Курс состоит из 30 видео уроков, длительность каждого из них составляет 15 минут. Чтобы зарегистрироваться на курсе, вам необходимо оставить свой e-mail на странице Learn jQuery in 30 days.

На данный момент в курсе присутствуют следующие темы:

1. DOM Traversal
2. Events
3. DOM Manipulation
4. Effects
5. AJAX
6. Plugin Development

Присоединитесь к 30942 студентам, которые хотят изучить jQuery.

Как подсказывает alphard, курс можно скачать с rutracker'а.

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

Эти 70 шаблонов проиллюстрированы сотнями примеров приложений для операционных систем Apple, BlackBerry, Android, Symbian, Windows и WebOS будут изданы O’Reilly Media как «Mobile Design Pattern Gallery». Ниже приведена одна из моих любимых глав — Приглашение.

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

Была на Хабре статья о реализации табов на чистом CSS, которую автор удалил (видимо, из-за незавершённости решения), скрыв при этом все комментарии. Благодаря авторской наработке я устранил один из недостатков юзабилити в решении и опубликовал его в комментарии. Поведение табов стало обычным, по клику на табе (или кнопке, смотря как назвать), он выделялся и оставался выделенным после отведения мыши. Чтобы не терять из виду то и другое решение и для продолжения их развития, приведу копии их. Решение автора makzimko скопировано в песочницу (IE9+), сохранив все необходимые свойства. Дополнение — в модификации там же (от IE9+). Новое (UPD3) кроссбраузерное решение с поддержкой от IE6 — на jsfiddle.net и единым файлом. Наконец, при том, что Opera 11.61 работает, для поддержки Оперы 11.50 и младше понадобилось небольшое исправление (UPD4).

Небольшой видеоролик про редактирование кода в vim.
Краткое содержание.
1. Использование аббревиатур.
2. Плагин MRU
3- Плагин tagbar
Сделано с помощью свободного редактора OpenShot — для изготовления видеороликов в домашних условиях он оказался вполне пригоден.

http://youtu.be/eagC7PcGcCk



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

В процессе работы над проектом с использованием Node.js в качестве серверсайда, возникла задача запуска JS скрипта в качестве сервиса, со всем плюшками типа start, stop, restart. По этой теме в принципе уже достаточно информации, но она в основном сводится к использованию Monit + Init под линуксом, либо кратких советов типа «use nodemon, Luke».

В моём случае в качестве продакшн-сервера была машина на FreeBSD. В качестве утилиты запускающей JS файл как процесс мне приглянулся forever. Эта штука, в отличии от nodemon, умеет следить за запущенными под ней процессами и поднимать их при падении без ожидания изменения в исходниках скрипта, что очень удобно именно на продакшене. К тому же forever умеет показывать текущий список запущеных процессов, с отображением их аптайма, ну и позволяет останавливать/перезапускать процессы по имени или индексу.

Недолго думая, был написан rc.d скрипт:

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

1. Сообщество или социальная сеть?
2. Как люди образуют связи
3. От слабых связей к сильным
4. Поддержание сильных связей

Автор этой серии публикаций — Майкл Ву (Michael Wu), ведущий аналитик компании Lithium, специализирующийся в изучении социальных взаимодействий и онлайн-сообществ.

---

Я хочу поделиться с вами своим недавними исследованиями, посвященными взаимосвязи между социальными сетями и сообществами.

С 2008 года социальные медиа становятся широко используемым и модным понятием в корпоративном мире. Вопрос в том, что такое социальные медиа? Одни, похоже, отождествляют это понятие с сайтами, называющимися социальными сетями, вроде Facebook. Другие думают, что социальные медиа — это блоги, микроблоги (вроде Twitter), Flickr, Youtube или любые другие аналогичные вебдванольные сервисы, основанные на коллективном обмене информацией между пользователями. Указывают на разные типы социальных медиа, начиная с сервисов социального взаимодействия (вроде Wikipedia, Delicious или Digg), и заканчивая онлайн-сообществами (вроде тех сообществ, которые мы создаем вокруг брендов или же таких как Yahoo! Answer).

Все эти определения в некоторой степени верны, если мы классифицируем социальные медиа по их функциональным признакам. С другой стороны, писатель и блоггер Брайан Солис (Brian Solis) предложил иную классификацию социальных медиа, основанную на способах общения между людьми. Он назвал свою классифиацию «Призмой общения» (conversation prism). Однако, если мы хотим понимать социальные медиа с точки зрения выстраивания связей между людьми в рамках социальной антропологии, мы обнаружим, что существует всего два основных типа социальных медиа:

1. Социальные сети
2. Онлайн сообщества

Кристофер Сандберг — это человек, который заставил зрителей шоу «Заговор ради добра» бегать по улицам Лондона и выполнять квесты, сражаясь против вымышленной недобросовестной корпорации. 3 февраля он читал лекцию в России, на которой пытался доказать, что такой бесполезный предмет как телевизор пока рано выбрасывать.

Предисловие

Давно хотел написать. Мысли есть, желание есть, времени нету… Но вот нашлось, так что привет, Хабра.
Здесь я собрал все идеи, которые помогали и помогают в разработке веб-приложений. Для удобства я разбил их на группы:

1. Память
2. Оптимизация операций
3. Выделение критических участков
4. Циклы и объектные свойства
5. Немножко о DOM
6. DocumentFragment как промежуточный буфер
7. О преобразованиях в объекты
8. Разбитие кода
9. События перетаскивания
10. Другие советы

Сейчас речь не пойдёт ни о каких библиотеках. Я постараюсь передать знания о механизмах самого языка, а не их реализациях в библиотеках.

Память

Хоть это и не должно волновать клиентского программиста, но не забываем, что память всё-таки не бесконечна и когда-нибудь может закончиться, например, когда запущено несколько массивных программ: офис, графический редактор, компиляция большой программы и др. Несмотря на то, что приведенный пример тривиален, у меня действительно такое случилось, хоть и не из-за браузера, но он тоже сыграл свою роль: 1,3 Гб оперативы (отладчик, около 30 вкладок), начались тормоза по перегрузке страниц ОП в файл подкачки.
Чтобы уменьшить расход памяти, я предлагаю несколько способов: