Docker для начинающих

Быстрое введение за 1 час, для тех, кто еще не знаком с контейнеризацией.

https://www.youtube.com/watch?v=lr1rYnUubpQ

Работа с буфером обмена

Как web clipboard сохраняет различные типы контента и как можно этим управлять.

https://alexharri.com/blog/clipboard

Next.js + Playwright. Как мы начали писать автотесты и что из этого вышло

Данила, фронтенд-тимлид компании KTS, делится опытом внедрения автотестов на одном из боевых проектов с NextJs 12: почему выбрали Playwright, детали разработки, интеграция с CI.

https://habr.com/ru/companies/kts/articles/843054/

Необычные приёмы отладки, которые браузер от вас скрывает

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

https://habr.com/ru/companies/ruvds/articles/842428/

Отправляем данные из приложения прямо в Google Sheet

Простая интеграция веб-приложений с Google Sheet без дополнительных прослоек.

https://dev.to/miracool/submitting-form-data-to-a-google-sheet-from-a-react-app-3o83

Многопоточное программирование на Node.js с использованием Atomics

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

https://pavel-romanov.com/multithreading-in-nodejs-using-atomics-for-safe-shared-memory-operations

Text Diff на JavaScript

Простой инструмент для определения различий между строками, реализованный на JS

Демо | Github

MutationObserver для CSS

@bramus/style-observer позволяет повесить JS коллбек на изменение CSS свойств

https://www.bram.us/2024/08/31/introducing-bramus-style-observer-a-mutationobserver-for-css/

Ускоряем разметку - Emmet для React

Смотрим как встроенный помощник Emmet помогает быстрее писать разметку, будь то html или jsx в React.

https://www.youtube.com/watch?v=S_s4M5LVXAQ

«Группа Астра» проводит первую бесплатную практическую конференцию для разработчиков Astra DevConf 2024.

Разработчики ИТ-компаний раскроют секреты эффективной и безопасной разработки, а также поделятся практическими кейсами.

На конференции мы:
— покажем как реализовать разработку, сборку и тестирование в облаке;
— расскажем как легко и просто опубликовать ваше приложение в RuStore;
— поведаем, как разрабатывалась Astra Linux восьмого поколения (новый визуальный стиль - Astra Proxima, современная пакетная база и пр.);
— развенчаем миф о том, что запустить современные игры на Astra Linux невозможно;
— и многое другое.

Для участников конференции будет доступен:
— личный кабинет разработчика, в котором можно бесплатно скачивать решения «Группа Астра» для целей изучения и разработки (в том числе ОС Astra Linux 1.8);
— портал с документацией, где можно найти различные инструменты для разработки, примеры кода и готовые стенды для тестирования.

Дата и время: 24 сентября, в 10:00
Формат: онлайн/офлайн

Регистрация доступна по ссылке. Поехали!

реклама. ООО «РусБИТех-Астра», ИНН: 7726388700, erid: 2Vtzqux9UpQ

Обновление Chrome DevTools

Новые фичи для оценки перфоманса: какие показатели и как теперь можно измерить.

https://www.debugbear.com/blog/fix-web-performance-devtools

React и FormData

FormData один из старых стандартов для работы с формами. Посмотрим как работать с данными форм в React и какие трюки использовать для интеграции с TS.

https://reacttraining.com/blog/react-and-form-data

Розыгрыш подарков от Linux Club 🐧

— Мини-ПК GenMachine 2023 AMD Ryzen 5 3550H
— Три больших коврика с командами для Linux
— Механическая клавиатура VOROTEX K680

Для участия подпишись на Linux Club и нажми кнопку Участвую!

1 октября бот выберет 5 победителей. Отправка по РФ за наш счёт. Удачи!

Динамические лейауты с Vue jsx: руководство по созданию поддерживаемых компонентов

Посмотрите, как динамические лейауты c Vue jsx могут оптимизировать процесс разработки, сделав ваши компоненты более гибкими.

https://www.vuemastery.com/blog/dynamic-layouts-with-vue-jsx/

2 CSS свойства, позволяющие обрезать лишнее пространство box-контейнера

Экспериментальные свойства text-box-trim и text-box-edge, позволяющие тонко настраивать размеры текстовых контейнеров.

https://css-tricks.com/two-css-properties-for-trimming-text-box-whitespace/#aa-now-where-do-you-want-to-trim-from

Scroll-based анимация текста с помощью SVG фильтров

Очередной необычный эффект для анимации текстового контента.

Демо | GitHub

https://tympanus.net/codrops/2024/08/22/scroll-based-svg-filter-animations-on-text/

Хочешь щёлкать задачи по фронтенду как орешки?

Канал Frontend tests & tasks научит!

Это не очередной канал с задачами. Здесь придется думать.

Убедись сам 👉 @Frontend_tasks

Улучшаем рендеринг перфоманс с CSS content-visibility

На примере сайта с большим количеством emoji посмотрим как content-visibility влияет на отрисовку страницы.

https://nolanlawson.com/2024/09/18/improving-rendering-performance-with-css-content-visibility/

Math4Devs

Список математических символов с их эквивалетном в JS: от простых до сложных.

https://math4devs.com/

Управляем React компонентом с помощью url

Как синхронизировать состояние компонента с url параметрами: пошаговое и интерактивное руководство.

https://buildui.com/posts/how-to-control-a-react-component-with-the-url