React JS – Telegram
React JS
17.4K subscribers
617 photos
78 videos
5 files
706 links
React программирование

@haarrp - admin

@itchannels_telegram - 🔥лучшие ит-каналы

@javanoscriptv - продвинутый javanoscript

@programming_books_it - бесплатные it книги

@ai_machinelearning_big_data - ml

№ 5037566384
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
«Сделай, чтобы работало одинаково во всех браузерах». Фронтендеры знают, что эта фраза звучит проще, чем выполняется.

Мы попросили ИИ-помощника ГигаЧат составить спокойный и понятный ответ менеджеру, который объясняет реальность кроссбраузерности без лишних эмоций.
4🖕4👍3🥴2🥱1
Муки совести SEOшника
👍85🥴4
This media is not supported in your browser
VIEW IN TELEGRAM
Совет по CSS 💡

:user-invalid
15👍13
🎶 Управляй ИИ на Mac с Chorus!

Chorus - это мощный инструмент для работы с ИИ, созданный для Mac. Он позволяет интегрировать различные модели ИИ в одном приложении, упрощая доступ и управление ими. Идеально подходит для разработчиков и исследователей.

🚀Основные моменты:
- Интуитивный интерфейс для работы с ИИ
- Поддержка множества моделей
- Оптимизирован для Mac
- Легкая интеграция с другими инструментами

📌 GitHub: https://github.com/meltylabs/chorus

@react_tg
4🔥2👍1😐1
Пишете на JavaScript, но всё ещё завязаны на фреймворки и готовые компоненты? Хотите понимать, как работает браузер, и создавать свои элементы, а не только использовать чужие?

На открытом уроке разберём, как JavaScript взаимодействует с DOM, как с помощью классов и ООП собирать структурированные компоненты и что такое Web Components на практике. Шаг за шагом создадим кастомный HTML-тег с нуля и подключим его к странице так, чтобы элемент можно было переиспользовать.

Урок будет полезен начинающим фронтенд-разработчикам и тем, кто хочет уйти от фреймворков к осознанному пониманию браузерного API. Вебинар проходит в преддверие старта курса «JavaScript Developer. Basic».

Встречаемся 22 декабря в 20:00 МСК.

Регистрация открыта: https://otus.pw/yxOub/?erid=2W5zFHpsJSt
Реклама. ООО "ОТУС ОНЛАЙН-ОБРАЗОВАНИЕ". ИНН 9705100963.
2🖕2🔥1
Совет по CSS 💡

Полезный сниппет, позволяющий скрыть содержимое, но сохранить его доступным для пользователей программ для чтения
👍86🔥2
🚀 Исследуйте React Server Components с RSC Explorer

RSC Explorer — это инструмент для изучения и экспериментов с протоколом React Server Components. Он позволяет запускать серверную и клиентскую части RSC в браузере, просматривать поток RSC шаг за шагом и наблюдать за деревом React в реальном времени. В проекте также представлены примеры, демонстрирующие взаимодействие функций сервера и клиента.

🚀 Основные моменты:
- Интерактивный просмотр RSC потока
- Поддержка примеров для обучения
- Работает в браузере без зависимостей от React
- Открытый проект с возможностью улучшений

📌 GitHub: https://github.com/gaearon/rscexplorer

#javanoscript
👍8🔥21
🔍 Ваши данные под микроскопом

YourInfo — это демонстрация осведомленности о конфиденциальности, показывающая, какую информацию сайты могут собирать о вас через отпечатки браузера и поведенческий анализ. Интерактивная 3D-карта позволяет видеть других посетителей в реальном времени, а AI помогает выявлять личные данные.

🚀Основные моменты:
- Отпечатки браузера: анализ Canvas, WebGL, шрифтов и т.д.
- Отслеживание поведения: движения мыши, прокрутка, ввод текста
- Обнаружение устройства: информация о GPU, CPU, RAM
- AI-профилирование: использование Grok AI для анализа данных
- Реальное время: взаимодействие через WebSocket и CesiumJS

📌 GitHub: https://github.com/siinghd/yourinfo
👍72🔥2
Совет по JavaScript 💡

Используйте параметр rest вместо объекта arguments для приема переменного количества аргументов
9👍5🥱3🔥1
⚡️ Как устроен React, если собрать его с нуля

Этот гайд показывает, как написать упрощённый React своими руками.
Использовать такой код в продакшне не будешь, зато становится понятно,
как внутри работают рендеринг, состояние и обновления.

В статье есть и разбор, и ссылка на GitHub с готовым примером — можно покопаться и поэкспериментировать.

Подробнее:
https://www.rob.directory/blog/react-from-scratch
15🔥3👍1
🖥 На Stepik вышел курс, который учит работать с Docker на реальных проектах.

Владение Docker - навык, который отличает новичка от профи,

Сегодня почти всё разворачивается в контейнерах.

Если ты не умеешь работать с Docker, ты медленнее, зависим от чужих настроек и постоянно ловишь баги «у меня локально работает».

Этот курс от популярного канала Docker Академии научит:

• как упаковывать проекты в контейнеры
• как поднимать целые системы за минуты
• как избегать типичных ошибок в продакшене
• как делать стабильные и повторяемые окружения
•в нем разобраны все возможные ошибки при работе c Docker

Только практика и реальные кейсы - с нуля до уверенного уровня.

🎁 40 процентов скидка действует 48 часов в честь нового года


👉 Записывайся и сделай Docker своим настоящим рабочим инструментом.
Please open Telegram to view this post
VIEW IN TELEGRAM
3🖕2👍1🔥1
⚡️ React.GG Visualized - интерактивная визуализация экосистемы React

Это сайт, который показывает всё вокруг React в виде графа: библиотеки, инструменты, плагины, экосистему.

Каждый узел - это проект, ссылка, зависимость или связка.

Ты можешь:
• видеть, какие пакеты связаны между собой
• исследовать экосистему на лету
• находить полезные инструменты вокруг React
• смотреть, какие решения чаще всего используются

Это отличная карта для понимания, куда React развивается и что стоит изучить следующими шагами.

Ссылка: https://react.gg/visualized
7👍2🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Я увидел эту замечательную технику CSS Video Masking на сайте iPad.

Довольно аккуратное использование CSS - не то, что я ожидал!
👍167
🎨🚀 Анимационная библиотека иконок для React

Its Hover предлагает более 186 анимированных иконок, которые реагируют на взаимодействие. Разработана с использованием motion/react, библиотека позволяет легко настраивать иконки под ваши нужды. Идеально подходит для проектов на Next.js и других современных инструментах.

🚀Основные моменты:
- Динамические иконки с анимацией при наведении
- Полная настройка: изменяйте анимации и цвета
- Совместимость с Next.js и shadcn
- Открытый исходный код под лицензией MIT

📌 GitHub: https://github.com/itshover/itshover
🔥128👍4
This media is not supported in your browser
VIEW IN TELEGRAM
Судьба такая у безотказных
13🔥5
This media is not supported in your browser
VIEW IN TELEGRAM
⚡️ Забирайте стильную находку: React-компонент для превращения видео в ASCII-графику

video2ascii берёт видео, делит кадр на сетку, усредняет пиксели в каждой ячейке, определяет яркость и цвет — и на их основе рендерит изображение из цветных ASCII-символов.

➡️ На данный момент компонент работает только на устройствах с поддержкой WebGL 2.0

📎 GitHub: github.com/elijah0528/video2ascii
🔥152🤔1
🎥 Управляйте 3D-камерами с ComfyUI

ComfyUI-qwenmultiangle — это настраиваемый узел для управления углами 3D-камеры в ComfyUI. Он предлагает интерактивный интерфейс на основе Three.js для регулировки углов и масштабирования, а также выводит формализованные строки запросов для генерации изображений с разных ракурсов.

🚀Основные моменты:
- Интерактивное управление углом и масштабом камеры
- Быстрый выбор предустановленных углов через выпадающие меню
- Реальный просмотр сцены в 3D
- Поддержка нескольких языков интерфейса
- Совместимость с Qwen-Image-Edit для генерации изображений

📌 GitHub: https://github.com/jtydhr88/ComfyUI-qwenmultiangle

#typenoscript
9👍3🔥2
Советы по Javanoscript 💡
👍192🔥1😐1
Генерируем одноразовые email-адреса на своём сервере и принимать на них письма - удобно, когда не хочется светить основной ящик.

TempFastMail - помогает держать приватность и не ловить тонны спама.

Что умеет:
• Ящики реально временные - удаляются через 48 часов без следов.
• Можно регистрироваться на любых сервисах и получать письма.
• Основная почта остаётся чистой - меньше спама и навязчивых рассылок.
• Работает на собственном сервере - никто лишний не лезет в переписку.
• Без ограничений, без рекламы, без регистрации и без сложной установки.

https://github.com/Zhoros/NortixMail

@react_tg
5👍3🔥1
🚀 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

#javanoscript
9👍2🔥2