Please open Telegram to view this post
VIEW IN TELEGRAM
Советы по написанию короткого, лаконичного и чистого кода на JavaScript
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Разработчик React / Fullstack
Junior Backend-программист NodeJS
Junior Developer (Node.js)
Please open Telegram to view this post
VIEW IN TELEGRAM
TypeScript - оператор satisfies
Алоха товарищи фронты! Я знаю что это не самая новая фича в TS, но я думаю что далеко не все знают о об этом операторе и уверен что многим будет это полезно.
И так что делает оператор:
Позволяет нам проверить соответствие выражения некоторому типу, не меняя сам тип. Это помогает при работе с объектами со смешанными типами данных.
Рассмотрим на примере:
}
❗️ Объект
Вот тут-то нам и поможет оператор
Также оператор
Надеюсь что было полезно. В общем удачи в экспериментах!
Алоха товарищи фронты! Я знаю что это не самая новая фича в TS, но я думаю что далеко не все знают о об этом операторе и уверен что многим будет это полезно.
И так что делает оператор:
Позволяет нам проверить соответствие выражения некоторому типу, не меняя сам тип. Это помогает при работе с объектами со смешанными типами данных.
Рассмотрим на примере:
type FormFields = "name" | "surname" | "age";
const data: Record<FormFields, number | string> = {
name: "name",
surname: "surname",
age: 21,
}
const newAge = data.age * 2;
const nameUpperCase = data.name.toUpperCase();
❗️ Объект
data
имеет как числовые, так и строковые значения, поэтому при работе с этим объектом мы получаем следующие ошибки:The left-hand side of an arithmetic operation must be of type 'any', 'number', 'bigint' or an enum type.
Property 'toUpperCase' does not exist on type 'string | number'.
Property 'toUpperCase' does not exist on type 'number'.
Вот тут-то нам и поможет оператор
satisfies
.type FormFields = "name" | "surname" | "age";
const data = {
name: "name",
surname: "surname",
age: 21,
} satisfies Record<FormFields, string | number>
const newAge = data.age * 2;
const nameUpperCase = data.name.toUpperCase();
Также оператор
satisfies
можно использовать для отлова некоторых ошибок. Например, для проверки объектов на наличие ключей, соответствующих заданному типу:type FormFields = "name" | "surname" | "age";
const data = {
name: "name",
surname: "surname",
age: 21,
passport: {}
} satisfies Record<FormFields, string | number>
Надеюсь что было полезно. В общем удачи в экспериментах!
❌⭕️ Я хочу сыграть с тобой в одну игру: пилим «Крестики-нолики» на JavaScript
Хватит теории – пора практиковаться! Мы разберем создание полноценной браузерной игры, затрагивая ключевые концепции frontend-разработки. Идеально для новичков, жаждущих применить свои знания в реальном проекте.
Читать...
Хватит теории – пора практиковаться! Мы разберем создание полноценной браузерной игры, затрагивая ключевые концепции frontend-разработки. Идеально для новичков, жаждущих применить свои знания в реальном проекте.
Читать...
В статье рассматриваются проблемы, которые создают рекурсивные зависимости на фронте. Обсуждаются способы их обнаружения и решения, ведь часто разработчики даже не знают, что в проекте есть циклические зависимости.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
🎯 Выстрелил и забыл: 3 основные стратегии отправки сообщений в Kafka
Какой подход обеспечит вашему проекту идеальный баланс производительности и гарантии доставки: рискованная стратегия «Выстрелил и забыл» или продвинутая асинхронная отправка?
Читать...
Какой подход обеспечит вашему проекту идеальный баланс производительности и гарантии доставки: рискованная стратегия «Выстрелил и забыл» или продвинутая асинхронная отправка?
Читать...
Сегодня мы рассмотрим, как обнаружить и реагировать на изменение атрибутов веб-компонента.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Статья исследует, как обеспечить стабильность и доступность сервиса по всему миру. Рассмотрены методы контроля скорости работы сайта и мониторинга проблем маршрутизации и цензуры, выходящие за рамки стандартных аналитических решений.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Статья объясняет появление метода setHTMLUnsafe для работы с HTML в браузерах. Разбираются особенности безопасности, отличия от setHTML и innerHTML, а также поддержка в разных браузерах и значение нового подхода к именованию методов.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Представь, что ты отправляешь сообщение в мессенджере, а оно доходит с задержкой в минуту. Бесит? А теперь представь, что у тебя сервис с миллионами пользователей, и каждое их действие должно мгновенно отражаться везде. Звучит как кошмар? Спокойно, есть четыре проверенных способа решить эту головоломку, и они реально работают.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
♟ Эпопея шахматных движков: мой опыт в разработке шахматной программы
В этой статье я расскажу про личный опыт написания шахматной программы на языке TypeScript. С какими проблемами столкнулся и пути к их решению.
Читать...
В этой статье я расскажу про личный опыт написания шахматной программы на языке TypeScript. С какими проблемами столкнулся и пути к их решению.
Читать...
Fullstack Developer (JS/Node.js)
Fullstack Developer (Node.js, React)
Senior Node.js developer
Please open Telegram to view this post
VIEW IN TELEGRAM
В статье показан процесс развертывания React-приложения на сервере: от упаковки кода в CI/CD до отправки его в прод. Всё на примере простого to-do приложения.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
• Вам не нужно готовое API чтобы начать писать фронтенд или краткий обзор готовых решений для мокинга данных
• Ускоряем браузерные вычисления на коленке с помощью WebAssembly на примере генерации шума
• JavaScript-консоль для QA-инженера: от поиска багов до автоматизации
• Абсурдная незащищенность проекта @gamee
• CI/CD для начинающих: деплой React-приложения без боли
Please open Telegram to view this post
VIEW IN TELEGRAM
Вчера мы изучили различные способы инстанцирования веб-компонента. В статье был упомянут метод жизненного цикла connectedCallback(). Сегодня поговорим об остальных методах жизненного цикла веб-компонентов.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Сегодня я решил, что мы создадим HTML веб-компонент с нуля. Давайте создадим компонент, показывающий и скрывающий текст при переключении кнопки.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Статья знакомит с использованием NVM для управления версиями Node.js и npm, показывая примеры с Node.js 19 и npm 9. Объясняются преимущества NVM для безопасного обновления и тестирования новых возможностей.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM
Статья рассказывает о создании Telegram-бота для поиска каналов любимых авторов, переместившихся с YouTube. Описан стек технологий: Node.js с telegraf.js, MongoDB с mongoose, Express.js, Google API и Lemnos API для работы с данными.
Читать...
Please open Telegram to view this post
VIEW IN TELEGRAM