👩‍💻 Нужно объяснить проект коллеге или самому не потеряться в большом коде?

CodeTour — плагин, который позволяет создавать пошаговые «туры» по коду прямо в VS Code. Можно выделять строки, оставлять комментарии и объединять их в последовательность шагов.

📣 JS Ready | #vscode

📱 JavaScript Array Methods — краткая шпаргалка!

На картинке собраны часто используемые методы массивов в JavaScript — от изменения и объединения данных до поиска и фильтрации элементов.

Примеры показывают, как работают методы: что возвращают, как изменяют массив и где применяются.

Сохрани, чтобы не забыть!

📣 JS Ready | #ресурс

Нативный выбор цвета через браузерный API

Хотите встроить в проект пипетку как в Photoshop — без лишних библиотек? В Chrome, Edge и Opera уже есть нативный EyeDropper API. Работает по HTTPS и в последних версиях Chromium-браузеров.

Шаг 1 — добавляем кнопку:

<button id="pickColor">Выбрать цвет</button>

Шаг 2 — подключаем EyeDropper:

if (!window.EyeDropper) {
  alert("Ваш браузер не поддерживает EyeDropper API");
}

Шаг 3 — открываем пипетку и используем цвет:

const btn = document.getElementById("pickColor");
btn.addEventListener("click", async () => {
  const eyeDropper = new EyeDropper();
  const { sRGBHex } = await eyeDropper.open();
  console.log("Цвет:", sRGBHex);
  document.body.style.backgroundColor = sRGBHex;
});

Пипетка выбирает цвет с экрана и тут же применяет его к фону, а в консоли появляется hex-код.

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

📣 JS Ready | #практика

Мини-интерпретатор выражений на JavaScript!

Создаём калькулятор, который выполняет введённые выражения прямо в браузере — пример динамического исполнения кода через new Function().

Создаём функцию из строки:

const add = new Function('a', 'b', 'return a + b');
console.log(add(2, 3)); // 5

Пользователь вводит выражение — программа вычисляет результат:

const expr = prompt("Введите выражение:");
const calc = new Function(`return ${expr}`);
alert(calc());

Добавляем обработку ошибок для устойчивости:

try {
  const expr = prompt("Введите выражение:");
  const calc = new Function(`return ${expr}`);
  alert(calc());
} catch {
  alert("Ошибка в выражении!");
}

Немного безопасности — разрешаем только числа и операторы:

const expr = prompt("Введите выражение:");
if (/^[\d+\-*/().\s]+$/.test(expr)) {
  alert(new Function(`return ${expr}`)());
} else {
  alert("Недопустимые символы!");
}

🔥 Получаем мини-интерпретатор выражений прямо в браузере — удобно для калькуляторов и формул.

📣 JS Ready | #практика