Telegram Web Link
🐶 Как отладить CSS, чтобы он не ломался в Safari и не стыдно было читать

Вёрстка может выглядеть по-разному на разных браузерах. Этот промпт поможет вам улучшить поддержку кросс-браузерных решений и сделать код более понятным и удобным.

Промпт:

Review my CSS and fix cross-browser issues, improve maintainability, and add comments explaining non-obvious parts.


Чем полезен:

➡️ Показывает несовместимые свойства и предлагает fallbacks

➡️ Рефакторит дублирующиеся или переопределяющиеся правила

➡️ Добавляет комментарии к нестандартным решениям, чтобы через месяц не забыть

💡 Дополнительно можно запросить:

— Советы по организации CSS (например, BEM, layers, atomic CSS)

— Рекомендации по улучшению производительности (критические стили, purge)

— Интеграцию с Autoprefixer или PostCSS

🐸 Библиотека фронтендера

#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5👍1🥱1👾1
🔑 Как я решал проблему с аутентификацией через OAuth2 в SPA

Один из подписчиков поделился своим опытом:

«Когда мы начали интегрировать OAuth2 для аутентификации в нашем SPA на React, проблемы начали сыпаться одна за другой. Хранение токенов, обновление сессий без перезагрузки страницы — всё это стало настоящим головным болем.

Мы решили хранить токены в httpOnly cookie для безопасности — так они менее уязвимы для атак. Но вот как обновить их, не теряя сессию?

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

Добавили небольшой интерцептор для axios, который автоматически добавлял свежий токен в заголовки запросов, если он был обновлён. Всё заработало как часы, и пользователи больше не сталкивались с проблемами сессий.»


А вы сталкивались с подобными трудностями при интеграции OAuth2? Как решали такие задачи?

🐸 Библиотека фронтендера

#междусобойчик
Please open Telegram to view this post
VIEW IN TELEGRAM
🤔5🥱2👍1😁1
🖥 Фишка инструмента: типо-осведомлённый линт без TypeScript

Biome умеет ловить ошибки с промисами (например, забытые await) даже в обычном JS, без TypeScript.

Например:


button.addEventListener('click', async () => {
fetch('/api')
})


Biome подсветит: «у вас async-функция возвращает промис, и он не обработан» → потенциальная утечка ошибок.

ESLint такое ловит только с TypeScript и кучей плагинов.

Biome делает это быстро и без лишнего шума.

Работает через правило noFloatingPromises, включается одной строкой в biome.json

🐸 Библиотека фронтендера

#буст
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5🔥1
Как работает Drag and Drop в HTML5

На собеседовании могут спросить, что такое Drag and Drop API, какие события в него входят и как реализовать перетаскивание без библиотек.

В карточках разберем:

➡️ Является ли Drag and Drop частью HTML-спецификации

➡️ Как работает встроенный API и какие события участвуют

➡️ Пример реализации перетаскивания на чистом JS

➡️ Когда лучше отказаться от стандартного API и чем его заменить

🐸 Библиотека фронтендера
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
1🤩1
2025/07/11 18:14:49
Back to Top
HTML Embed Code: