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

Приветствую всех читателей и писателей хабра.

Хочу познакомить вас с компактным фреймворком (4.44KB gzipped, 14.04KB uncompressed), который позволяет несколько изменить взгляд на структурирование приложений. В «Матрешку» вложено чуточку магии, раскрыть которую позволит серия статей, озаглавленных следующим образом:

  • Введение
  • Наследование
  • MK.Object
  • MK.Array

Код для привлечения внимания:

mk.on( 'change:x', function() {
	alert( 'x is changed to ' + this.x );
});
mk.x = 2; // alerts "x is changed to 2"

И это работает в… IE8.

Что такое Матрешка?

Матрешка, как фреймворк
Компактный размер и легкая в изучении архитектура даёт возможность строить крупные расширяемые приложения. Этим сегодня никого не удивишь, но я постараюсь.
Матрешка, как библиотека
Если фичи, предоставляемые Матрешкой вам понравятся, то не обязательно менять свой код. Матрешкой можно пользоваться, как набором классов с интересными методами.
Матрешка, как платформа для создания собственного фреймворка
Матрешка — расширяемый фреймворк общего назначения, который не позиционируется, как MVC, MVVM или %your_design_pattern% фреймворк, поэтому программист имеет возможность реализовать собственную архитектуру, которая будет уметь желаемый набор шаблонов проектирования.

Зачем?

Мне часом надоело думать о представлении и о том, чтоб его менять написанным мной кодом. Все костыли синхронизации данных и представления в Javascript вызывают у меня негативные чувства, и амбиционной, направленной в будущее, целью Матрешки является возможность полностью забыть о том, что у нас есть UI, оперируя только данными. Конечно же, решить эту задачу невозможно на 100%, но мы, программисты, должны выжимать максимум из данных нам инструментам, дабы сделать код чище, короче и гибче. Пора встряхнуть свой код и стать злым.

Гифка для привлечения внимания

Matreshka.js — Введение

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

Здравствуй!

В этой открытой лекции я попытался сжато рассказать и показать полный цикл (full stack) разработки веб-приложений на JavaScript.

Начнем мы с короткого введения в язык, потом в двух словах поговорим о клиентской части, в частности, об MVC фреймворках вроде Angular.js, после чего перейдем на серверную часть: Node.js и MongoDB. В конце обсудим возможность автоматизации разработки и сборки проектов с помощью Grunt.js.

Скачать слайды и исходные коды.

Лекция была записана в офисе компании ChocolifeЧитать полностью »

Инженеры Firefox OS в своём блоге сообщили о том, что приложения для их операционной системы, выполненные по технологии Open Web Apps (другими словами, просто на HTML+JS+CSS) станут, условно говоря, «кросс-платформенными» и будут работать на целом ряде сторонних ОС без изменений исходного кода («like a native apps»). Правда, приложение всё-таки должно уметь приспосабливаться к размерам экрана и аппаратной части устройства.

На демо-видео показан процесс запуска некоторого приложения Short Clock, которое, как можно понять, не требует никаких пользовательских привилегий. Видно, что на Android, Windows, Mac OS и Linux происходит примерно следующее: приложение устанавливается из Firefox Marketplace из браузера в соответствующей операционной системе (при этом оно автоматически адаптируется к ней — происходит «repackage») и запускается «как нативное приложение». При этом подчёркивается, что «изменений исходного кода — ноль».

Примечательно то, что JavaScript в OWA-приложении может работать не только в пределах своего HTML, а и обращаться к существующим hardware API на каждой из перечисленных платформ. На видео видно, как в Android устанавливается приложение, требующее ряда привилегий.
Читать полностью »

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

Поэтому просим нам помочь понять, какие задачи нам делать сейчас, а какие отложить «на потом».

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

Ну и рекомендацию «Нафик это никому не нужно, идите делать сайты» тоже мы тоже примем.Читать полностью »

image

Приветствую всех, уважаемые харбожители!
В данном посте речь идет о том, как подружить карты яндекса и javascript framework angular.js для их совместной работы. Можно, конечно, использовать и google map, но для стран СНГ их качество оставляет желать лучшего.
Немного погуглив, и не найдя готового решения, пришлось писать свое. Кому интересно, добро пожаловать под кат.
Читать полностью »

С добрым понедельником!

Ковырялся давеча с одним универсальным, и потому до неприличного мощным, интерфейсом доступа к данным на Python-е. Неприличная мощь выражается в виде множества параметров на все случаи жизни, зачастую крайне экстравагантные и нужные только в 5% случаев. В итоге приходится дублировать всю пачку параметров и деталей даже в прямолинейных запросах, что вызывает пессимизм и желание заняться чем-то другим. И тут вспомнилась мне аналогичная история из моего далекого прошлого, которой и делюсь.
DSL на JavaScript для C++ или кодгенератор — это просто!
Читать полностью »

В своем предыдущем посте я писал о том зачем и почему нужно было сделать pybabel-hbs, экстрактор строк gettext из шаблонов handlebars.

Чуть позже появилась необходимость извлекать так же из json.
Так появился pybabel-json.
pip install pybabel-json либо на github

Там использовался лексер джаваскрипта встроенный в babel, но нюансы так же имелись, но пост не об этом, написанное там менее интересное, чем было в hbs плагине и вряд ли нуждается в заострении внимания.

Этот пост о том, как же в целом выглядит полный набор для локализации, от и до, что делать с данными из БД, либо из другого не совсем статичного места.
От и до включает в себя:
(должен заметить — что ни один пункт не является обязательным, все это достаточно легко подключается к любому приложению только частично и по необходимости)

— Babel. Набор утилит для локализации приложений.
— Grunt. Менеджер задач(task-ов),
— coffeescript. В представлении не нуждается, весь клиенстский код написан на coffee, и из него тоже нужно извлекать строки.
— handlebars — темплейты
— json — хранилища строк
— Jed. gettext клиент для js
— po2json. Утилита для перевода .po файлов в .json формат поддерживаемый Jed-ом

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

Hello World,

Helios Kernel — это библиотека для управления зависимостями между javascript-модуями, реализующая «классический» подход, часто встречаемый в других языках и средах — с помощью функции include().

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

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

Helios Kernel поддерживает динамическую загрузку (и выгрузку) зависимостей в рантайме, а сама библиотека и формат модулей являются совместимыми между nodejs и броузерной средой — то есть модули можно использовать без изменений или трансляции.

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

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

Internet Archive позволяет запускать Atari игры и старое ПО прямо в браузере

Два года ушло у команды Internet Archive на разработку JavaScript-порта MESS-эмулятора, позволяющего запускать старые игры и ПО (типа первого редактора таблиц) прямо в современном браузере. По словам разработчиков, разработка позволяет запускать все, от Atari-игр до старого-старого ПО.

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

В один прекрасный день, за пару часов до конца работы, мне приходит задача: «Нужно написать приложение для браузера, которое должно по клику пользователя отправлять данные со страницы на сайт клиента. Что за приложение и какой браузер — полностью на ваш выбор...».

Немного поразмыслив я пришел к варианту google chrome extension:

  • Crome использует Chromium движок, который является форком WebKit (а это Safari), так же не забываем Blink (а это уже новая (хотя я все еще использую старую с bookmarks'ами) Opera). Таким образом, написав расширения для chrome, мы с минимальными переделками (а то и без них) сможем его портировать на еще 2 браузера
  • Нет опыта работы с API Google Chrome
  • Google все-таки компания добра :)

Когда мысли немного улеглись, первое что я сделал — это ввел в поиске харба "расширение Google Chrome". Увидев обширный вариант статей по данной теме, я со спокойной душой ушел домой полностью уверенный в том, что завтра с утра прочитав их, к концу рабочего дня дело будет 'в шляпе' (как же я тогда ошибался). Прочитав парочку их них я имел общее представление о том как это работает, но этого оказалось мало для воплащения моих идей. Что ж, приступим…
Читать полностью »


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