Jack Franklin, разработчик Chrome Dev Tools и Puppeteer, делится советами по организации большого приложения на React.js

— Сборщики
— Организация структуры директорий
— Организация кода React.js компонентов
— Организация Redux actions, reducers с помощью подхода Ducks
— Тесты

#react #redux

К статье(eng)

Анимация элемента details с помощью Web Animations API (WAAPI)

#browser_api #WAAPI

К статье(rus)

Улыбнешься - проиграешь

Браузерная игра, для реализации которой использовалась библиотека face-api.js(надстройка над tensorflow.js) для распознавания лиц.

#tensor_flow #face_api #ml

К игре
К статье(eng)

Советы по оптимизации веба, собранные в одной статье

Оптимизации: html, css, картинки, шрифты, javascript, server, инструменты для тестирования, оптимизация фреймворков

#performance

К статье(eng)

Атака clickjacking - как проводится и как от нее защититься

В статье приводится практический пример, который можно быстро повторить локально

#security

К статье(rus)

Объяснение и визуализация CORS

— Same-Origin Policy(одинаковый хост, порт)
— Отличие простого запроса от preflight
— Добавление кук и авторизационных хедеров к CORS запросам

#CORS #security

К статье(eng)

Javascript Proxy

Объект Proxy оборачивается вокруг заданного объекта для перехвата и обработки различных действий над этим объектом.

В статье перечислены Proxy Traps (Ловушки) и показываются примеры применения Proxy

#javascript

К статье(rus)

Josh W. Comeau анонсировал “Operator Lookup” - поисковик для операторов JS

Когда оператор выбран, показывается пример его использования с результатами выполнения

#javascript

Operator Lookup

7 запахов кода в ваших компонентах React:

— Слишком много свойств
— Несовместимые свойства
— Копирование свойства в стейт
— Возвращать JSX из функций внутри компонента
— Несколько boolean переменных для состояния
— Слишком много useState в одном компоненте
— Большой useEffect, выполняющий разные операции

#react

К статье(eng)

Jack Franklin: “Как писать хорошие комментарии к коду: «зачем», а не «как»”

В статье рассказывается, в каких случаях оставлять комментарий к коду и приводится пример полезного комментария

К статье(rus)

Туториал по 2-х факторной аутентификации на node.js + speakeasy

#nodejs #speakeasy

К туториалу(eng)

Пуленепробиваемая архитектура node.js проекта

— Организация директорий
— 3-х уровневая архитектура для разделения ответственности
— Использование уровня обслуживания(service layer) для бизнес-логики
— Использование слоя публикаций/подписки для разгрузки функций
— Внедрение зависимостей для большей гибкости кода
— Юнит тестирование
— Cron Jobs и повторяющиеся задачи
— Конфигурации

#nodejs

К репозиторию
К статье(eng)

Легкое Google собеседование с Ben Awad(автор плагина для VS Code - Stories)

На собеседовании решают две технические задачки:
— развернуть односвязный список
— развернуть двоичное дерево

#interview #algorithms

К интервью(eng)

Перевод серии статей Mariko Kosaka: Устройство современного веб-браузера Chrome

#browser

Часть 1 (CPU, GPU, память, архитектура браузера)
Часть 2 (что происходит во время навигации)
Часть 3 (парсинг, вычисление стилей, Layout, отрисовка)
Часть 4 (События ввода из виджетов браузера)