🖥 Как построить надежную фронтенд-архитектуру

Что такое дизайн «Feature Sliced» во фронтенд-архитектуре? Рассмотрим особенности и результаты применения дизайна, его достоинства и недостатки.

Читать...

👩‍💻 5 важных моментов из JavaScript, которые помогут избегать ошибок

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

Читать...

👩‍💻 Задачка по NodeJS

Создайте приложение на Node.js, которое принимает файл в качестве аргумента командной строки, читает его содержимое, подсчитывает количество уникальных слов и выводит их вместе с количеством вхождений в порядке убывания частоты.

Решение задачи ⬇️

const fs = require('fs');

const filePath = process.argv[2];

if (!filePath) {
console.error("Пожалуйста, укажите путь к файлу.");
process.exit(1);
}

fs.readFile(filePath, 'utf8', (err, data) => {
if (err) {
console.error("Ошибка при чтении файла:", err);
process.exit(1);
}

const words = data.toLowerCase().match(/\b\w+\b/g);
const wordCounts = {};

words.forEach(word => {
wordCounts[word] = (wordCounts[word] || 0) + 1;
});

const sortedWordCounts = Object.entries(wordCounts).sort((a, b) => b[1] - a[1]);

sortedWordCounts.forEach(([word, count]) => {
console.log(`${word}: ${count}`);
});
});

👩‍💻 5 мелких, но крутых React-библиотек

Мы нашли несколько небольших, но очень полезных React-библиотек. Они простые, удобные и могут серьезно облегчить жизнь разработчику.

Читать...

👩‍💻 7 интересных, но редко используемых элементов HTML

Перебрав, казалось, бесконечную вереницу HTML-элементов, я нашел несколько очень полезных, но при этом редко используемых.

Читать...

👩‍💻 Как поменять CSS-стили с помощью JavaScript

Самый очевидный способ изменить CSS-стили — просто подправить CSS-файл. Иногда после этого еще нужно будет скомпилировать проект.

Читать...

👩‍💻 Что такое process.nextTick() в Node.js?

console.log("Начало");

process.nextTick(() => {
  console.log("Выполняется в nextTick");
});

console.log("Конец");

// Вывод:
// Начало
// Конец
// Выполняется в nextTick

➡️ process.nextTick() - это специальная функция в Node.js, которая позволяет отложить выполнение функции до следующей итерации цикла событий (event loop), но до выполнения операций ввода-вывода или таймеров.

🗣️ process.nextTick() используется, когда нужно выполнить код после текущей операции, но до того, как произойдет переход к следующей фазе цикла событий. Это может быть полезно для обработки ошибок, выполнения асинхронных задач или завершения текущей работы, прежде чем позволить другим событиям в очереди исполниться.

✔️ В приведенном примере process.nextTick() гарантирует, что переданная функция выполнится после завершения текущей операции, но перед тем, как Node.js перейдет к другим событиям в цикле. Вывод программы демонстрирует, что сообщение "Выполняется в nextTick" появляется после "Конец", но до любой другой асинхронной операции.

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

• От любви до ненависти с process.send

• «Удаленный» этикет. Про штаны, котов и все такое прочее

• Как я создал систему поиска недооцененных американских акций, используя данные Яху Финанс: мой путь к разумному выбору

• Автоматизировать LinkedIn за месяц без команды разработчиков? Легко! Делюсь своей историей

• Как организовать работу с API в Nuxt 3 без шума и пыли

⚙️ REST API CRUD в Laravel 11 с лучшими практиками

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

Читать...

⚠️ 10 распространённых ошибок в коде и как их избежать

Устраняя эти ошибки и заранее принимая меры, вы сможете писать чистый, удобный и эффективный код. Такой код не только будет отлично работать сейчас, но и упростит вашу работу в будущем.

Читать...

👩‍💻 Задачка по NodeJS

Создайте приложение на Node.js, которое принимает строку в качестве аргумента командной строки и выводит количество гласных букв в этой строке.

Решение задачи ⬇️

const inputString = process.argv[2];
const vowels = inputString.match(/[aeiou]/gi);
const count = vowels ? vowels.length : 0;
console.log("Количество гласных:", count);

⚙️ Гайд по верстке HTML странички. Объяснение принципов, а не примеров

В данной статье я попробую охватить сценарии использования HTML и CSS, которые закроют 80% ваших задач, а также аргументирую, почему создание страничек сайта при помощи верстки не уступает по сложности использованию конструкторов сайта (разница только в скорости).

Читать...

👩‍💻 Шпаргалка по регулярным выражениям в JavaScript

Разбираемся в особенностях написания регулярных выражений и способах их применения в JavaScript.

Читать...

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

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

Читать...

👩‍💻 Что такое Buffer в Node.js?

const buffer = Buffer.from('Hello, World!');
console.log(buffer.toString('hex')); // 48656c6c6f2c20576f726c6421
console.log(buffer.toString()); // Hello, World!

➡️ Buffer — это класс в Node.js, предназначенный для работы с бинарными данными. Он используется для хранения и обработки двоичных данных, что особенно полезно при работе с файловыми системами, потоками и сетевыми запросами.

🗣️ В отличие от строк, которые являются последовательностями символов, Buffer хранит данные как последовательность байтов. Это важно для работы с сетевыми протоколами, шифрованием, или любыми другими операциями, где требуется управление сырыми байтами.

✔️ В приведенном примере Buffer.from() создает буфер из строки, а методы toString('hex') и toString() позволяют преобразовать буфер в шестнадцатеричное представление и обратно в строку соответственно.

👩‍💻 Что нового в TypeScript 5.5: 4 ключевых улучшения

В версии 5.5 TypeScript предлагает ряд новшеств, которые делают код более надежным и читаемым. Рассмотрим ключевые изменения, включая предикаты выводимых типов и оптимизацию работы с массивами.

Читать...

👩‍💻 Возможности контроля в JavaScript: методы AbortSignal.timeout() и AbortSignal.any()

Представляем два малоизвестных, но очень полезных метода управления асинхронными задачами: AbortSignal.timeout() и AbortSignal.any(). Оба эти метода поддерживаются основными веб-браузерами и позволяют корректно прервать асинхронные операции.

Читать...

👩‍💻 VS Code на максималках: 15 крутых расширений для фронтендера

Собрали для вас 15 плагинов, которые облегчат жизнь веб-разработчику. Тут всё: от работы с HTML до интеграции с Figma и Docker.

Читать...

👩‍💻 Задачка по NodeJS

Создайте приложение на Node.js, которое принимает строку JSON в качестве аргумента командной строки, парсит её и выводит значение всех свойств, которые являются числовыми, в формате "ключ: значение".

Решение задачи ⬇️

const jsonString = process.argv[2];

try {
const parsedObject = JSON.parse(jsonString);

Object.entries(parsedObject).forEach(([key, value]) => {
if (typeof value === 'number') {
console.log(`${key}: ${value}`);
}
});
} catch (error) {
console.error('Невозможно распарсить JSON:', error.message);
}

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

• Как объединить фронтенд с бэкендом и не сломать веб-приложение

• Telegram Mini App. Как создать Web App с нуля

• JavaScript: структуры данных и алгоритмы. Часть 3

• Сборка приложений на NestJS и Angular и запуск их в двух вариантах: через PM2 и через «Docker Compose»

• Как я создавал онлайн игру «нарды» (часть третья). Сервер