Рубрика «javascript» - 365

Самые нужные плагины для Grunt - 1

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

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

А еще я выложил подборку на GitHub, чтобы каждый мог пополнить коллекцию.

Читать полностью »

Видео, подкасты

ES6 vs Today
An Angular2 Todo App: First look at App Development in Angular2
Async Apps with React and Flux
A 90 minute overview of ECMAScript 6
Building with React.js
Intro to Webpack
io.js with Isaac Schleuter and Mikeal Rogers
Читать полностью »

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

Минимальное исследование существующих веб-инструментов работы с электронными таблицами показало, что разработка на их основе потребует времени в разы больше. Например, связка PHPExcel и какой-нибудь AJAX-таблицы выливалась в разработку функционала полноценного сайта. К тому же требующего отдельного хостинга в целях безопасности. Теоретически рассматривался вариант MS Excel + VB script, но и тут были свои подводные камни. В итоге выбор пал на Google Sheets.
Читать полностью »

Open Data Protocol (OData) – это открытый веб-протокол для запроса и обновления данных. Протокол позволяет выполнять операции с ресурсами, используя в качестве запросов HTTP-команды, и обмениваться данными в форматах JSON или XML.

OData является одним из лучших стандартов для создания RESTful API.

Вы можете запрашивать данные используя простые HTTP запросы, например:

http://nitrosdata.com/service/testdb/person?$filter=firstname eq «Lamar»
Найти всех людей по имени Lamar.

OData позволяет задавать огромное число параметров, которые позволяют сформировать очень сложные запросы к источнику данных, например:

http://nitrosdata.com/service/testdb/book?$filter=publisher/president/likes/author/firstname eq 'Georgie'&$top=10&$orderby=title
Выбрать все книги, удовлетворяющие следующему условию: президент издательства в котором издана книга, любит книги некоего автора с именем “Georgie”. Результат запроса необходимо отсортировать по названию, выдать первые 10 книг.

Язык запросов OData сопоставим по мощности с SQL.
Читать полностью »

image Приветствую. Представляю сообществу проект Konva.js.

Konva.js — это фреймворк, который позволяет работать c canvas 2d в объектном стиле с поддержкой событий.

Кратко список особенностей выглядит так:

  1. Объектное API
  2. Вложенные объекты и «всплытие» событий
  3. Поддержка нескольких слоёв (нескольких canvas элементов)
  4. Кэширование объектов
  5. Поддержка анимаций
  6. Настраиваемый drag&drop
  7. Фильтры
  8. Готовые к использованию объекты, включая прямоугольник, круг, изображение, текст, линия, SVG путь, ..
  9. Простое создание собственных фигур
  10. Событийная архитектура, которая позволяет разработчикам подписываться на события изменений аттрибутов, отрисовки, и так далее
  11. Сериализация и десериализация
  12. Продвинутый поиск с помощью селекторов stage.get('#foo') и layer.get('.bar')
  13. Десктоп и мобильные события
  14. Встроенная подержка HDPI устройств
  15. и еще много разного

Далее подробней рассмотрим возможности фреймворка с примерами кода.
Читать полностью »

Мне захотелось наладить общение скриптов из разных вкладок браузера. Будущий API SharedWorker позволяет передавать данные между разными iframe и даже вкладками или окнами. В Chrome он работает давно, в Firefox — Firefox – недавно, а в IE и Safari его не видать. Но существует кроссбраузерная альтернатива, о которой мало кто знает. Давайте разбираться.

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

Когда-то давно друзья подарили вот такую головоломку:

Головоломка

Собрать её самостоятельно я так и не смог (всегда оставался один фрагмент). Посему было решено написать программу.

Для тех, кто не любит читать, решение доступно по ссылке (внимание, сильно нагружает процессор).
Читать полностью »

image

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

Как-то в выходной я решил отказаться от использования компьютера. Но ничего не вышло. Я наткнулся на Star Wars API. Этот простой интерфейс основан на REST, и с его помощью можно запрашивать информацию о персонажах, фильмах, космических кораблях и других вещах из вселенной SW. Поиска нет, но сервис свободный.
Читать полностью »

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

К примеру, мне потребовалось решить эту задачу при реализации JavaScript API к Comet сервису. Эта задача встречается достаточно часто и её уже рассматривали на хабре раньше здесь и здесь, но я решил написать своё решение задачи исходя из следующих требований к коду:

  • Кросбраузерность
  • Отсутствие зависимостей
  • Минимальный размер кода
  • Простота и удобство

Читать полностью »

У фреймворка AngularJS есть несколько интересных решений в коде. Сегодня мы рассмотрим два из них – как работают области видимости и директивы.

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

Если в следующей картинке вам что-то непонятно – эта статья для вас.

image

(В статье рассматривается AngularJS 1.3.0)
Читать полностью »


https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js