⚙️ Методы жизненного цикла веб-компонента

Вчера мы изучили различные способы инстанцирования веб-компонента. В статье был упомянут метод жизненного цикла connectedCallback(). Сегодня поговорим об остальных методах жизненного цикла веб-компонентов.

Читать...

👩‍💻 Создание веб-компонента с нуля

Сегодня я решил, что мы создадим HTML веб-компонент с нуля. Давайте создадим компонент, показывающий и скрывающий текст при переключении кнопки.

Читать...

👩‍💻 Управление Node.js 19 и NPM 9 с помощью NVM

Статья знакомит с использованием NVM для управления версиями Node.js и npm, показывая примеры с Node.js 19 и npm 9. Объясняются преимущества NVM для безопасного обновления и тестирования новых возможностей.

Читать...

🎞 Я создал Telegram-бота (FYTT), который ищет Telegram-каналы всех ваших подписок на YouTube

Статья рассказывает о создании Telegram-бота для поиска каналов любимых авторов, переместившихся с YouTube. Описан стек технологий: Node.js с telegraf.js, MongoDB с mongoose, Express.js, Google API и Lemnos API для работы с данными.

Читать...

👩‍💻 Эффективная многопоточность в Node.js: как использовать Atomics

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

Читать...

📈 Подборка статей для вашей карьеры

• Пришёл на вакансию дизайнера, а стал питонистом: как IT-специалисты нашли свою первую работу

• На сколько денег может рассчитывать ИТ-предприниматель в разных ветках развития

• Анализ задачи с собеседования в Google: конь и телефонные кнопки

• Быстрый старт в QA Fullstack: чем вооружиться будущему стажеру в Альфа-Банке

• Как убить самоорганизацию в команде: вредные советы для лидера

👩‍💻 Как использовать npm без опаски

Статья предлагает использовать прокси и кэширование для реестра npm с помощью Verdaccio или Nexus, чтобы повысить безопасность и ускорить установку пакетов. Также обсуждаются риски скриптов жизненного цикла npm и способы их безопасного использования.

Читать...

👩‍💻 Расширения VSCode для комфортной работы с проектами

В статье рассказывается, как настроить рабочее пространство VSCode для разработки. Обзор полезных расширений, которые повышают удобство и продуктивность, и советы по их применению.

Читать...

👩‍💻 Испортили git rebase?

Git rebase — мощный инструмент, помогающий перенести или объединить один, или несколько коммитов в новый базовый коммит, переписав историю проекта так, чтобы ваша ветка выглядела созданной из другого коммита. Он помогает поддерживать более чистую и линейную историю.

Читать...

🤔 Как избавиться от WebSockets и сэкономить $1 млн в год: неожиданные решения для оптимизации

Детальный разбор того, как простой анализ производительности помог обнаружить неэффективность WebSocket и оптимизировать передачу данных.

Читать...

💬 Различные (и современные) способы переключения контента

Давайте уделим немного времени рассмотрению Dialog API, Popover API и остальных. Рассмотрим, когда лучше использовать каждый из них в зависимости от требований. Модальные или немодальные? JavaScript или чистый HTML/CSS? Не уверены? Не волнуйтесь, мы разберёмся во всём этом.

Читать...

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

Напишите скрипт, который принимает путь к папке, считывает все файлы в этой папке и записывает их имена, размеры (в байтах) и дату последнего изменения в JSON-файл.

Пример использования:

node generateFileInfo.js ./example-folder

"name": "file1.txt",
"size": 1234,
"lastModified": "2023-09-01T12:34:56.789Z"

"name": "file2.js",
"size": 456,
"lastModified": "2023-09-02T14:56:23.123Z"

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

const fs = require('fs');
const path = require('path');

const folderPath = process.argv[2];

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

fs.readdir(folderPath, (err, files) => {
if (err) {
console.error('Ошибка чтения папки:', err.message);
return;
}

const fileInfo = files.map(file => {
const filePath = path.join(folderPath, file);
const stats = fs.statSync(filePath);

return {
name: file,
size: stats.size,
lastModified: stats.mtime.toISOString(),
};
});

fs.writeFile('files.json', JSON.stringify(fileInfo, null, 2), err => {
if (err) {
console.error('Ошибка записи файла:', err.message);
return;
}
console.log('Информация о файлах сохранена в files.json');
});
});

👩‍💻 Улучшение производительности с делегированием событий

Статья объясняет технику делегирования событий в веб-разработке, показывая, как использование одного слушателя на родительском элементе упрощает управление событиями и повышает производительность.

Читать...

⚙️ PHP 8.4: Curl: Новая опция CURLOPT_PREREQFUNCTION

Расширение Curl в PHP 8.4 представляет новую опцию CURLOPT_PREREQFUNCTION, позволяющую задать пользовательский callable для принятия решения о продолжении или прерывании запроса. Эта возможность доступна, если расширение собрано с libcurl 7.80.0 или более поздней версии.

Читать...

👩‍💻 Поиск самого длинного слова в строке

Напишите функцию, которая принимает строку и возвращает самое длинное слово. Если несколько слов имеют одинаковую длину, вернуть первое из них.

Пример:

const sentence = "JavaScript is an amazing programming language";
const result = findLongestWord(sentence);
console.log(result); 
// Ожидаемый результат: "programming"

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

function findLongestWord(sentence) {
return sentence
.split(' ')
.reduce((longest, word) => (word.length > longest.length ? word : longest), '');
}

// Пример использования:
const sentence = "JavaScript is an amazing programming language";
const result = findLongestWord(sentence);
console.log(result);
// Ожидаемый результат: "programming"

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

• Стили, темы и адаптивная верстка в React Native

• Переводчик текста для терминала

• Элегантная реализация Long Press обработчика с помощью CSS анимации

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

• Как найти работу мечты системному аналитику?

⚠️ Ошибки, которые я совершил, пытаясь быть «слишком правильным» в разработке

Статья исследует ошибки, связанные с попытками создать «идеальный» код. Автор делится опытом, где стремление к универсальности, избыточное кэширование и усложнённые решения усложнили задачи вместо упрощения.

Читать...

⚙️ Что такое fs.promises в Node.js и как его использовать?

fs.promises — это API для работы с файловой системой с использованием промисов, что позволяет писать асинхронный код без коллбеков.

➡️ Пример:

const fs = require('fs').promises;

async function readFile() {
  try {
    const data = await fs.readFile('example.txt', 'utf8');
    console.log('Содержимое файла:', data);
  } catch (err) {
    console.error('Ошибка чтения файла:', err.message);
  }
}

readFile();

🗣️ В этом примере fs.promises.readFile используется для чтения файла асинхронно, делая код чище и проще для обработки ошибок через try-catch.

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

👩‍💻 Обзор наследования в JavaScript

Статья изучает шаблоны наследования в JavaScript, основанные на прототипах. Рассматриваются их уникальные особенности и применение, чтобы выбрать наиболее подходящий подход для задач.

Читать...

👩‍💻 Как спрятать любые данные в PNG

Статья объясняет, как спрятать данные в PNG-изображении, используя младшие биты (LSB) пикселей. Рассматривается структура PNG, каналы R, G, B и альфа, а также методы внедрения данных без заметного изменения картинки.

Читать...