Внезапный тест Тьюринга

Эту карточку накодила нейросеть или настоящий дизайнер? Отвечайте сердцем:

Произошёл мем

🎧 Подкаст «Про код», выпуск 23

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 на хайпе

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

Слушайте на любимой площадке

В соцсети Х активно обсуждают правило красивых скруглений в интерфейсе, спорят и ругаются.

А правило-то простое: внешний радиус = внутренний радиус + padding. И всё.

Если пропустили обсуждение, вот вам демка от Джея: 👉https://codepen.io/jh3y/pen/KKrYaxx

Проснулись, потянулись? Вот вам ещё одна хитрая задачка.

Что появится в консоли после выполнения команды
console.log(1 + "1" - 1)?

А потом вспоминаете, что на самом деле вы поддерживаете легаси-проекты в веб-студии, и расходитесь по домам

Знакомимся с localStorage

Есть в браузере такая штука — localStorage. Там хранятся данные, которые легко переживут выход из браузера и перезагрузку компьютера. Много чего не переживут, конечно. Но об этом (и о том, как туда что-то сложить, и убрать, и вообще) — в статье.

А ещё вслушайтесь — Локал Сторыдж. Слово-то какое!

👉https://tml.io/localStorage

Вообще мы сегодня честно-пречестно хотели рассказать о Geolocation API, но тут в чате Академии появился судьбоносный вопрос. А когда, если не в субботу, спорить о нейросетях? Приходите на огонёк тоже:

Как узнать геолокацию на JS (без бесячки)

Скажите, бесит, когда заходите на сайт, они просят геолокацию, вы отказываетесь, а они назначают дефолтный адрес, потому что ну что же теперь, доставлять ваше жидкое мыло в Рязань?

Теперь вы можете делать то же самое, и вам за это ничего не будет:

👉️️️️ https://tml.io/geolocation

🎧 Подкаст «Про код», выпуск 24

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 модули быть по умолчанию?

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

Слушайте на любимой площадке

Спонтанный фронтенд-гороскоп на ноябрь

🔥Овен. Ваш страстный характер приведёт к созданию фичи, о которой никто не просил.

🐂Телец. Попытки убедить дизайнера убрать анимацию обернутся успехом.

👯Близнецы. Выбирайте фреймворк, который пришёл в голову вторым.

🦀Рак. Коллеги поблагодарят за то, что вы не используете селекторы по тегам. Да ведь?

🦁Лев. Вы найдёте плагин, который ускорит работу на три секунды в год.

👩‍⚕️Дева. Вы решите сложный баг, который породит ещё два.

⚖️Весы. Будьте осторожнее с npm. Одно неверное движение — и 500 новых зависимостей.

🦂Скорпион. Дизайнер использует 5 разных оттенков черного в проекте.

🏹Стрелец. Все загадочные баги исчезнут после перезапуска локалхоста.

🐐Козерог. Ждут тяжёлые задачи, но к концу недели вы найдете изящное решение перейти на C#.

🌊Водолей. Ваши пользователи обнаружат баг на видном месте в IE6.

🐟Рыбы. Вы исправите ошибку, которую не делали. Как обычно.

Ставьте лайк, если узнали себя. И помните, что Луна в Козероге, а «Доктайп» — в сердечке ❤️

Новый день — новая неочевидная задачка (настолько, что половина ошибается). Что появится в консоли после выполнения этого кода?

🎧 Подкаст «Про код», выпуск 25

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

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

Слушайте на любимой площадке

Слууууушайте, тут позавчера первым HTML-тегам исполнилось 100 000 лет. Ну, в смысле, 32, но тоже красиво.

Вот они, слева направо: <title>, <nextid>, <a>, <isindex>, <plaintext>, <listing>, <p>, <h1>…<h6>, <address>, <hp1>, <hp2>, <dl>, <dt>, <dd>, <ul>, <li>, <menu> и <dir>.

Поздравьте старые буквы огонёчками 🔥

В Chrome 119 завезли относительные цвета

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

.darken-to-25 {
background: oklch(from blue 25% c h);
}

Узнать больше
🎨 Относительные цвета
🌍 Обновления Chrome 119