JavaScript *

На днях мистер Дуб принял мой первый pull request с примером в Three.js, и на радостях я решился написать о нём хабропост. Если вам вдруг захочется написать трёхмерный платформер на Three.js, но вы не особо представляете себе, как это сделать, этот пример — для вас:

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

Сегодня ночью я стал свидетелем довольно-таки интересной ситуации.

Примерно в 23:50 по московскому времени на страницах моего сервиса перестал выполнятся код, использующий библиотеку JQuery.

После недолгих исследований проблемы мне удалось выяснить, что данное происшествие напрямую связано с просроченным SSL сертификатом домена code.jquery.com, который я использую для подключения jquery на своем сайте.

Немногим известно, что IP телефоны Digium — это не совсем обычные телефоны. Казалось бы зачем производителю выпускать аппараты собственной марки на таком насыщенном и низкомаржинальном рынке? Но поверьте — оно того стоило. Помимо отличных физических характеристик: приятный пластик, яркий экран, отличные динамики и микрофон. Эти аппараты обладают своим API и вы можете написать свое приложение под них!

Кто другой может похвастаться таким функционалом?

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

Webhook

Webhook — это платформа для создания сайтов. Важно не путать со статическими генераторами, потому что это именно «CMS builder». Проект успешно завершил кампанию на Kickstarter 14 мая этого года, где смог собрать сумму в два раза большую, чем было необходимо. А буквально недавно состоялся релиз первой версии продукта. Webhook построен с использованием NodeJS, Grunt и Firebase для реалтайма, работает на Windows, Linux и Mac, внутри целая система виджетов со множеством вариаций на выходе, «Django-like templating» с помощью Swig JS, кроссплатформенная админ панель и еще целый ряд плюсов.

Недавно прочитал неплохой пост на тему поиска работы QA и подумал, что похожий пост был бы полезен для JavaScript разработчиков. В конечном счёте, веб движется вперед семимильными шагами, и соискателей на позицию JavaScript программиста хоть отбавляй (разумеется, хороших всегда меньше).

Привет, %username%! Хочу написать маленькую статейку о том, как с помощью OpenStreetMap, OSRM и Leaflet прокладывать маршруты в своем проекте. Рассказывать что представляют из себя вышеуказанные технологии я не буду — на хабре о них писалось не раз уже, статья будет маленькая и только по делу. Итак, если вы хотите строить маршруты — прошу под кат.

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

Зачем нужны линзы

Начнем, пожалуй, с ответа на вопрос, зачем же нужны линзы.

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

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

Совсем скоро вместе с обновлением ночной версии Firefox появится возможность легко и просто смотреть все DOM-события на странице.

Перевод статьи «18 Surprises From Reading jQuery's Source Code», David Aragon.

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

В этой статье я не буду говорить о том зачем в javascript нужны промисы и в частности JQuery.Deferred. Также не буду приводить справочную информацию, ее достаточно в интернете. Например тут или тут или вот тут.
Эта статья для тек кто уже немного знаком с объектом Deferred из библиотеки JQuery, но не имеет опыта написания сложных цепочек (очередей).

Подготовка

Все примеры кода, рассмотренные здесь, используют асинхронный метод $.ajax(), который возвращает так называемый jqXHR в котором реализованы промис-методы (done, fail, always, then). Нам нужны будут только они, поэтому будем считать что $.ajax возвращает промис (promise).
В некоторых примерах используются методы $.map() и $.each(), которые входят в состав библиотеки JQuery.

Последовательное выполнение

Простейшее использование промисов — это последовательное выполнение асинхронных операций. То есть следующая операция не начинается пока текущая не закончится.

$.ajax('http://echo.jsontest.com/id/1')
.then(function(result){
    console.log(JSON.stringify(result));
    return $.ajax('http://echo.jsontest.com/id/2')
}).then(function(result){
    console.log(JSON.stringify(result));
    return $.ajax('http://echo.jsontest.com/id/3')
}).then(function(result){
    console.log(JSON.stringify(result));
});

Живой пример тут.

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

Basket.js

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

basket
    .require({ url: 'missing.js' })
    .then(function () {
        // Success
    }, function (error) {
        // There was an error fetching the script
        console.log(error);
    });

Введение

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

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

Хочу представить программную платформу автоматизации для дома на базе Node.js, которую можно скачать со всеми исходниками и установить прямо сейчас практически одним кликом (Windows) или одной командой (Linux/Debian).

Перевод статьи «Building robust web apps with React: Part 1, in-browser prototypes», Matt Hinchliffe

От переводчика: это первая статья из цикла «Building robust web apps with React».
Переводы:

• Построение надежных веб-приложений на React: Часть 1, браузерные прототипы
• Построение надежных веб-приложений на React: Часть 2, оптимизация с Browserify
• Построение надежных веб-приложений на React: Часть 3, тестирование с Jasmine
• Построение надежных веб-приложений на React: Часть 4, серверная генерация

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


404PageFound содержит до сих пор работающие сайты, созданные еще в 1993 году.

Angular Light — это самостоятельный клиентский MV(C/VM) фреймворк, который построен на идеях Angular.js и Knockout.js, и похож на упрощенный Angular.js

Основные изменения за последнее время:

• Поддержка «совеременных» браузеров без зависимостей (12kb): Google Chrome, Firefox, IE9+ (для IE8 нужен jQuery)
• Сделан модуль анимации, можно использовать CSS от Angular.js 1.2+
• Одноразовый биндинг — после получения первых данных $watch удаляется, для этого нужно дописать "::" в начало, например {{::variable}} вместо {{variable}}.
• Сохранение результирующего списка в директиве al-repeat, после применения фильтра исходный список может изменится и иногда нужно получить результат, например для определения кол-ва элементов или для вывода «список пуст». Использовать можно так: al-repeat="item in list | filter store to variable", пример.
• Появился «track by» для директивы al-repeat — способ идентификации элементов в списке, работает по аналогии ng-repeat из Angular.js
• Теги для al-app, позволяют делать биндинг разных частей DOM к одному scope. Бывает полезным когда на странице используется несколько разных фреймворков и не желательно «захватывать» весь документ, с помощью тегов приложение можно «раскидать» в разные места, пример.
• В ф-ии $watch появилось событие $finishBinding, оно срабатывает после того как произойдет биндинг. Это можно использовать в место timeout в директивах (или контроллерах :) ).
• Появилась возможность в любой момент сделать текстовую директиву статической с помощью env.finally()

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

Awesome Awesomeness

В прошедшие несколько недель мне регулярно попадались Awesome-* проекты, о которых я упоминал в последних подборках. Началось все с Awesome-PHP, потом появились «живые списки» полезностей для сисадминов и питонистов. Все заметили положительную тенденцию и как по желанию это переросло в целый тренд. Сейчас есть коллекции инструментов для языков Ruby, Go, NodeJS, JavaScript, Java, Scala, Bash и др. Уже даже существуют подобные наборы для целых направлениям в ИТ, к примеру Big Data. Awesome Awesomeness — это живой список живых списков всего самого необходимого для разработчика из той или иной сферы.

Breach — полноценный браузер на JavaScript

Перевод статьи «JavaScript Modules» с сайта jsmodules.io.

В новой версии JavaScript появится модульная система, главным образом вдохновленная идеей модулей Node.js.
В этой статье я расскажу, как это будет работать.

Создание модуля

В качестве упражнения, мы построим простой asap модуль, который позволит назначать выполнение действий «как только так сразу» асинхронным образом. В Node.js, вы можете сделать это при помощи process.nextTick, есть и разные подходы, которые работают во многих браузерах. Мы создадим модуль, который будет работать в любом окружении.¹

В этом посте я хочу обобщить и поделится полученным опытом при разработке библиотеки node-queue-lib. Я расскажу о технологиях, которые помогли мне довести дело до финального конца — работоспособного кода, который уже работает на одном из моих сервисов. Особенностью данной библиотеки является кросс-платформенный клиент, т.е. клиент работающий в node.js и браузере и основан на одном и том же коде. В посте будут описаны следующие инструменты, без которых разработка этой библиотеки превратилась бы в ад:

• Тестирование (jasmine_node)
• Покрытие кода тестами (istanbul)
• Сборка клиенткой части библиотеки (browserify)
• Автоматизированное тестирование клиента (phantomjs)
• Поиск утечек памяти (memwatch)

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

И дополнительно, повторю, что статья обзорная, и не ставит целью научить Вас виртуозно пользоваться всеми перечисленными инструментами. Я лишь покажу дверь, но откроете Вы её сами…

Мы рассказали про новый 2ГИС почти всё. Точнее, почти обо всём, с чем сталкивается пользователь. Настало время рассказать о том, что у него “под капотом”. Угадали, речь об API 2ГИС.

Если вы пользовались новым 2ГИС с момента его появления, вы уже видели 2GIS API 2.0 в деле. Сегодня же он вышел из статуса беты и стал доступен всем желающим. Отдельно хотим поблагодарить тех, кто участвовал в тестировании: ребята, спасибо, вы помогли сделать продукт именно таким, каким он получился. То есть более, чем неплохим.

Если вам не терпится попробовать новый API, то посмотрите сюда. Те, кто любит не только смотреть, но и читать, загляните под кат.