React JS

Checkbox card Чекбокс в виде карточек. Если выбрать категорию, картинка становится цветной. Сделано на SCSS. https://codepen.io/aaw3k/pen/zYBxEWX

14 февраля встречаемся на главной фронтенд-конференции Яндекса — «Я 💛 Фронтенд»: ежегодное мероприятие для тех, кто создает современные интерфейсы. Что вас ждет? 📌 Доклады о применении веб-компонентов, использовании LLM, переходе от традиционной адаптивности к новому подходу, о том, как локальные ИИ-модели помогают космической отрасли, и другие 📌 Code in the Dark — баттл по верстке на HTML/CSS 📌 CSS арт-челлендж, интерактивная викторина по фронтенд-разработке и другие активности от команд Яндекса Ведущие конференции — Никита Дубко и Саша Шинкевич. А совсем скоро на сайте стартует Capture the Flag — фронтендерский турнир на скорость с наградами для победителей, live-стримы и другие онлайн-активности до конфы. Присоединяйтесь офлайн в Москве или онлайн! Регистрируемся на ивент здесь.

🎨 Создавайте умных агентов с Craft Agents Craft Agents — это мощный инструмент для работы с агентами, предлагающий интуитивный интерфейс и поддержку множества API. Он позволяет управлять сессиями, интегрироваться с различными сервисами и настраивать рабочие процессы без необходимости в коде. 🚀Основные моменты: - Многофункциональный десктопный клиент с управлением сессиями - Интеграция с 32+ инструментами Craft и REST API - Гибкая система разрешений и динамическое управление статусами - Поддержка фоновых задач и визуализация инструментов - Открытый исходный код с возможностью кастомизации 📌 GitHub: https://github.com/lukilabs/craft-agents-oss

DevExtreme — это готовый к использованию корпоративный набор мощных и привлекательных компонентов пользовательского интерфейса для популярных интерфейсных фреймворков: Angular, React, Vue и jQuery. Компоненты DevExtreme адаптивны и доступны. Они хорошо работают на разных устройствах, с экранами разных размеров и при использовании разных способов ввода. Независимо от того, использует ли ваша целевая аудитория телефоны, ПК или программы для чтения с экрана, компоненты DevExpress справятся с задачей.

Знаете ли вы, что можно изменить метод формы в HTML-форме, указав атрибут formMethod на кнопке?

🎨 Улучши свою продуктивность с baoyu-skills! baoyu-skills предлагает набор инструментов для повышения эффективности работы с контентом. Включает в себя генерацию изображений, создание слайдов и утилиты для обработки данных, что делает его идеальным помощником для авторов и маркетологов. 🚀Основные моменты: - Генерация контента и публикаций. - Создание изображений и слайдов в различных стилях. - Утилиты для обработки и конвертации данных. - Легкая интеграция с Claude Code. 📌 GitHub: https://github.com/JimLiu/baoyu-skills #javascript

⚡️ Вайбкодинг вышел на новый уровень: энтузиасты сделали open-source интерфейс для управления ИИ-агентами — Vibecraft. Это прям геймификация разработки: карта, персонажи-агенты, звуковое сопровождение и “ходы” как в игре. При этом всё максимально практично - видно, кто чем занят, где агент завис, что сломал и на каком шаге ошибся. Самое приятное - всё работает локально. Никакие промпты и файлы никуда не улетают: весь код и контекст остаются у тебя. 💯 GitHub: https://github.com/Nearcyan/vibecraft Демо: https://vibecraft.sh/

⚡️ Antibot-Detector Расширение для браузера, предназначенное для обнаружения систем защиты от ботов, CAPTCHA-сервисов и механизмов веб-безопасности в реальном времени. Приложение может идентифицировать более 26 различных сервисов, включая Cloudflare, reCAPTCHA, DataDome, PerimeterX и другие, предоставляя оценку уверенности для каждого обнаружения. Еще, расширение оснащено продвинутыми инструментами захвата, которые помогают анализировать и обходить защитные механизмы. https://github.com/scrapfly/Antibot-Detector

🚀 Antigravity Kit: AI Agent Templates for Enhanced Workflows Antigravity Kit предоставляет набор шаблонов для создания AI-агентов с различными навыками и рабочими процессами. Включает 16 специализированных агентов, 40 модулей знаний и 11 команд для автоматизации задач. 🚀 Основные моменты: - 16 специализированных AI-агентов для разных задач - 40 модулей навыков для контекстуального применения - 11 команд для упрощения рабочих процессов - Автоматическое применение правил из конфигурации - Полная документация по архитектуре и использованию 📌 GitHub: https://github.com/vudovn/antigravity-kit #javascript

✔ Генерируем одноразовые email-адреса на своём сервере и принимать на них письма - удобно, когда не хочется светить основной ящик. TempFastMail - помогает держать приватность и не ловить тонны спама. Что умеет: • Ящики реально временные - удаляются через 48 часов без следов. • Можно регистрироваться на любых сервисах и получать письма. • Основная почта остаётся чистой - меньше спама и навязчивых рассылок. • Работает на собственном сервере - никто лишний не лезет в переписку. • Без ограничений, без рекламы, без регистрации и без сложной установки. https://github.com/Zhoros/NortixMail @react_tg

🎥 Управляйте 3D-камерами с ComfyUI ComfyUI-qwenmultiangle — это настраиваемый узел для управления углами 3D-камеры в ComfyUI. Он предлагает интерактивный интерфейс на основе Three.js для регулировки углов и масштабирования, а также выводит формализованные строки запросов для генерации изображений с разных ракурсов. 🚀Основные моменты: - Интерактивное управление углом и масштабом камеры - Быстрый выбор предустановленных углов через выпадающие меню - Реальный просмотр сцены в 3D - Поддержка нескольких языков интерфейса - Совместимость с Qwen-Image-Edit для генерации изображений 📌 GitHub: https://github.com/jtydhr88/ComfyUI-qwenmultiangle #typescript

⚡️ Забирайте стильную находку: React-компонент для превращения видео в ASCII-графику video2ascii берёт видео, делит кадр на сетку, усредняет пиксели в каждой ячейке, определяет яркость и цвет — и на их основе рендерит изображение из цветных ASCII-символов. ➡️ На данный момент компонент работает только на устройствах с поддержкой WebGL 2.0 📎 GitHub: github.com/elijah0528/video2ascii

Судьба такая у безотказных

🎨🚀 Анимационная библиотека иконок для React Its Hover предлагает более 186 анимированных иконок, которые реагируют на взаимодействие. Разработана с использованием motion/react, библиотека позволяет легко настраивать иконки под ваши нужды. Идеально подходит для проектов на Next.js и других современных инструментах. 🚀Основные моменты: - Динамические иконки с анимацией при наведении - Полная настройка: изменяйте анимации и цвета - Совместимость с Next.js и shadcn - Открытый исходный код под лицензией MIT 📌 GitHub: https://github.com/itshover/itshover

Я увидел эту замечательную технику CSS Video Masking на сайте iPad. Довольно аккуратное использование CSS - не то, что я ожидал!

⚡️ React.GG Visualized - интерактивная визуализация экосистемы React Это сайт, который показывает всё вокруг React в виде графа: библиотеки, инструменты, плагины, экосистему. Каждый узел - это проект, ссылка, зависимость или связка. Ты можешь: • видеть, какие пакеты связаны между собой • исследовать экосистему на лету • находить полезные инструменты вокруг React • смотреть, какие решения чаще всего используются Это отличная карта для понимания, куда React развивается и что стоит изучить следующими шагами. Ссылка: https://react.gg/visualized

🔥 На stepik вышел курс, который учит Создавать настоящие AI-сервисы, а не просто запускать скрипты? Этот практический курс по Python и FastAPI покажет, как собрать полноценное приложение с ИИ, базой данных, автогенерацией контента и Telegram-ботом. Ты пройдёшь путь от первого HTTP-запроса до рабочего сервиса, который сам генерирует текст через ИИ, сохраняет данные, отправляет результаты по расписанию и отвечает пользователям. Никакой теории ради теории - только практические шаги, из которых рождается реальный продукт. 🎁 48 часов действует скидка в 40% процентов 👉 Начать учиться на Stepik

⚡️ Как устроен React, если собрать его с нуля Этот гайд показывает, как написать упрощённый React своими руками. Использовать такой код в продакшне не будешь, зато становится понятно, как внутри работают рендеринг, состояние и обновления. В статье есть и разбор, и ссылка на GitHub с готовым примером — можно покопаться и поэкспериментировать. Подробнее: https://www.rob.directory/blog/react-from-scratch

Совет по JavaScript 💡 Используйте параметр rest вместо объекта arguments для приема переменного количества аргументов ✅