Дайджест свежих материалов из мира фронтенда за последнюю неделю №285 (16 — 22 октября 2017)

Предлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.


Читать дальше →

Создание библиотеки компонентов с использованием Storybook

Введение


image

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

Компании все чаще прибегают к написанию интерфейса состоящего из множества независимых компонентов, которые могут быть использованы повторно. Многие дизайнеры создают дизайн проект который описывает каждую деталь дизайна. Они используют ряд инструментов для документирования интерфейсов, первые которые приходтя на ум это axshare.com и zeplin.com. Тот же фотошоп, в котором у них все разложено строго по папочкам. Это позволяет им с легкостью работать над дизайном проекта, обновлять и добавлять новые страницы, просто копируя уже имеющиеся наработки.
Читать дальше →

[Из песочницы] Окружение для разработки веб-приложений на TypeScript и React: от 'hello world' до современного SPA. Часть 1

Цель данной статьи — вместе с читателем написать окружение для разработки современных веб-приложений, последовательно добавляя и настраивая необходимые инструменты и библиотеки. По аналогии с многочисленными starter-kit / boilerplate репозиториями, но наш, собственный.

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

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

image
Читать дальше →

WordPress плагин для cквозной аналитики

Наша команда выпустила бесплатный WordPress плагин который может быть использован для сквозной аналитики (аналог Roistat). Плагин представляет собой расширяемую платформу, которую можно легко интегрировать с любым онлайн сервисом.
Читать дальше →

Как фокус помогает


Менеджер и дизайнер заставляют везде убирать аутлайн. Расскажите им, что это плохая идея!

Вы совершенно правы, с удовольствием расскажем.

Почему так не нужно делать.

[Перевод] Первая демонстрация TypeScript

Совсем недавно состоялась пятая годовщина TypeScript, и у меня появилась возможность увидеться с Андерсом и командой разработчиков на еженедельном техническом совещании. Мне хотелось поздравить их с важной вехой в жизни TypeScript, сказать им о том, как много они сделали за те четыре года, которые прошли с даты моего ухода из проекта.



Кроме того, я разыскал некоторые старые демки, сделанные на TypeScript в самом начале работы над проектом (тогда он назывался Strada), для того, чтобы посмотреть их вместе с теми, кто работает над TypeScript сейчас.

Сегодня я хочу рассказать о том, с чего начинался TypeScript.
Читать дальше →

We need to go deeper: обходим скрипт который обходит адблок



Немного пятничный пост. В последнее время заметил что есть реклама которая пробивает сразу 2(!) расширения блокирующие её. И обычно это очень низкокачественная и навязчивая реклама. Решил разобраться как так, и, возможно, даже попробовать побороть эту дрянь. Кому интересно — прошу под кат (осторожно, много картинок).

Читать дальше →

ROS, ELM и черепашка

Robotic Operation System позволяет взаимодействовать своим подсистемам по механизмам «подписка на топик» и «вызов сервиса» по своему специальному протоколу. Но есть пакет rosbridge, который позволяет общаться с ROS извне с помощью websocket. Описанный протокол позволяет выполнять основные операции по взаимодействию с другими подсистемами.
ELM — очень простой и элегантный язык, компилирующийся в javascript и отлично подходящий для разработки интерактивных программ.
Я решил совместить приятное с полезным и изучать ROS (по которой сейчас идет курс) и ELM вместе.
Читать дальше →

[Перевод] Как работает JS: цикл событий, асинхронность и пять способов улучшения кода с помощью async / await

Часть 1: Как работает JS: обзор движка, механизмов времени выполнения, стека вызовов
Часть 2: Как работает JS: о внутреннем устройстве V8 и оптимизации кода
Часть 3: Как работает JS: управление памятью, четыре вида утечек памяти и борьба с ними

Перед вами четвёртая часть серии материалов, посвящённых внутренним особенностям работы JavaScript. Эти материалы, с одной стороны, направлены на изучение базовых элементов языка и экосистемы JS, с другой, содержат рекомендации, основанные на практике разработки ПО в компании SessionStack. Конкурентоспособное JS-приложение должно быть быстрым и надёжным. Создание таких приложений — та цель, к которой, в конечном счёте, стремится любой, интересующийся механизмами JavaScript.

image
Читать дальше →

[Перевод] Как мы заставили npm-пакеты работать в браузере


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


Сегодня поддержка npm — одна из определяющих возможностей CodeSandbox, так что как-то нам удалось это реализовать. Чтобы фича работала при любых сценариях, пришлось сделать немало итераций, много раз переписывая код, и даже сегодня мы всё ещё можем улучшить логику. Я расскажу, с чего у нас начиналась поддержка npm, что имеем сегодня и что можем сделать для её улучшения.

Читать дальше →


Последние посты