JavaScript Ready | Программирование
8.19K subscribers
989 photos
60 videos
527 links
Авторский канал по разработке на JavaScript.
Ресурсы, обучения, задачи, шпаргалки.
Ежедневно информация пополняется!

Cотрудничество: @energy_c
Download Telegram
📱 Функции-комбинаторы — помощники, которые экономят ресурсы и делают интерфейс стабильнее!

Всего 3–4 строки кода решают проблемы:
• Защита от повторных кликов.

• Кеширование тяжёлых вычислений.

• Фильтрация «шума» от событий.

• Контроль частоты API-вызовов.


В гайде собраны компактные реализации. Такой набор должен быть под рукой!

📣 JS Ready | #гайд
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥18❤6👍5
☕️ Нашёл отличную статью на Хабре про добавление real-time чата в админку на React — без Jivo и LiveChat!

В этой статье:
• Использование фреймворка Admiral для создания интерфейса админки и маршрутизации;
• Организация WebSocket-соединения с помощью библиотеки Centrifuge;
• Логика управления диалогами и сообщениями внутри ChatContext;
• Компоненты UI — всё с поддержкой файлов и обновлений;

🔊 Продолжай читать на Habr!


📣 JS Ready | #статья
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥12👍5🤝5
📱 Разбираем DOM-методы!

В этой шпаргалке собраны ключевые инструменты для точного поиска элементов, управления атрибутами, классами и прокруткой страницы. Данные методы помогут строить гибкие интерфейсы и оптимизировать работу с DOM.

📣 JS Ready | #шпора
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤18👍7🔥5
📱 Разбираем два метода для работы с массивами!

• push() — добавляет один или несколько элементов в конец существующего массива, изменяет исходный. Подходит, когда нужно динамически расширять массив без создания новой копии.

• concat() — объединяет массив с другими массивами или элементами и возвращает новый. Исходный массив остаётся неизменным. Идеально для иммутабельной логики и работы с функциональным кодом.

Оба метода позволяют работать с коллекциями, но выбор зависит от того, хотите ли вы изменять исходный массив или создавать новый.

📣 JS Ready | #метод
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤19🔥7👍6
📱 Мини To-Do список прямо в консоли!

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

В задаче:
• Реализуем хранение задач в массиве.

• Добавим команды add, done и remove.

• Научим выводить список с номерами и статусами.

• Сделаем удобное обновление прямо из консоли.


В итоге — простой, но полезный инструмент, который можно использовать как тренировочный проект или как базовый планировщик задач.

📣 JS Ready | #задача
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤15👍8🔥7🤝3
Автоматическая генерация уникальных ID для объектов!

В реальных проектах часто нужны уникальные идентификаторы для компонентов, элементов формы или объектов данных.

Можно сделать универсальный генератор, который гарантирует уникальность и читабельность ID.

Создадим локальный генератор с префиксом:
function createIdGenerator(prefix = "id") {
let counter = 0;
return () => `${prefix}-${++counter}`;
}
const generateUserId = createIdGenerator("user");


Используем для объектов:
const user1 = { id: generateUserId(), name: "Alice" };
const user2 = { id: generateUserId(), name: "Bob" };
console.log(user1, user2); // → {id: "user-1"} {id: "user-2"}


Создадим универсальную функцию для массивов объектов:
function assignIds(items, prefix = "item") {
const gen = createIdGenerator(prefix);
return items.map(item => ({ ...item, id: gen() }));
}


Применение:
const tasks = [{ task: "JS" }, { task: "React" }];
console.log(assignIds(tasks, "task"));
// → [{task:"JS",id:"task-1"}, {task:"React",id:"task-2"}]


🔥 Простое, нативное и масштабируемое решение для генерации уникальных ID в проектах.

📣 JS Ready | #практика
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥16👍7❤5🤝1
This media is not supported in your browser
VIEW IN TELEGRAM
👩‍💻 Слышали, что в VS Code ваши Markdown-таблицы могут выглядеть аккуратными и понятными прямо в исходном коде?

Markdown Table Prettifier — плагин, который автоматически форматирует таблицы в тексте. Очень удобно: сразу видно, как выглядит таблица, без постоянного переключения на превью.

Особенно помогает при написании документации и любых текстов с таблицами — комфортно и быстро.

📣 JS Ready | #vscode
Please open Telegram to view this post
VIEW IN TELEGRAM
❤17👍8🔥5
📱 Управляем асинхронностью!

Асинхронный код позволяет запускать задачи параллельно и не блокировать интерфейс. Сегодня разберём, как с помощью Promise, async/await и Promise.all писать чистый и предсказуемый код.

В этом гайде:
• Создаём и обрабатываем базовые Promise.

• Цепочки .then() и .catch() для работы с результатами и ошибками.

• Async/await - упрощаем чтение асинхронного кода.

• Promise.all — параллельные запросы и управление результатами.


Подойдёт для работы с API, таймерами, потоками данных и любыми асинхронными задачами.

📣 JS Ready | #гайд
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
👍16❤7🔥5🤝1