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

Я опишу особенности создания редактора карты памяти, который использует базу данных браузера. Причём, это будет не LocalStorage, который не может превышать 5 мегабайт. Объём данных сможет превысить 100-200 мегабайт, так как используется IndexedDB или webSQL, смотря что доступно в конкретном браузере.

Исходники выложены в открытый доступ на Github.

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

Секрет минимализма в том, что мы будем использовать проверенные в бою плагины:

1. Ydn.db — хранение информации в базе данных браузера с автоматическим выбором лучшего метода и единым API
2. jQuery context menu — контекстное меню, которое можно наполнять динамически при помощи Javascript
3. jsPlumb — расширение позволяющее рисовать линии между HTML элементами
4. jQuery UI — Drag&drop — перетаскивание элементов между собой

PS: Также мы научимся создавать «синглтон», облегчать себе асинхронное программирование при помощи jQuery и встроенного объекта $.Deferred(), а также при помощи плагина LiveReload, сохраним краску на клавише F5 при изменении свойств CSS и кода в HTML и Javascript.

Обработка ошибок в Go построена не на закостенелом механизме исключений, а на новом интересном механизме отложенных обработчиков. В качестве интересного исследования я реализовал такую обработку ошибок на Python. Кому интересно, заходите.

В июле мы вместе с ведущими IT-Kompot и релиз-инженерами Badoo Владиславом Черновым и Олегом Оямяэ записали выпуск подкаста «Процесс разработки и выкатка релизов в Badoo. Автоматическое тестирование. Девелоперское окружение».
Так как прошлый подкаст вызвал интерес у слушателей и читателей, то этот подкаст мы тоже превратили в статью.

О чем говорили:
Процесс разработки и выкатки релизов в компании Badoo. Используемые инструменты.

• GIT Workflow. Каждая задача в отдельной ветке;
• Использование JIRA, TeamCity и AIDA;
• Формирование релиза и выкатка двух релизов в день. Проблемы и их решения (откат, патчи и т.д.).

Автоматическое тестирование. Рецепт быстрого прогона большого количества тестов.

• Что мы используем;
• Как гоняем тесты;
• Code Coverage;
• Пускалка. 18000 тестов за 3,5 минуты.

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

В AngularJS, как известно, нет возможности штатными средствами сделать многоуровневую маршрутизацию, в которой перезагрузка нижних уровней маршрутов бы не приводила к пересозданию элементов верхнего уровня. Стандартный сервис $route инициализирует вид, контроллер и его scope целиком каждый раз, когда изменяется URL страницы.

Для решения этой проблемы написано несколько сторонних решений, включая известный ui-router. По ряду причин ни одно из решений для некоторых моих проектов не подошло, и я написал собственную библиотеку, которую здесь и представляю: angular-route-segment.

Что она позволяет делать?

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

Интернет сделал нас ленивыми!

Почему? Кто в последний раз посмотрел видео больше 3х минут? Кто прочитал пост больше 2 страниц? Какой заголовок более привлекателен, «63 способа бла-бла-бла» или «3 проверенных метода бла-бла-бла»? А если эти три проверенных метода выделены от основного текста, то это вообще гуд (можно не читать текст вовсе, а просто пробежаться по выделенным подзаголовкам).

В этом свои плюсы. Наш мозг эволюционировал, и обрабатывает информацию быстрее, чем, скажем, 15-20 лет назад (да и эволюционирует быстрее, чем это было возможно век назад). Как компании справляются с высокими нагрузками? Как процессор выполняет программу по возможности быстро? С помощью кэширования! (как вариант, но самый приоритетный). Что делает наш мозг, чтобы справиться с большой нагрузкой? Кэширует! Что именно и как — оставим на размышление ИИшникам (специалистам по искусственному интеллекту). В противном случае при увеличении размера обрабатываемой информации время «отклика» бы увеличилось в разы, и на ответ на «как добраться до ближайшей больницы?» уйдет больше времени, чем человек «в силе ждать». «Сила ждать» тоже уменьшилась, «размер» нашего терпения уменьшился, и мы быстро устаем, если продолжительность видео большая, размер статьи большой (на самом деле продолжительность может не влиять на терпение, больше всего влияет полезная информация, если «воды» меньше или вовсе нет, то и терпеть ничего не приходится, посему данный пост написан «эз лаконик эз посибл»).

Новые полезные инструменты, сервисы, статьи, бесплатности для веб-дизайнеров за июль 2013. Остальные подборки доступны по тегу "новое для веб-дизайнера".

Сервисы

I Want To Use — на сайте можно выбрать CSS-фичи, которые хотите использовать, и будет показан процент пользователей, которые смогут их использовать.

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

Ускорение набора текста с помощью добавления спецсимволов

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

Вольный перевод статьи Якуба Линовски — «A Good User Interface».

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

Запуск нового проекта, будь то технологичный стартап, мелкий бизнес либо совместное предприятие в виде крупной корпорации — это всегда проект из разряда «пан или пропал». В соответствии с многолетней формулой, вы пишите бизнес план, расхваливаете его инвесторам, собираете команду, выводите продукт на рынок и начинаете продавать настолько интенсивно, насколько это возможно. И скорее всего где-то в этой последовательности событий вас ждет неизбежный провал. Перевес не в вашу пользу: новое исследование, проведенное Шикхаром Гошем из Гарвардской Школы Бизнеса, показывает, что 75% всех стартапов терпит неудачу.

Однако недавно появилась важная противодействующая сила, которая может сделать процесс по запуску компании менее рискованным. Данная методология называется «бережливый стартап»: в ней при разработке проекта проведение исследований превалирует над детальным планированием, обратная связь с потребителем — над интуицией, итеративная разработка — над традиционным «большим предварительным проектированием». Несмотря на то, что данной методологии всего несколько лет, ее концепции, такие как «минимальный жизнеспособный продукт» и «повороты» — pivots — быстро укоренились в мире стартапа, и бизнес-школы уже начали приспосабливать к ним свои учебные планы.

Однако, движение бережливого стартапа еще не стало мейнстримом, и нам еще только предстоит почувствовать его полное воздействие. В большинстве своем оно примерно в том же состоянии, в котором было движение больших данных пять лет назад – состоящее в основном из терминов, которые пока что не осознаны в должной степени, и чьи последствия компании только начинают понимать. Но со все большим распространением, они кардинальным образом меняют общепринятые понятия о предпринимательстве. Новые предприятия, всевозможных видов, пытаются повысить свои шансы на успех следуя их принципам «fail fast» и постоянного обучения. И несмотря на название методологии, в долгосрочной перспективе дивиденды могут получить и крупные компании, применившие данные принципы.

В данной статье я предложу краткий обзор методов бережливого стартапа и то, как они эволюционировали. Что более важно, я объясню, как, в сочетании с другими трендами в деловой сфере, они могут положить начало новой предпринимательской экономике.

Впервые столкнувшись с MapReduce, я продолжительное время искал реальные примеры применения. Пресловутый поиск слов в тексте, встречающийся в каждой второй статье о MapReduce, искомым примером считать не будем. Наконец, на двух курсах по Big Data на Coursera, я нашёл не только живые примеры, но теоретическую подоплёку для более глубокого понимания происходящего. Возможность применить полученный багаж знаний не заставила себя долго ждать.

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

Интро

Это краткий перевод основных тезисов из брошюры «Web API Design. Crafting Interfaces that Developers Love» Брайана Маллоя из компании Apigee Labs. Apigee занимается разработкой различных API-сервисов и консталтингом. Кстати, среди клиентов этой компании засветились такие гиганты, как Best Buy, Cisco, Dell и Ebay.

В тексте попадаются комментарии переводчика, они выделены курсивом.

Собираем API-интерфейсы, которые понравятся другим разработчикам

Понятные URL для вызовов API

Первый принцип хорошего REST-дизайна — делать вещи понятно и просто. Начинать стоит с основных URL адресов для ваших вызовов API.

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

/dogs для работы со списком собак
/dogs/12345 для работы с отдельной собакой

Всем привет! В течение последних пяти лет я (Андрей Терехов) периодически писал на Хабре (и в общие блоги, и с недавних пор в блог проекта Ruward) различные материалы про маркетинг, продажи и клиентский сервис в веб-студиях и агентствах. Как правило, эти статьи получали положительный отклик от пользователей. Мы решили пойти дальше и составили самый полный курс из всех, которые я когда-либо читал (включая оффлайн), по данной тематике.

Мы записали более 8 часов видео, разбитых на 11 лекций, подготовили презентации, кейсы, материалы по теме, кучу разного рода примеров, образцов и шаблонов, которые могут пригодится в жизни веб-студии. Это все превратилось в большой спецпроект, который мы и анонсируем сегодня – www.megaplan.ru/digital.

Итак, какие темы вошли в наш курс из 11 лекций (заодно дам ссылки на мои материалы с хабра по этим же темам там, где они есть):

1. Структура интернет-агентства. Принципы проектного управления. Треугольник sales-pm-account. (по мотивам http://habrahabr.ru/post/66033/)
   
   
2. Ценообразование в веб-студии. Формирование расчетной сметы. Оправдание цены. Виды демпинга и способы борьбы с ним. (по мотивам http://habrahabr.ru/company/ruward/blog/169559/)
   
   
3. Функции службы маркетинга, основные каналы привлечения клиентов. Работа по разным сегментам ЦА.
   
   
4. Позиционирование — ищем ключевые точки. Собственный сайт студии/агентства — типовые ошибки. (по мотивам http://habrahabr.ru/post/121053/)
   
   

Документация по Ангуляру отлично подходит для начала работы и ковыряния в API. Однако, она не объясняет как организовать и управлять приложением, когда оно разрастется до десятков или сотен тысяч строк кода. Я собрал здесь некоторые из моих наблюдений и передового опыта по управлению расползающимися приложениями. Сначала взглянем на организацию, затем перейдем к некоторым советам по улучшению производительности и закончим краткой сводкой по инструментам, серверам и процессу сборки. Этот пост будет сосредоточен на больших приложениях, в частности, есть отличная статья по лучшим практикам AngularJS с декабрьской встречи, на которую также стоит взглянуть.

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

Задача

ВОШ — эффект, возникающий при стилизации текста подключаемым шрифтом, не установленным на компьютере пользователя. Проявляется, когда подключаемый шрифт ещё не успел скачаться, и стилизуемый текст отображается следующим шрифтом из значения свойства font-family этого элемента. Такое переключение шрифтов также может повлиять на размеры элемента, если они зависят от размеров текста в нём.
Эффект известен также как FOUT — так его назвал Пол Айриш.

При общих моментах, есть и особенности. Например, в Файрфоксе текст, который нужно будет отрисовать нестандартным шрифтом, в течение 3 секунд не отображается, в Хроме тоже есть подобная задержка. Если шрифт успеет скачаться за это время, текст отобразится сразу нужным шрифтом.

На эту тему здесь была такая статья. В ней последствия ВОШ рекомендовалось нивелировать грамотной игрой со шрифтами. К сожалению, иногда подключаются такие шрифты, которые слишком отличаются по характеристикам от стандартных.

На мой взгляд, директивы являются основной изюминкой декларативного стиля Angularjs. Однако, если открыть комментарии пользователей в разделе официальной документации Angularjs, посвященной директивам, то вы увидите, что самый популярный из них: «Пожалуйста, перепишите документацию, сделайте ее более доступной и структурированной. Начинающему разработчику на Angularjs сложно в ней разобраться» («Please rewrite a clearer well structured documentation of directives., this is not friendly to first time angular developers»). С этим трудно не согласится, документация пока еще сыровата и в некоторых моментах приходится прилагать большие усилия, чтобы разобраться в логике и сути функционала. Поэтому я предлагаю вам свой вольный пересказ данной главы в надежде, что кому-то это позволит сэкономить время, а так же рассчитываю на вашу поддержку и участие в комментариях. Итак, поехали!
Часть 1

Привет Хабр!

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



(Осторожно: под катом много примеров простого кода. Любителям «велосипедов» читать не рекомендуется. После роста популярности данного сервиса ожидается ликвидация угрозы глобального потепления массовое сокращение депрессий от рутинных задач при написании серверной части.)

Свой текущий стартап я запустил в марте 2012. До этого я занимался предпринимательской деятельностью в вебе с 1999 года. Я начинал в г. Кривой Рог, Украина. Допотопную телефонную линию, на которой периодически висели беседы неизвестных мне людей, мог пробить только модем USRobotics. С его помощью можно было попасть в магический мир — лучик надежды посреди тотальной бесперспективности.

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

7. Карта ума.

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

Для создания карты ума (её чаще называют английским термином «Mind map»), мы можем использовать специальное ПО, я рекомендую Xmind.