👩‍💻 Тесты поддержки браузерами современных веб-функций на JavaScript

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

Читать...

🖥 15 лучших редакторов XML для продуктивной разработки

XML – один из самых популярных расширяемых языков разметки. В небольшом обзоре рассказываем о редакторах, которые позволяют работать с ним наиболее эффективно.

Читать...

🔝 Самые интересные статьи за последние дни:

• Черт тебя возьми, CSS. Часть 3

• Как мы перенесли web-сервис в Телеграм Mini Apps

• PostHog для UX-дизайнера: от анализа данных до повышения зарплаты

• Пример создания Full Stack проекта, используя функциональное тестирование как инструмент дизайна

• Где взять энергию? Эпидемия выгорания айтишников

👩‍💻 Как создать компонент тегов с автозаполнением на React

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

Читать...

👩‍💻 Обрабатываем ошибки в React: полное руководство

Независимо от уровня внимательности и количества написанных тестов всегда что-то может пойти не так. Рассмотрим обработку ошибок в React: что делать при их появлении, как их выявить и устранить.

Читать...

👩‍💻 Управление памятью JavaScript: как избежать утечек памяти и повысить производительность

Если вы разрабатывали приложения, то могли сталкиваться с такой проблемой, как утечка памяти. В сегодняшней статье мы расскажем об управлении памятью в JS и о том, как не допустить ее утечек.

Читать...

👩‍💻 Что такое замыкания (closures) в JavaScript?

Замыкания позволяют функции запоминать переменные из своей внешней области видимости даже после завершения выполнения внешней функции.

function makeCounter() {
  let count = 0;
  return function() {
    return ++count;
  };
}

const counter = makeCounter();
console.log(counter()); // 1
console.log(counter()); // 2

🗣️ Замыкания полезны для создания функций с внутренним состоянием, например, счётчиков или настройки приватных данных.

🖥 Подробнее тут

👩‍💻 Проблемы экспорта по умолчанию в модулях JavaScript

Модули JavaScript — способ организации кода в многократно используемые компоненты, используемые совместно в разных файлах и проектах. Модули можно импортировать и экспортировать с помощью двух различных методов: экспорта по умолчанию и именованного экспорта. Рассмотрим экспорт по умолчанию и причины, по которым следует избегать его использования в модулях JavaScript.

Читать...

📐 Стандарты — это не бюрократия, а освобождение

Кажется, что code style, правила коммитов и шаблоны PR — скучная формальность? На деле это способ сэкономить мозг.

👉 Совет: стандартизируй мелочи: от названий веток до структуры директорий. Это избавляет от принятия сотен ненужных решений и оставляет ресурсы на то, что важно — на саму логику и архитектуру.

👩‍💻 BCMath: Новая функция bcdivmod

bcdivmod может быть использован в случаях, когда необходимо получить частное и остаток от деления, и избавляет от необходимости вызывать функции bcdiv и bcmod по отдельности.

Читать...

🦕 7 HTML-привычек, которые выдают в тебе динозавра

Пора устроить генеральную уборку в твоем HTML. Мы нашли 7 устаревших приемов, которые кричат: «Я застрял в прошлом!» Разберем каждый и найдем современную замену. Готов к обновлению?

Читать...

➡️ Главные ошибки новичков-фронтендеров в HTML

Рассказываем про частые ошибки в HTML и о том, как их избежать. Добавляйте в закладки!

Читать...

👩‍💻 ISBN-10

Идентификаторы ISBN-10 состоят из десяти цифр. Первые девять символов - это цифры 0-9. Последняя цифра может быть от 0 до 9 или X, чтобы указать значение 10.

Номер ISBN-10 действителен, если остаток при делении суммы произведений цифр и их позиций на 11 равен 0.

Алгоритм:

ISBN: 1 1 1 2 2 2 3 3 3 9
Позиция: 1 2 3 4 5 6 7 8 9 10
Это действительный ISBN, потому что:
(1*1 + 1*2 + 1*3 + 2*4 + 2*5 + 2*6 + 3*7 + 3*8 + 3*9 + 9*10) % 11 = 0

Пример кода:

validISBN10("1112223339") => true
validISBN10("048665088X") => true
validISBN10("1234512345") => false
validISBN10("XXXXXXXXXX") => false
validISBN10("048665088XZ") => false

Решение задачи🔽

function validISBN10(isbn) {
if (isbn.length !== 10) {
return false;
}

let sum = 0;
for (let i = 0; i < 10; i++) {
let char = isbn[i];
let value;

if (i === 9 && char === 'X') {
value = 10;
} else if (char >= '0' && char <= '9') {
value = parseInt(char, 10);
} else {
return false;
}

sum += value * (i + 1);
}

return sum % 11 === 0;
}

👩‍💻 Полное руководство по “this” в JavaScript

Благодаря поддержке Unicode 16 расширение MBString может работать со всеми новейшими символами Emoji, а также имеет самую актуальную информацию о смене регистра и ширине символов.

Читать...

👩‍💻 Как сделать таймер на CSS

Давайте рассмотрим использование CSS в качестве альтернативы JavaScript для создания простых таймеров. Используем современные свойства CSS, такие, как @property, @keyframes, и псевдоэлементы со значениями counter().

Читать...

👩‍💻 5 непростых вопросов по JavaScript

Разберем пять непростых вопросов: о сравнениях, пустых массивах, странном try catch, стрелочной функции и коварном JSON.stringify. Сможете ответить на них правильно?

Читать...

🔝 Самые интересные статьи за последние дни:

• DRY-фреймворк: продолжение

• Как нарисовать квадрат 3 × 3 см на веб-странице*

• Скучный Интернет и как «бесполезные сайты» могут спасти от этого

• Простой мини-чат на FastApi: Современный интерфейс, вебсокеты и SQLAlchemy с деплоем

• Как мотивировать себя на правильные вещи

⛏ 11 инструментов для ускорения создания пользовательского интерфейса

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

Читать...

👩‍💻 Cube & Dots Loader

Анимированная загрузка в виде точек и куба. Сделана на чистом CSS.

Открыть код...

⚙️ В чем разница между == и === в JavaScript?

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

➡️ Пример:

console.log(5 == '5');   // true, так как '5' преобразуется к числу
console.log(5 === '5');  // false, так как разные типы данных

console.log(null == undefined);  // true, при нестрогом сравнении они считаются равными
console.log(null === undefined); // false, строгий оператор учитывает типы данных

🗣️ Использование === рекомендуется для избегания ошибок, связанных с преобразованием типов. Это помогает сделать код более предсказуемым и читаемым.

🖥 Подробнее тут

👩‍💻 CSS :has() — Псевдокласс, который давно ждали

Преобразуйте свой CSS с помощью псевдокласса :has(), позволяющего стилизовать элементы на основе их дочерних элементов.

Читать...