JavaScript *

Доброго времени суток, дорогой читатель!

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



Примечание: данная статья не объясняет термин "нейронная сеть" и всё, что с ним связано, а также не предоставляет базовую информацию об обучении сети методом трассировки. Рекомендуем кратко ознакомиться с этими понятиями до прочтения статьи

В Voximplant мы используем WebRTC с момента ее появления: сначала как альтернативу Flash для голосовых и видеозвонков, а затем как полную замену. Технология прошла долгий и болезненный путь развития, только недавно ее стали поддерживать все основные браузеры, есть сложности с передачей экрана, нескольких видеопотоков, а иногда браузер падает просто если выключить и включить видеопоток. Накопленный опыт позволяет переводить для Хабра интересные статьи, и сегодня мы передаем слово Ли Сильвестру из Xirsys, который расскажет про отладку (видео)звонков в Chrome, Firefox, Safari и Edge. Отлаживать WebRTC непросто, у нас даже есть специальные инструкции по снятию логов в популярных браузерах. А что есть у Ли – вы узнаете под катом (спойлер: много всего, включая WireShark).

Привет, Хабр! Представляю вашему вниманию перевод статьи «Learn Render Props by Example».



Честно говоря, раньше я не представлял ситуаций, в которых можно применить React render props, пока не увидел практический пример

Всем привет!

В июле 2018 года наш преподаватель курса «Разработчик JavaScript» Юрий Дворжецкий провел открытый вебинар на тему «Cоздание приложения на Webpack+React+Express», правда, в рамках второго курса, где он выступает как преподавателя одного из модулей, посвящённого JavaScript. В этом материале вы сможете ознакомиться с видеозаписью и кратким пересказом прошедшего мастер-класса.

Работа на открытом уроке проходила по следующему плану:

1. Знакомство с Node JS и Express JS.
2. Знакомство с Webpack.
3. Знакомство с React.

Итак, поехали!

25 июля вышел Angular 6.1. Данный минорный релиз фреймворка можно рассматривать как замену Angular 6.0, включающую в себя некоторые новшества и исправления ошибок. Этот материал, перевод заметки из блога Angular, посвящён основным новым возможностям Angular 6.1.

Привет, Хабр! Представляю вашему вниманию перевод статьи "nodejs and IoT: a match made in heaven".



Мир становится гиперсвязанным и цифровым. Именно поэтому мы видим все больше умных часов, очков, различной носимой электроники, устройств «умного дома», транспортных средств и т.д. Таким образом, существует огромная область применения Internet of Things (IoT), и продвинутые компании знают об этом.

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



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

Вдохновившись статьями SvelteJS: Релиз второй версии, Исчезающие фреймворки и Re: «Сравнение JS-фреймворков: React, Vue и Hyperapp», про «исчезающий» фреймворк Svelte (читается «свелт»), я захотел его попробовать. И, для начала, решил написать небольшой компонентик с кнопками из Materialize.

Автор материала, перевод которого мы публикуем сегодня, говорит, что она прямо-таки одержима написанием чистого кода. Она считает, что код надо писать так, чтобы, во-первых, с ним, в будущем, удобно было бы работать другим программистам, включая его автора, а во-вторых — с учётом возможности расширения этого кода. То есть, нужно стремиться к тому, чтобы в приложение сравнительно просто было бы добавлять новые возможности, и чтобы его кодовую базу было бы удобно сопровождать. Если бы программы писали, учитывая лишь нужды компьютеров, то, вероятно, программисты могли бы выражать свои мысли лишь с помощью нулей и единиц, больше ни о чём не заботясь. В этой статье приводится ряд рекомендаций по написанию качественного кода, проиллюстрированных примерами на JavaScript.

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

Прошло 2.5 года после публикации первой версии подробного туториала по основам React. За это время gitbook насчитал 250 000+ уникальных посетителей.

Под катом подробнее об учебнике и список изменений.

Всем привет, меня зовут Сергей и я web разработчик. Да простит меня Дмитрий Карловский за заимствованное вступление, но именно его публикации вдохновили меня написание этой статьи.

Сегодня хотелось бы поговорить о работе с данными в Angular приложениях в целом и о моделях предметной области в частности.

Всем привет, меня зовут Семен Левенсон, я работаю teamlead’ом на проекте «Поток» от Rambler Group и хочу рассказать о нашем опыте использования Apollo.

Объясню, что такое «Поток». Это автоматизированный сервис для предпринимателей, позволяющий привлекать клиентов из Интернета в бизнес, не вовлекаясь в рекламу, и быстро создавать простые сайты, не являясь экспертом в верстке.

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

Консоль разработчика в Chrome давно поражает меня глубиной своей проработки. Когда-то давно я тащился от Firebug'а, а теперь настали дни, когда я жизний своей не вижу без разработки на хроме. Хорошо, когда люди стремятся превзойти друг друга в делах.

• Упреждающее исполнение. Как только вы напишете выражение, Консоль отобразит его результат.
• Подсказки аргументов. По мере того как вы напишете название фунции, Консоль покажет вам ожидаемые аргументы для неё.
• Автозавершение функций. После набора вызова функции, к примеру, document.querySelector('p'), Консоль покажет вам функции и свойства, которые поддерживает возвращаемое значение.
• Ключевые слова из ES2017 в Консоли. Такие ключевые слова, как await, теперь доступны в Консоли в интерфейсе автодополнения.
• Lighthouse 3.0 в панели аудита. Более быстрый, более консистентный аудит, новый пользовательский интерфейс и новые типы аудитов.
• Поддержка BigInt. Опробуйте новый целочисленный тип в Консоли.
• Добавляем пути к свойству в панели наблюдения. Добавляйте свойства из панели целей в панель наблюдения.
• Опция "Показать метки времени" переместилась в раздел настроек.

Продолжаем перевод серии статей про аналоги в Python и JavaScript

В прошлых выпусках мы опирались на синтаксис классических версий Питона (2.7) и JS на основе ECMAScript 5. В этот раз мы будем использовать новые функции которые появились в Питоне 3.6 и JS стандарта ECMAScript 6.

ECMAScript 6 — относительно новый стандарт поддерживаемый большинством современных браузеров. Для использования стандарта 6 в старых браузерах вам понадобиться Babel для перевода современных конструкций JS6 на кросс-браузерную поддержку.

В сегодняшней статье: переменные в строках, распаковка списков, лямбда-функции, итерирование без индексов, генераторы и множества (sets).

Всем привет!

Хочу представить вашему вниманию небольшую разработку — Box-shadows Device (#bSd).
Это инструмент, который чем-то напоминает конструктор или css редактор. В нем вы можете создавать девайсы на любой вкус и кошелек.

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


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

Поэтому, если вы хотите лучше понять промисы, мы предлагаем вашему вниманию перевод очередной статьи, посвящённой этой теме. Её автор говорит, что он последние 10 лет занимался разработкой на Java и PHP, но всё это время с интересом поглядывал на JavaScript. Недавно он решил всерьёз заняться JS и первой заинтересовавшей его темой стали промисы.



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

Как-то так получается, что клиентская разработка, с одной стороны, захватывает территории и становится все более востребованной, с другой, — все больше обосабливается. О распространении мы судим по нескольким последним фестивалям РИТ++, на которых и докладов по фронтенду было в 2-3 раза больше, чем по бэкенду или DevOps, и слушателям это было интереснее, и даже приехавшие видеоблогеры в основном оказались фонтендерами, но об этом позже. А в ответ на тенденции разделения и углубления специализаций мы организуем Frontend Conf Moscow. О том, что будет из себя представлять эта конференция, что от неё ждать, как поучаствовать, читайте далее.

О главном

Frontend Conf Moscow пройдет 4 и 5 октября в Москве в хорошо знакомом и удобном Инфопространстве. Это будет два дня, которые мы с вами целиком посвятим технологиям разработки клиентской части веб-проектов. Доклады в несколько потоков, мастер-классы, митапы, обсуждения с экспертами за чашкой кофе или, в вечернее время, стаканом кое-чего еще, сильнейшие разработчики среди участников — все это позволит погрузиться в тему полностью, и обсудить аспекты, которые до этого оказывались слишком узкими или специфичными.

Сегодня Mislav Marohnić объявил о том, что разработчики Github избавились от jQuery на фронтенде GitHub.com. Казалось бы, в самом этом факте нет ничего примечательного, если бы не один интересный момент.

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

• querySelectorAll (который предположительно был вдохновлен когда-то именно jQuery),
• fetch для работы с AJAX,
• delegated-events для обработки событий,
• полифиллы для работы с DOM,
• пользовательские элементы (Custom Elements), которые сейчас на подъеме.

Помимо Custom Elements, ничего другого из Web Components было решено не использовать. Разработчики присматривались к Shadow DOM и были бы не против прибегнуть к нему — однако, в силу того, что на полифиллах скорость поиска в DOM оставляет желать лучшего, им пришлось пока отложить эту затею.

Зачем разработчикам в принципе потребовалось все это сделать? По их словам, для того, чтобы «отдавать» посетителям меньше килобайт, иметь возможность использовать более явно выраженный синтаксис для выполнения манипуляций с DOM, а также ради возможности использовать библиотеку Flow.JS для статического анализа типов. По словам разработчиков, процесс ухода с jQuery занял годы.

В релизе babel@7.0.0-beta52 появился новый обязательный флаг конфига для плагина @babel/plugin-proposal-pipeline-operator, что ломает обратную совместимость для предыдущих версий плагина. Из этой статьи вы узнаете, что такое оператор pipeline и зачем ему нужна конфигурация.