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

Работа с веб-сокетми позволяет в веб-приложении или в мобильном приложении организовывать отправку сообщений с сервера на клиент, что невозможно сделать средствами REST-API. Для работы с веб-сокетами часто используется библиотека socket.io, или же разработчики работают с нативными объектами веб-сокет браузеров. В этом сообщении я попытаюсь показать, что оба пути не решают всех проблем, и гораздо лучше использовать для работы с веб-сокетами специализированные серверы, например mqtt-сервер (раньше его назвали mqtt-брокер).

Справедливости ради, и чтобы избежать ненужных споров, сразу замечу, что кроме mqtt-сервера может быть использован еще целый ряд серверов, например rabbitmq.
Читать полностью »

Привет!

В предыдущей статье мы рассматривали общую теории ООП в применении к EcmaScript и популярное заблуждение начинающих разработчиков относительно отличия ООП в JS и классических языках.

Сегодня мы поговорим о двух других не менее важных концепциях EcmaScript, а именно связи сущности с контекстом исполнения (this и есть эта самая связь) и связи сущности с порождающим контекстом(ScopeChain).

Итак, начнём!

this

На собеседованиях в ответ на вопрос: «Расскажите подробнее про this.». Начинающие разработчики, как правило, дают очень туманные ответы: "this – это объект «перед точкой», который использовался для вызова метода", "this — контекст, в котором был вызвана функция" и т.д.…

На самом деле, ситуация с этим центральным для EcmaScript языков понятием обстоит несколько сложнее. Разберёмся по порядку.

Допустим, у нас есть программа на языке JavaScript, в которой есть переменные объявленные глобально; глобальные функции; локальные функции(объявленные внутри других функций), функции, возвращаемые из функций.
Читать полностью »

Всем, кому приходилось вставлять HTML содержимое в DOM в Angular, доводилось видеть это сообщение. Конечно, все мы получаем проверенное содержимое с нашего же сервера и просто хотим застилизовать сообщение об ошибке. Или вставляем HTML из наших же констант, инлайним наши SVG иконки, ведь нам всего лишь нужно покрасить их в цвет текста. Ведь ничего плохого не случится, если мы просто скажем Angular`у — не дрейфь, там всё чисто.

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

«WARNING: sanitizing HTML stripped some content» и как с ним правильно бороться - 1

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

Это и последующие руководства проведут вас через процесс создания решения на основе проекта Discovery.js. Наша цель — создать инспектор NPM-зависимостей, то есть интерфейс для исследования структуры node_modules.

Руководство по Discovery.js: быстрый старт - 1

Примечание: Discovery.js находится на ранней стадии разработки, поэтому со временем что-то будет упрощаться и становиться полезнее. Если у вас есть идеи, как можно что-то улучшить, напишите нам.

Аннотация

Ниже вы найдёте обзор ключевых концепций Discovery.js. Изучить весь код руководства можно в репозитории на GitHub, или можете попробовать как это работает онлайн.

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

Привет! Это пост-отчёт с митапа Moscow SPA 5, серии встреч для фронтенд-разработчиков, которым интересна тематика веб-приложений (Single Page Application). Вместе с докладчиками из Mail.Ru, Яндекса, ВКонтакте, Тинькофф и Авито мы говорили об интеграции Jest с QA-инфраструктурой, DI в качестве способа масштабирования, росте библиотек компонентов, платформенной команде. А также обсуждали, может ли UIKit быть максимально гибким и подходящим для всего.

Заходите под кат, если вам интересны эти темы. Внутри вы найдёте материалы встречи: видеозаписи докладов, презентации спикеров, отзывы гостей митапа и ссылки на фотоотчёт.

SPA Meetup 5: интеграция Jest с QA, мощный UIKit, библиотеки компонентов, DI для масштабирования, платформенные команды - 1

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

Делаем свой Google Call Screening на основе Voximplant и Dialogflow - 1


Возможно, вы слышали или читали про функцию Call Screening, которую Google выкатил для своих телефонов Pixel в США. Идея отличная – когда вам поступает входящий звонок, то виртуальный ассистент начинает общаться, в то время как вы видите этот разговор в виде чата и в любой момент можете начать говорить вместо ассистента. Это очень полезно в наши дни, когда почти половина звонков – это спам, но при этом вы не хотите пропускать важные звонки от кого-то не из вашего списка контактов. Единственная загвоздка – эта функциональность доступна только на телефоне Pixel и только в США. Что ж, препятствия существуют, чтобы их преодолевать, верно? Поэтому мы решили рассказать, как сделать подобное решение, используя Voximplant и Dialogflow. Прошу под кат.
Читать полностью »

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

Сервис-воркеры в клиенте Slack: об ускорении загрузки и оффлайн-режиме - 1
Читать полностью »

Недавно я нашёл интересную уязвимость, позволяющую установить любому пользователю конкретного сайта любой пароль. Круто, да?
Это было забавно, и я подумал, что можно написать интересную статью.

На неё вы и наткнулись.

Мой первый взлом: сайт, позволяющий задавать любой пользовательский пароль - 1

Примечание: автор переведённой статьи не специалист по информационной безопасности, и это его первый экскурс в мир SQL-инъекций. Он просит быть «снисходительными к его наивности».

Предупреждение: автор переведённой статьи не станет раскрывать сайт с этой уязвимостью. Не потому, что он сообщил о ней владельцу и связан узами молчания, а потому что хочет приберечь уязвимость для себя. Если вы вычислите этот сайт, пожалуйста, держите рот на замке (цыц).
Читать полностью »

Приветствую всех читателей Хабра. В этом году довелось писать модуль видеосвязи для одного учебного портала для созвона по видеосвязи прямо на сайте учителя с учеником. Раннее такую задачу решать не приходилось. После недолгих поисков обнаружил, что есть 2 пути: Flash и WebRTC. WebRTC в чистом виде оказался сложноват, и в общем-то это естественно, так как задача видеосвязи не является простой. Но потом я наткнулся на PeerJS, который является оберткой для WebRTC. В этой статье я расскажу, как быстро организовать свою браузерную звонилку.
Читать полностью »

Что объединяет Trello, Gmail, Aviasales и Google Keep? В каждом из них есть Drag-&-Drop-компоненты, которые можно перетаскивать мышкой. Использование этих компонентов делает сайты по-настоящему удобными, потому что в реальной жизни мы часто используем этот паттерн. Передвигать вещи для нас естественно, поэтому и в вебе мы хотим перемещать элементы по экрану с одного места на другое, как стикеры на доске или магнитики на холодильнике. Сортировка todo-списков, организация дашбордов, загрузка файлов — мы просто не можем себе представить все эти события без перетаскивания элементов на странице.

Drag-&-Drop компоненты для слепых пользователей? Вы шутите? - 1

Но есть нюанс. Когда мы разрабатываем такие компоненты, то думаем, что наши пользователи физически видят экран и элементы, могут зацепиться за них мышкой и перетащить.Часто так и есть, но мы забываем о сегменте пользователей с проблемами зрения. Мы создаем компоненты, которыми невозможно пользоваться большой группе людей, которая просто их не видит. Как сделать так, чтобы им тоже были доступны Drag-&-Drop-компоненты?

Сергей Кригер — фронтенд-разработчик в компании SinnerSchrader. Кроме фронтенд-разработки, активно интересуется темой веб-доступности и расскажет о некоторых способах ее повышения. Под катом — рассказ о создании Drag-&-Drop-компонентов для тех, кто не видит экран и пользуется другими устройствами для взаимодействия с браузером.
Читать полностью »


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