Intl: JavaScript i18n

При создании веб приложений часто приходится решать однотипные задачи интернационализации. Получить строку с относительной датой (например, 1 day ago), вывести форматированную стоимость товара с указанием валюты или сравнить строки (подходящим для выбранного языка способом). JavaScript развивается достаточно быстро. В нем появились и развитые средства интернационализации.

Читать далее

Vue.js provide/inject

При создании сложных Vue приложений приходится решать много задач по разделению кода на части (компоненты и прочее). Когда мы уже разбили большой кусок кода на некую иерархию компонентов, то обычно передаем вложенным компонентам данные через свойства. Но если глубина, на которую необходимо передать данные вниз по дереву больше 1 уровня, то передавать через свойства не то, что неудобно, но и неправильно.

Читать далее

Vite – разработка на JS без сборки

17 февраля вышла Vite 2.0.

Vite – это инструмент относящийся к инструментам сборки для веб-разработки. Он использует ES6 модули (es imports, ESM) на этапе разработки (для запуска приложений в dev режиме) и Rollup на этапе компиляции приложения (сборки в prod режиме).

Читать далее

Web Workers API

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

Читать далее

Tether

Tether это – JavaScript библиотека, которая служит для закрепления положения абсолютно позиционированного элемента (прикрепляемого элемента) относительно другого элемента на странице. Например, это может быть всплывающая подсказка (tooltip) или диалог, которые отображаются над, под, слева или справа от определенного элемента (элемент-цель).

Читать далее

Webpack

Webpack – это сборщик модулей современных JavaScript приложений (в принципе любых веб приложений, у которых есть JavaScript часть). Когда он обрабатывает ваше приложение, то рекурсивно собирает граф зависимостей, которые требуются каждому модулю вашего приложения. Затем упаковывает все эти модули в небольшое число склеек (bundles), которые и грузятся  в браузер.

Для сборки веб приложений webpack заменит собой grunt, gulp (системы организации задач) и bower (пакетный менеджер клиентской части). Однако, так как у grunt и gulp область применения иная и не ограничивается сборкой, то в ряде случаев webpack можно и нужно встроить в задачи, контролируемые этими системами.

Читать далее

Promise

Promise (промисы) – удобный механизм организации асинхронного кода.

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

Чтобы нам понадобилось при этом. Несколько вложенных двуг в друга callback-функций (обработчиков). Такой код стал бы плохо читаемым. Так же, на бы хотелось иметь обработку ошибок. Для этого пришлось бы добавлять callback-функции и для ошибочных ситуаций. Для решения этой проблемы и существуют промисы.

Читать далее

Npm

Npm – это пакетный менеджер Node.js. Файл package.json содержит в себе информацию о зависимостях вашего приложения в части пакетов Node.js. Множество современных инструментов для разработки веб-приложений устанавливаются через данный менеджер пакетов (webpack, grunt, gulp, bower …).

Читать далее

Node.js

Node.js – это программная платформа на C++, которая транслирует JavaScript в машинный код, расширяя область применения данного языка далеко за границы веб-браузеров. Node.js может взаимодействовать с устройствами ввода-вывода и обращаться к сторонним библиотекам. Некоторое время его называли серверным JavaScript. Он может выполнять роль веб-сервера, но на этом его сфера применения не заканчивается. Десктопные оконные и мобильные приложения, программирование микроконтроллеров, сборка веб-приложения (в рабочем окружении веб-разработчика).

Читать далее

Yarn

Yarn – менеджер пакетов, который создавался для решения проблем пришедших с использованием npm. При использовании Yarn задачи по установке пакетов выполняются параллельно, а не последовательно, как в npm. Также гарантии использования указанных в проекте версий пакетов используется специальный файл yarn.lock, который хранит точные номера версий (как composer.lock для Composer). А еще Yarn имеет более лаконичный и удобочитаемый вывод лога в консоль.

Vue.js

Vue.js – это прогрессивный JavaScript фреймворк (на официальном сайте значится именно как фреймворк, а не библиотека) для создания пользовательских интерфейсов. Он довольно легок в освоении (имеет низкий порог вхождения) и не требует при внедрении масштабных изменений сразу. Позволяет начинать его применение (и уходить, к примеру, от jquery-кода) постепенно.

Не смотря на свою небольшую историю и размер Vue так же подходит  для создания сложных одностраничных приложений (SPA, Single-Page Applications), если его использовать с дополнительными библиотеками и инструментами.

Читать далее

Babel

Babel – программа, которая переводит JavaScript код новой версии в старую версию, поддерживаемую большинством браузеров. Язык JavaScript в последнее время бурно развивается и прогрессивные программисты используют новые функции языка для более производительной разработки. Но браузеры не успевают поддерживают все новые возможности языка. Поэтому код, написанный программистами они конвертируют в версию, у которой не будет проблем с работой в различных браузерах. Это так же называется source-to-source compiler, transcompiler и transpiler. К Babel часто применяют последний термин – транспайлер.