Новогодняя игра «Код сурка»: отвечайте на вопросы, проходите тренажёры, зарабатывайте баллы и выиграйте профессию!

ESLint отказывается от правил форматирования кода. Пора переходить на Prettier? Обсудили паттерн отключения кнопки при отправке форм — не всё так просто и сложней, чем кажется. Обсудили историю миграции с Preact на React: плюсы и минусы. Поговорили про CSS-вложенность и отказ от препроцессоров. Под занавес поговорили про базы данных и узнали почему стоит обратить внимание на SQLite.

Ведущие: Коля Шабалин, Игорь Антонов и Лёша Симоненко.

Ссылки и таймкоды:

• 00:00:25 Код сурка
  
• 00:01:06 ESLint 8.53 без правил форматирования
• 00:18:25 Не отключайте кнопку
• 00:30:06 Возвращаемся на React
• 00:42:50 CSS-вложенность уже здесь или пора отказываться от препроцессоров
• 00:54:28 Почему мы должны использовать SQLite

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Обсудили зачем участвовать в опросе State of React 2023. Подсветили важность процедуры отладки приложений на Node.js и какими инструментами её производить. Разобрали стартовый шаблон для нового приложения на Node.js: зависимости, фреймворк Ts.ED, сценарии и так далее. Посмотрели что там с производительностью Firefox и много всякого другого.

Ведущие: Коля Шабалин и Игорь Антонов.

Ссылки и таймкоды:

• 00:00:40 State of React 2023
  
• 00:09:46 Приоритет индексации мобильных устройств в Google завершён
• 00:17:24 Шаблон для Node.js с TypeScript
• 00:28:00 Firefox стал быстрее
• 00:35:04 Отладка в Node.js
• 00:45:48 crypto-hash
• 00:48:12 express-slow-down для Express

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Node.js 20 стала LTS релизом, а в следующий релиз завезли новый полезный флаг для автоматического определения модульной системы. Обсудили новые значения для свойства text-wrap: pretty, balanced и как они помогают улучшить выравнивание абзацев. Поговорили про чек-лист для начинающего React-разработчика и узнали почему пора переезжать с Buffer на Uint8Array. А в конце немного про Next.js.

Ведущие: Коля Шабалин, Игорь Антонов и Лёша Симоненко.

Ссылки и таймкоды:

• 00:00:51 content-visibility в следующем Safari?
  
• 00:11:48 Автоматическое определение CommonJS и ESM в Node.js
• 00:19:27 text-wrap: pretty
• 00:27:39 Прощай, Node.js Buffer
• 00:35:34 Select element: теперь с разделителями
• 00:40:40 Tao of React — всё самое важное для настоящих разработчиков
• 00:57:02 Why I Won't Use Next.js

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Обсудили свежий релиз Node.js. А там стабильные fetch и Web Streams API, экспериментальный WebSocket клиент, важный флаг experimental-default-type и небольшие, но приятные обновления встроенного модуля тестирования. А ещё разобрали базовые принципы оптимизации, напомнили зачем нужен package-lock.json и снова думали как назвать переменные, на этот раз в CSS.

Ведущие: Коля Шабалин, Игорь Антонов и Лёша Симоненко.

Ссылки и таймкоды:

• 00:00:26 Node.js 21
  
• 00:26:25 The Three C: Concatenate, Compress, Cache
• 00:48:43 Stop using npm install in your CI/CD pipeline
• 00:57:04 Именование переменных в CSS

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Interop 2024: что это такое, почему важно и как участвовать в голосовании. Разберём улучшения в бета-версии TypeScript 5.3: import attributes, type narrow для switch, оптимизация производительности, более тщательная проверка Symbol.hasInstance и другие полезные новинки. Про Photoshop в браузере и как это поможет разработчикам. В очередной раз обсудим селекторы и разберёмся как :not объединяет несколько селекторов. И это ещё не всё.

Ведущие: Коля Шабалин и Игорь Антонов.

Ссылки и таймкоды:

• 00:00:52 Будьте готовы к Interop 2024
  
• 00:13:21 Бета-версия TypeScript 5.3, улучшений много
• 00:40:33 Как :not() объединяет несколько селекторов
• 00:48:08 Переменные окружения и анти-паттерны работы с конфигурацией
• 00:57:02 Как Photoshop использует браузерные технологии на пределе возможностей
• 01:11:00 Должны ли ESM модули быть по умолчанию?

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Node.js 20 научилась работать с .env-файлами из коробки, dotenv больше не нужен? К каким проблемам может привести не знание о NODE_ENV, обсуждаем явное и неявное. CSS и адаптивные шрифты: много математики и новые функции. Знакомство с убийцей (нет) Node.js. Обсуждаем первую версию Bun.

Ведущие: Коля Шабалин и Игорь Антонов.

Ссылки и таймкоды:

• 00:00:58 Встроенная поддержка .env в Node.js 20.6
  
• 00:13:35 Ах этот вредный NODE_ENV или нет?
• 00:24:20 Адаптивный шрифт масштабируется с помощью компонуемых утилит CSS
• 00:40:55 Могут ли символы SVG влиять на производительность в интернете?
• 00:58:42 Bun на хайпе

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

На этой неделе мы узнали, что WOFF больше не нужен. Вспомнили как использовать нативный lazy-loading и познакомились с типизацией кастомных свойств. В мире JS удивились от работы every() по спецификации, а также познакомились с новым методом groupBy().

Ведущие: Коля Шабалин и Лёша Симоненко.

Ссылки и таймкоды:

• 00:00:40 WOFF покинул здание
  
• 00:09:58 Прекратите ленивую загрузку продуктов и главных изображений
• 00:24:30 Системы безопасного проектирования CSS с помощью @property
• 00:34:23 Почему every() возвращает true для пустых массивов?
• 00:43:56 Object.groupBy() теперь в JavaScript

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

В этот раз мы углубимся в разнообразные аспекты программирования. Узнаем, как эффективно сортировать данные, программировать с использованием CSS, и даже познакомимся с альтернативами хорошо известных инструментов. Также расскажем, как использовать JSX вне мира React, поделимся важностью альтернативного текста для изображений и дадим краткий обзор пересмотра библиотеки Lodash.

Ведущие: Коля Шабалин и Игорь Антонов.

Ссылки и таймкоды:

• 00:01:10 Алгоритмы сортировки
  
• 00:17:13 Краткое введение в CSS @scope
• 00:31:54 Прощай, nodemon или нет?
• 00:42:21 Прогрессивно улучшенная проверка формы, часть 2: многоуровневое представление в JavaScript
• 00:59:08 JSX без React
• 01:06:04 Зал славы альтернативного текста: чествование хорошо написанных описаний изображений
• 01:10:19 Вам не нужен Lodash

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Узнали как выбирать npm-пакеты с помощью Node.js Toolbox в контексте решаемой задачи. Обсудили возможности DevTools в разных браузерах. Узнали как применять API виртуальной клавиатуры в мобильных браузерах. Разобрали несколько способов как отметить подписку на события в DOM. Порадовались обновлённой документации по React (в неё добавили TypeScript). Подискутировали про Type Alias и Interface в TypeScript. А также узнали как улучшить проверку форм.

Ведущие: Коля Шабалин и Игорь Антонов.

Ссылки и таймкоды:

• 00:01:02 Node.js Toolbox
  
• 00:17:23 Могу ли я использовать DevTools
• 00:31:02 API виртуальной клавиатуры
• 00:40:33 You’ve Got Options for Removing Event Listeners
• 00:58:56 React + TypeScript. Обновлена официальная документация по React
• 01:04:21 Type vs Interface: Which Should You Use In 2023?
• 01:14:15 Постепенно улучшенная проверка формы, часть 1: HTML и CSS

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]

Обсудили форматеры в FF 116: зачем они нужны и кто ими пользуется. Вспомнили VanJS — микрофреймворк, который дорос до версии 1.0. Подробно разобрали функцию repeat() для использования в гридах. Устроили ликбез по ORM и разобрали нововведения в Prisma. Поговорили про новую спеку анимаций основанных на прокрутке и это ещё не всё…

Ведущие: Коля Шабалин и Игорь Антонов.

Ссылки и таймкоды:

• 00:00:25 Пользовательские форматеры объектов в DevTools теперь и в Firefox
  
• 00:08:51 VanJS дорос до версии 1.0
• 00:13:50 Как использовать функцию repeat() гридов
• 00:34:09 Вышла Prisma версии 5.1
• 00:52:26 tsup
• 00:58:24 Анимация прокрутки в CSS
• 01:07:06 Бойлерплейты: Hackathon Starter для Node.js, Vite React Boilerplate

Учитесь с нами в .html academy → https://htmlacademy.ru

Узнавайте новое в журнале «Доктайп» → https://t.me/html_blog

А все вопросы о подкасте пишите на почту → [email protected]