​Chrome DevTools: Хитрости при отладке

В этой статье вы найдёте на различные нюансы для работы с Chrome DevTools, полезные при отладке. Какие-то из них автор почерпнул в сети, до каких-то додумался сам. Возможно, вы найдёте для себя что-нибудь новое и полезное.

https://tprg.ru/ky8O

Вот такие роботы уже вовсю убирают офисы Google

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

В чём и показывают успех инженеры Everyday Robot из Google. У разработанного ими робота есть универсальная рука с захватом, камера, датчики для машинного зрения и вращающийся лидар для навигации. А робот успешно убирает крошки со столов, переносит чашки и складывает бельё в «неструктурированной» заранее среде.

#роботы #технологии

​Создание реального компонента на примере сообщения для чата

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

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

Подробности:

https://tprg.ru/lV9K

​Веб-разработка: основы статического сайта

Статья для новичков, которые только начинают вливаться в веб-разработку. Здесь вы узнаете базовые моменты создания статического сайта:

https://tprg.ru/b2Sn

Неожиданно 😮

Зацените https://kod.ru.com/news/15344_pavel-durov-zayavil-chto-ne-budet-prodavat-Telegram-i-prosto-tak-za-spasibo-otdast-ego-yutuberu-haudi-ho

UPD: в телеграме появился новый бот, который подделывает новости от известных СМИ.
Будьте осторожны, проверяйте домен.

А мой проект — это сайт-визитка

​CSS-медиафичи для улучшения доступности

Медиафича (media feature) — это условие для CSS-директивы @media. В этой статье вы узнаете о нескольких медиафичах: prefers-reduced-motion, prefers-color-scheme, inverted-colors, forced-colors, ms-high-contrast, prefers-contrast и prefers-reduced-transparency.

Подробнее:

https://tprg.ru/TqS9

#фронтенд #css

​Скрытие всплывающих окон, при прокрутке страницы с помощью React

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

https://tprg.ru/dNGC

#react

У сисадмина нет цели — есть только путь: первые шаги в профессии

Получите необходимые начинающему админу навыки и научитесь решать задачи, с которыми встречаются администраторы Linux-серверов. 24 ноября стартует бесплатный курс от FirstVDS и Слёрм.

За 12 модулей курса вы узнаете:
— основные команды и службы Linux;
— виртуализации и как с ними работать;
— азы работы с Docker;
— подключение к серверу по SSH;
— установка и обновление ПО и многое другое, с чем сталкиваются сисадмины и специалисты техподдержки.

Получите доступ к бесплатному видеокурсу и смотрите уроки в свободное время. Подробная программа обучения доступна по ссылке — регистрируйтесь и постигайте админское бусидо вместе с FirstVDS и Слёрм:

https://firstvds.ru/s/7fagw

Это #партнёрский пост

​Бесплатный курс — «Школа разработки интерфейсов 2021»

Летом 2021 года прошла Школа разработки интерфейсов от Академии Яндекса: студенты слушали лекции, выполняли домашние задания, изучая Node.js, React, тестирование и многое другое. Теперь запись этих лекций доступна онлайн каждому на YouTube.

Посмотреть можно тут:

https://tprg.ru/SLP0

​Вышел Git 2.34: что нового

Последнее обновление Git содержит в себе большое количество исправлений, а также добавление новых функций. Подробнее обо всех изменениях читайте в статье:

https://tprg.ru/y0EX

#git

​Различия деструктуризации массивов и объектов в JavaScript

Назначение деструктуризации в JavaScript — обеспечить аккуратный и надёжный способ извлечения значений из ваших массивов и объектов.

Эта статья призвана показать вам, как именно в JavaScript работает деструктуризация массивов и объектов, а также главные отличия:

https://tprg.ru/7YRe

#javascript

​Разработка через тестирование: как тестировать с помощью Vue.js, VueTestUtils и Jest

Разработка через тестирование - это практика разработки программного обеспечения. TDD предполагает три этапа разработки:

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

TDD также требует, чтобы вы часто писали модульные тесты. В этой статье вы узнаете, как реализовать такой подход при помощи Vue.js, VueTestUtils и Jest:

https://tprg.ru/i7z1

Как сделать игру 2048 на React

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

Автор этого туториала сосредоточился на анимации. Он использовал хуки библиотеки React, её Context API, а также TypeScript и LESS для создания собственной версии этой игры. В конце этой статьи вы найдёте ссылки на игру, её код и демо анимаций.

https://tprg.ru/7HEU

#react

​Адаптивная вёрстка без медиа-запросов

Автор этой статьи показал, как при помощи современных свойств и возможностей CSS можно добиваться адаптивности без использования медиа-запросов. Некоторые советы действительно впечатляют.

https://tprg.ru/pYhe

#css

​Адвент-календари для фронтенд-разработчиков

Думали как провести последний месяц года? Для фронтенд-разработчиков, похоже, появился отличный вариант. Эми Даттон и Джеймс Квик создали адвент-календари по CSS и JavaScript, которые стартуют с 1 декабря и предлагают выполнить по 24 задания в каждом.

Участвовать может каждый и абсолютно бесплатно.

CSS: https://www.adventofcss.com/

JavaScript: https://www.adventofjs.com/

#фронтенд #css #javascript

​Как создать собственную криптовалюту с помощью JavaScript

Одним из преимуществом криптовалют является то, что их сеть децентрализована, что означает, что никто не просматривает транзакцию и нет посредников.

Сегодня вы можете попробовать создать криптовалюту с помощью JavaScript благодаря этой статье:

https://tprg.ru/Wv02

#javascript

​Мощные инструменты терминала и командной строки (CLI) для современной веб-разработки

Хотите работать, как настоящий программист из фильмов? В этой статье представлен систематизированный список множества приложений командной строки, которые автор обнаружил за последние несколько лет. Некоторые из них относительно новые, другие существуют уже давно.

https://tprg.ru/bgYJ

Параллакс на основе настраиваемых свойств CSS

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

Вот как это работает:

https://tprg.ru/ow8u

#фронтенд #css

​Подробное руководство по word-wrap, overflow-wrap, и word-break в CSS

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

Эта статья представляет собой руководство по углубленному изучению CSS-свойств word-wrap, overflow-wrap и word-break, которые позволят предотвратить переполнение содержимым контейнера и нарушение вёрстки.

https://tprg.ru/AMTI

#css

​Контролируем scroll полностью или реализация события React: onRenderChildrenComplete

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

https://tprg.ru/bYEy

#react