React JS

🎨 Oh‑My‑Logo — «волшебный» генератор логотипов от shinshin86 Oh‑My‑Logo — утилита с простым интерфейсом для создания уникальных логотипов прямо в терминале. Работает быстро, без лишнего визуального шума. 🛠️ Как это работает: - Пользователь вводит название бренда (например, “MyStartup”) и краткое описание - Утилита генерирует цветные ASCII- или Unicode‑логотипы с эффектом паддинга, обводки, рамки или градиента - Вы можете пробовать разные стили и цвета прямо из командной строки 💡 Зачем это нужно: - Быстро придумать временное оформление для README, скрипта или учебного проекта - Стильно оформить вывод утилиты или CI-лог - Упростить создание ASCII-баннера для скриптов или серверных инструментов ⚙️ Кому понравится: - Разработчикам и DevOps инженерам, любящим CLI-стайл - Авторам технической документации и проектных README - Всем, кто хочет быстро и красиво оформить свои утилиты ✨ Вывод: Oh‑My‑Logo — лёгкий способ добавить индивидуальности проектам в текстовом интерфейсе. Без GUI, без лишних шагов — просто командный стиль и творческий подход. https://github.com/shinshin86/oh-my-logo @react_tg

✨ react-hook — коллекция удобных и строго типизированных хуков для React-компонентов. Этот проект предлагает более 20 готовых решений для распространённых задач: от работы с асинхронными операциями через useAsync() до отслеживания изменений DOM с помощью useResizeObserver(). Библиотека имеет продуманную типизацию и автоматическую очистка ресурсов. Например, useEvent() сам удаляет слушатели при размонтировании, а useMousePosition() корректно работает как на touch-, так и на desktop-устройствах. 🤖 GitHub @react_tg

Загрузка в виде танцующих частиц, похожих на снежинки. Примеры применения: 🔶 загрузка расчета стоимости доставки; 🔶 загрузка вывода документа на печать. #прелоадер #ожидание #загрузка https://codepen.io/rikhnovets/pen/RwXgqjQ @react_tg

Скачайте гайд по тестированию сайтов и приложений для веб-студий бесплатно! Обращаемся к тем, кто делает сайты и приложения на заказ, руководит командами коммерческой разработки 💻 ❓Как думаете, есть ли секрет успеха у топовых веб-студий? Может быть, безудержный креатив? Или огромные бюджеты на продакшн? Да, не без этого, но основная причина того, что их выбирают «жирные» клиенты — это обязательное профессиональное тестирование на всех этапах. 😒Можно продолжать работать, думая, что на клиентах и пользователях тестировать дешевле. Но помните, что вы сознательно оставляете свою компанию плестись в хвосте. Согласны быть середнячком с нестабильным потоком клиентов? 🚀Если нет, то прямо сейчас скачивайте бесплатный гайд по тестированию для веб-студий через бот и переходите на новый уровень. 💻А ещё записывайтесь на консультацию с экспертами «Лаборатории Качества». Ни к чему не обязывающая получасовая встреча абсолютно бесплатна: обсудим боли и подберём решения под конкретные сроки и бюджет. Бронируйте слоты здесь! #реклама О рекламодателе erid: 2W5zFJSsnat

5 советов по адаптивному веб-дизайну 👨‍💻 @react_tg

Пачка вариантов анимирования кнопки меню при нажатии на нее #меню #бургеркнопки https://codepen.io/mblode/pen/YzozOm @react_tg

✨ TWC — React-компоненты с Tailwind CSS в одну строку. Этот проект упрощает создание переиспользуемых UI-компонентов, заменяя многословные объявления классов на лаконичный синтаксис. Вместо ручного прописывания className и TWC — React-кдостаточно вызватьоненты с Taс Tailwind-классами. Под капотом сохраняется полная совместимость с RSC и поддержка автодополнения в редакторах. Размер библиотеки — всего 0.5 КБ, что делает её одной из самых лёгких альтернатив styled-components для экосистемы Tailwind. Проект вдохновлён классическими CSS-in-JS решениями, но использует преимущества utility-подхода. 🤖 GitHub @react_tg

Video To ASCII Art Энтузиаст сделал проект, который превращает короткие видео в ASCII-арт. Проект реализован с помощью CSS и JavaScript. По ссылке можно посмотреть код проекта и попробовать воспроизвести различные видео: https://codepen.io/konstantindenerz/pen/YzgRQZj #codepen

🚀 Multiwoven — удобный reverse ETL-инструмент в облаке. Этот проект позволяет развернуть полноценную платформу для синхронизации данных между хранилищами и бизнес-приложениями (Salesforce, HubSpot, Slack) прямо в вашей инфраструктуре. Поддержка AWS, Azure и GCP делает развёртывание простым, а открытая архитектура даёт свободу для кастомизации. Инструмент построен как монорепозиторий, состоящий из нескольких основных частей: бэкенд-сервис, React-интерфейс и фреймворк для создания коннекторов на Ruby. Для локального тестирования достаточно Docker’а, а для прода доступен вариант с Kubernetes и облачными виртуальными машинами. 🤖 GitHub @react_tg

💎 Liquid Glass для React — современный UI-эффект в духе Apple liquid-glass-react — это эффект "жидкого стекла", теперь как компонент для React. Поддерживает преломление, размытие, хроматическую аберрацию и реакцию на курсор. Стильно, плавно и нативно выглядит в интерфейсе. 🧪 Что умеет: • Преломление и искажение (`displacementScale`, blurAmount, `saturation`) • Хроматическая аберрация и глянцевый блик • Эффект "жидкой реакции" на курсор (`elasticity`) • Реалистичный визуальный стиль как у macOS/iOS • Кастомизация: cornerRadius, padding, onClick, mouseContainer 📦 Установка:

npm install liquid-glass-react

📍Пример:

<LiquidGlass
  displacementScale={64}
  blurAmount={0.1}
  saturation={130}
  aberrationIntensity={2}
  elasticity={0.35}
  cornerRadius={100}
>
  <span className="text-white font-medium">Click Me</span>
</LiquidGlass>

⚠️ Браузеры: Chrome и Chromium-based — идеально. Safari и Firefox — частичная поддержка без полного displacement. 🔗 GitHub: https://github.com/rdev/liquid-glass-react @react_tg

Эффект появления персонажа при наведении на карточку с ним #hover #карточки 📌 Код @react_tg

🔥 Успех в IT = скорость + знания + окружение Здесь ты найдёшь всё это — коротко, по делу и без воды. Пока другие ищут, где “подглядеть решение”, ты уже используешь самые свежие инструменты! AI: t.me/ai_machinelearning_big_data Python: t.me/pythonl Linux: t.me/linuxacademiya Собеседования DS: t.me/machinelearning_interview C++ t.me/cpluspluc Docker: t.me/DevopsDocker Хакинг: t.me/linuxkalii Devops: t.me/DevOPSitsec Data Science: t.me/data_analysis_ml Javascript: t.me/javascriptv C#: t.me/csharp_1001_notes Java: t.me/java_library Базы данных: t.me/sqlhub Python собеседования: t.me/python_job_interview Мобильная разработка: t.me/mobdevelop Golang: t.me/golang_interview React: t.me/react_tg Rust: t.me/rust_code ИИ: t.me/vistehno PHP: t.me/phpshka Android: t.me/android_its Frontend: t.me/front Big Data: t.me/bigdatai МАТЕМАТИКА: t.me/data_math Kubernets: t.me/kubernetc Разработка игр: https://t.me/gamedev Haskell: t.me/haskell_tg Физика: t.me/fizmat 💼 Папка с вакансиями: t.me/addlist/_zyy_jQ_QUsyM2Vi Папка Go разработчика: t.me/addlist/MUtJEeJSxeY2YTFi Папка Python разработчика: t.me/addlist/eEPya-HF6mkxMGIy Папка ML: https://t.me/addlist/2Ls-snqEeytkMDgy Папка FRONTEND: https://t.me/addlist/mzMMG3RPZhY2M2Iy 😆ИТ-Мемы: t.me/memes_prog 🇬🇧Английский: t.me/english_forprogrammers 🧠ИИ: t.me/vistehno 🎓954ГБ ОПЕНСОРС КУРСОВ: @courses 📕Ит-книги бесплатно: https://t.me/addlist/BkskQciUW_FhNjEy Подпишись, если хочешь быть в числе тех, кого зовут в топовые проекты!

🔮 Ring UI — официальная библиотека компонентов от JetBrains для веб-интерфейсов. Набор включает готовые React-компоненты, которые используются во внутренних продуктах компании и доступны для сторонних разработчиков плагинов. Библиотека предлагает два варианта использования: предсобранная версия через npm или интеграция исходного кода в свой Webpack-сборщик. Компоненты следуют фирменному стилю JetBrains, включая интерактивные элементы вроде кнопок, алертов и индикаторов загрузки. 🤖 GitHub @react_tg

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

🎨 Веб-дизайнерам на заметку — сервис Pixie позволяет генерировать любые пиксель-арт изображения для проектов. Внутри — несколько мощных моделей на выбор, включая Gemini 2.0 и Flux 1. Генерирует всё: от персонажей и объектов до динозавров и поп-культуры. Работает по промптам, понимает контекст, выдаёт готовую пиксельную графику. 🧪 Доступен бесплатно — можно протестировать по ссылке. https://pixie.haus/ @react_tg

💡 Клевый ресурс для веб-разработчиков: 12 удобных инструментов в одном месте. Внутри — генераторы треугольников, теней, градиентов, оптимизация SVG, конвертеры и многое другое. Все инструменты простые, визуальные и доступны бесплатно. https://omatsuri.app/ @react_tg

⚡️ Re.Pack — новый бандлер для React Native с поддержкой Rspack и Webpack. Проект особенно полезен для микрофронтендов благодаря встроенной поддержке Module Federation. Проект позиционируется как drop-in replacement для Metro, то есть обещает совместимость с существующими RN-приложениями без болезненной миграции. 🤖 GitHub @react_tg

🚀 React Virtuoso — виртуализация списков в React на максимум. Этот набор компонентов умеет всё: от простых списков до чатов, таблиц и masonry-раскладок. Все функции работают из коробки — не нужно вручную рассчитывать размеры элементов или изобретать бесконечную прокрутку. Проект поддерживает группировку с липкими заголовками и адаптивность под разные сценарии. Хотите плавную прокрутку при подгрузке сообщений в чате? Нужна таблица с виртуализацией строк? Virtuoso справляется с этим минимальным количеством кода. 🤖 GitHub @react_tg

🎥 Cap — open-source проект Cap, предлагающий функционал, аналогичный популярному сервису Loom. Инструмент уже сейчас позволяет записывать и редактировать видео прямо с рабочего стола, а в ближайших планах — запуск self-hosted версий для Vercel и Render. Гибридная архитектура проекта сочетает Rust для десктоп-приложения и Next.js для веб-версии, с единой системой компонентов на React. Разработчики активно привлекают сообщество к доработке, особенно в части создания инструкций по самостоятельному развертыванию. 🤖 GitHub @react_tg

Стань частью масштабного ИТ-события от МТС True Tech Day 2025 — третья технологическая конференция МТС для профессионалов ИТ‑индустрии. Одна из главных тем в этом году — тренды и практики искусственного интеллекта. В программе: — Доклады от ученых и зарубежных спикеров с индексом Хирша более 50. — Кейсы применения современных ИИ‑решений — от AI‑агентов, тестов LLM и бенчмарков до вопросов регулирования. — AI-интерактивы и технологические квесты. — Пространство для нетворкинга, …а еще after-party со звездным лайн-апом. Когда: 6 июня Где: Москва, МТС Live Холл и онлайн Участие бесплатное, но мест мало. Регистрируйся по ссылке.