👍 Нашёл отличную статью на Хабре: «Быстрый Frontend в 2025: почему RTK Query, Tailwind и Vite убивают классические подходы»

В статье:
• Установите и настроите Vite‑сборку для React‑проекта;
• Внедрите RTK Query для удобного и эффективного взаимодействия с API;
• Перейдёте на Tailwind, отказавшись от CSS;
• Свяжете все три технологии, чтобы собрать супер‑отзывчивый, быстрый и минимальный фронтенд‑стек.

🔊 Советую продолжить чтение на Habr!

📣 Code Ready | #статья

Сохраняем и восстанавливаем scroll

Когда пользователь возвращается назад или обновляет страницу, важно вернуть его на ту же позицию. Вот как это сделать — универсально, без фреймворков и библиотек.

Сохраняем позицию при уходе:

window.addEventListener("beforeunload", () => {
  localStorage.setItem("scrollY", window.scrollY);
});

Восстанавливаем при загрузке:

window.addEventListener("load", () => {
  const y = +localStorage.getItem("scrollY") || 0;
  window.scrollTo(0, y);
});

Работает даже после полной перезагрузки и закрытия вкладки. Для SPA можно подвязать на pushState и popstate.

Чтобы запомнить scroll на каждой странице отдельно:

const key = `scroll-${location.pathname}`;
localStorage.setItem(key, window.scrollY);
// и потом: scrollTo(0, +localStorage.getItem(key) || 0)

🔥 Особенно может быть полезно в блогах, каталогах или длинных документах.

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

👩‍💻 Работаете с SQL и устали прыгать между рабочими пространствами?

SQLite3 Editor — минималистичный, но мощный плагин для VS Code, который позволяет прямо внутри редактора создавать, просматривать и редактировать SQL-базы.

Идеален для быстрой отладки, прототипов и локальной аналитики.

📣 Code Ready | #vscode

👩‍💻 Разберем атрибут aria-hidden — для скрытия элементов от вспомогательных технологий!

Глобальное состояние из WAI-ARIA в котором элемент скрыт от вспомогательных технологий, но виден всем остальным пользователям.

Как пишется:

• false — элемент виден вспомогательным технологиям.

• true — элемент скрыт от вспомогательных технологий.

• undefined — браузер сам определяет скрыт элемент или нет в зависимости от его стилей и видимости на странице.

Типичные ситуации: избыточный или дублирующийся текст,
декоративный контент, временно скрытые или свёрнутые элементы (выпадающее меню).

📣 Code Ready | #атрибут

Web-Standards — база знаний и новостей от фронтенд‑комьюнити. Актуальные статьи, переводы, подкасты и события — всё, чтобы писать современный HTML, CSS и JS.

📌 Оставляю ссылочку: web-standards.ru

📣 Code Ready | #ресурсы

Создаём tooltip с копированием в буфер!

Наводим — появляется текст. Кликаем — копируем и показываем «Copied!».

Создаём tooltip-элемент и добавляем в DOM. Находим нужный элемент и создаём подсказку внутри него.

const el = document.querySelector(".copy-tooltip");
const tooltip = document.createElement("div");
el.appendChild(tooltip);

Появление текста и копирование разделены для ясности.

el.addEventListener("mouseenter", () => {
  tooltip.textContent = "Click to copy";
});
el.addEventListener("click", () => {
  tooltip.textContent = "Copied!";
  navigator.clipboard.writeText(el.dataset.copy);
});

Убираем текст при уходе мыши, очищаем подсказку.

el.addEventListener("mouseleave", () => {
  tooltip.textContent = "";
});

🔥 Работает на любом элементе с data-copy, не требует стилей или библиотек.

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

👩‍💻 Рассмотрим scrollbar-gutter — сохраняем макет при появлении скроллбара!

Свойство scrollbar-gutter решает проблему с «прыгающей» шириной контента при появлении или скрытии скроллбара.

Есть 3 возможных значения:

• auto — дефолтное значение.

• stable — отступ для скроллбара появляется если значение overflow равно hidden, scroll или auto, вне зависимости от того, вызывает контент переполнение или нет.

• stable both-edges — то же самое что и stable, но отступы будут создаваться с двух противоположных сторон.

Контент остаётся на месте, независимо от того, есть скролл или нет. Особенно полезно на десктопах.

📣 Code Ready | #свойство

❤️ Нашёл полезную статью по созданию полноценного SPA с использованием Laravel и Vue.js!

В этой статье:
• Настройка Laravel и создание REST API для продуктов;
• Создание компонентов Vue.js для отображения и редактирования продуктов;
• Настройка маршрутизации с Vue Router для SPA;
• Интеграция фронтенда и бэкенда в одно приложение с динамическим интерфейсом;

🔊 Подробное руководство на Habr!

📣 Code Ready | #статья