React JS – Telegram
React JS
17.5K subscribers
603 photos
74 videos
5 files
693 links
React программирование

@haarrp - admin

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

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

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

@ai_machinelearning_big_data - ml

№ 5037566384
Download Telegram
🔥 Самая масштабная атака на экосистему JavaScript

Фишингом угнали npm-аккаунт мейнтейнера qix и пушнули апдейты в 18 ключевых пакетов (chalk, debug, strip-ansi, color-convert и др.) — суммарно это ~2,6 млрд загрузок в неделю.
В обновления вставили браузерный крипто-«клиппер»: на сайтах/в приложениях с уязвимыми версиями он перехватывает трафик и подменяет адреса кошельков.

Скомпрометированные версии — удалить немедленно из всех сред (локальные машины разработчиков, CI/CD, прод):

ansi-styles@6.2.2
debug@4.4.2
chalk@5.6.1
supports-color@10.2.1
strip-ansi@7.1.1
ansi-regex@6.2.1
wrap-ansi@9.0.1
color-convert@3.1.1
color-name@2.0.1
is-arrayish@0.3.3
slice-ansi@7.1.1
color@5.0.1
color-string@2.1.1
simple-swizzle@0.2.3
supports-hyperlinks@4.1.1
has-ansi@6.0.1
chalk-template@1.1.1
backslash@0.2.1
error-ex@1.3.3



⚡️ Что стоит сделать:
Удалить уязвимые версии из дерева зависимостей, пересобрать и задеплоить исправления.
Проверить lock-файлы (package-lock.json, yarn.lock, pnpm-lock.yaml) и node_modules на присутствие перечисленных версий.
Очистить кэш менеджера пакетов: npm cache clean --force, yarn cache clean, pnpm store prune.
Переустановить зависимости с нуля (удалив node_modules и lock-файлы) и заново зафиксировать версии.
Пересобрать фронтенд-бандлы, инвалидировать CDN/кэши, перезапустить рантаймы.
Проверить логи на внешние запросы из бандла, провести аудит внесённых PR/коммитов.
Ротировать ключи/токены, если могли утечь, и ужесточить 2FA/доступ к npm.

📌 Разбор атаки

#security #npm #javanoscript #supplychain #infosec #malware
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
11👍7🔥4❤‍🔥1
📚Gramax: Документация как код

Gramax — это бесплатное приложение для создания, редактирования и публикации документации в формате Markdown. Оно обеспечивает гибкость и доступность оффлайн, а также интеграцию с Git для контроля версий и совместной работы. Идеально подходит для продуктовой документации, внутренних баз знаний и личных заметок.

🚀Основные моменты:
- Интуитивный визуальный редактор для Markdown
- Кроссплатформенное приложение для Windows, Mac и Linux
- Локальное хранение файлов в формате Markdown
- Поддержка 17 языков для создания документации
- Интеграция с Git для коллаборации и контроля версий

📌 GitHub: https://github.com/Gram-ax/gramax
5🥴4🔥2
🚀 GrowChief — open-source инструмент для автоматизации соцсетей

Теперь у вас есть бесплатная альтернатива PhantomBuster и Expandi.

Что умеет:
- Запускать workflow-и: добавления в друзья, сообщения, любые действия в соцсетях
- Поддержка n8n, Zapier, Make
- «Человеческая» автоматизация — имитация движений мыши, чтобы не спалиться
- Enrichment waterfall — находит аккаунт по email или другим данным
- Запуск только в рабочие часы
- Поддержка прокси и headful-режима браузера

🛠 Технический стек: React + NestJS + Prisma + Temporal, база — PostgreSQL.
Лицензия: AGPL-3.0.

📦 Quick Start:

git clone https://github.com/growchief/growchief.git
cd growchief
docker compose up -d


https://github.com/growchief/growchief
🔥85👍2
Свежий опенсорс инструмент, который берёт любой сайт и превращает его в готовое React-приложение за минуту — Open Lovable v2

Построен на базе Firecrawl, поддержка разных LLM, песочницы E2B и Vercel. Короче, идеально для прототипов.

Забираем тут

@react_tg
🔥11👍53🍌1
This media is not supported in your browser
VIEW IN TELEGRAM
Совет по CSS 💡

Возможно, ты не знал, что можно задать и min-width, и width всего одной строкой кода в CSS

@react_tg
👍247🔥5😁4🥴4
This media is not supported in your browser
VIEW IN TELEGRAM
Крутой плагин для Figma, который конвертирует ваши дизайны сразу в приложения на HTML, CSS или React.

Итоговый результат можно экспортировать Replit, запустить или подредачить код.

И да, это БЕСПЛАТНО.
👍24🔥3🐳2🤔1
This media is not supported in your browser
VIEW IN TELEGRAM
— Во сколько лет ты узнал об этом?
— В сейчас лет
🔥32😁14👍9🥱1🐳1
👩‍💻 Руководство: Как использовать "use", новый хук React 19!

🔗 Ссылка: *клик*

@react_tg
Please open Telegram to view this post
VIEW IN TELEGRAM
👍133
🛠️ AI SDK Devtools: Инструмент для отладки и мониторинга AI приложений

AI SDK Devtools предоставляет мощные возможности для отслеживания событий, отладки вызовов инструментов и мониторинга производительности в реальном времени. Он позволяет фильтровать события, визуализировать использование токенов и перехватывать потоки данных AI SDK.

🚀Основные моменты:
- Реальное время мониторинга событий AI
- Отладка вызовов инструментов с параметрами и результатами
- Мониторинг производительности (скорость потоков)
- Фильтрация событий по типу и имени инструмента
- Визуализация использования контекста и токенов

📌 GitHub: https://github.com/midday-ai/ai-sdk-devtools

#typenoscript
5👍2🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Совет по CSS 💡

Иногда фавикон отлично смотрится в светлой теме, но выглядит плохо (или вовсе исчезает) в тёмной, и наоборот.

Такие мелкие детали могут портить общее впечатление от сайта.

Вот как это исправить 👆
9🔥3😐2
📚 AI-ассистенты в Yandex Cloud: автоматизация как сервис

На конференции команда Yandex Cloud представила AI-ассистентов — встроенных помощников для автоматизации облачных задач. Они позволяют отправлять запросы и администрировать базы данных через чат – достаточно написать свою задачу на естественном языке.

Например, в WebSQL через ИИ-ассистента можно сформулировать запрос для Trino, ClickHouse и других баз данных – для этого можно написать в чат, например, “покажи топ-10 клиентов по выручке за прошлый год”. Также можно автоматически разметить метаданные через Data Catalog в MetaData Hub.

В YDB можно автоматизировать администрирование БД с помощью ИИ-ассистента – например, он может предложить более оптимальный запрос или провести диагностику БД. Также можно подключить LLM-модель к YDB через MCP-сервер, чтобы она также могла формировать и исполнять запросы к базе данных.
4🖕3❤‍🔥1
Как сделать чат в React?
😎 Ответ — на бесплатном вебинаре 29 сентября!

WebSocket — это не сложно. Покажем на практике, как связать React-приложение с сервером для обмена сообщениями в реальном времени.
Соберем работающий прототип мессенджера с авторизацией и интерфейсом. Идеальный проект для портфолио.
Присоединяйтесь к бесплатному вебинару курса «JavaScript Developer. Professional».
👉 Пишите код вместе с экспертом: https://otus.pw/ZmAsd/?erid=2W5zFJgK5xU

Реклама. ООО "ОТУС ОНЛАЙН-ОБРАЗОВАНИЕ". ИНН 9705100963.
🖕51👍1
🔥 JSON Crack — это веб-инструмент для визуализации и анализа JSON-данных!

🌟 Он позволяет интерактивно просматривать сложные структуры JSON в виде удобных графических диаграмм, что помогает понять взаимосвязи и иерархию данных. Проект с открытым исходным кодом и поддерживает функции импорта, экспорта и редактирования JSON-файлов.

🖥 Github

@react_tg
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥214👍3
🎶 OpenSpot Music - Your Gateway to Limitless Music

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

🚀 Основные моменты:
- Мобильное приложение на React Native для Android и iOS
- Десктопное приложение на Electron для macOS, Windows и Linux
- Оффлайн-доступ и фоновое воспроизведение
- Поддержка локального хранения и управления окнами

📌 GitHub: https://github.com/BlackHatDevX/openspot-music-app

#javanoscript
👍42
🚀 Углубленное изучение промисов в JavaScript

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

🚀 Основные моменты:
- Упражнения разделены на категории: графовые, конкретные и базовые.
- Каждое упражнение имеет три уровня сложности: начальный, средний и продвинутый.
- Проект включает объяснения и контекст для каждой задачи.
- Подходит для разработчиков, стремящихся улучшить свои навыки работы с промисами.

📌 GitHub: https://github.com/henriqueinonhe/promises-training

#javanoscript
11
FlyCut Caption — это React-компонент для распознавания речи и редактирования субтитров в видео.

🔍 Главное
- Локальное распознавание речи на базе Whisper
- Визуальное редактирование и синхронный предпросмотр
- Экспорт в SRT / JSON
- Кастомизация стилей и поддержка разных языков

👉 Репозиторий: https://github.com/x007xyz/flycut-caption
👍85
🚀 Интенсивный курс по JavaScript и веб-разработке

JSCamp — это bootcamp, который охватывает все от основ до продвинутых технологий JavaScript, включая HTML, CSS, Node.js и Docker. Участники создадут полноценный проект, применяя полученные знания, и получат доступ к видео и материалам на платформе JSCamp.dev.

🚀Основные моменты:
- Полный курс по JavaScript и веб-разработке
- Практический проект от начала до конца
- Доступ к видео и материалам на JSCamp.dev
- Опциональный сертификат и поддержка в Discord
- Обратная связь по CV и участие в воркшопах

📌 GitHub: https://github.com/midudev/jscamp

#javanoscript
4🔥2👍1
🛡TypeScript: почему без него не обойтись фронтендеру?

Фронтенд-разработка уже не мыслится без TypeScript. Сегодня это стандарт, который фигурирует почти в каждой вакансии и позволяет писать код, где ошибки ловятся до запуска. На открытом уроке OTUS «TypeScript простым языком: зачем он нужен и как с ним подружиться» вы узнаете:

–  зачем компании требуют TS и какую пользу он даёт;
–  как типизировать примитивы, интерфейсы, функции и компоненты;
–  как добавить типы в рабочий код и сразу увидеть результат.

❗️ Будет полезен разработчикам на JavaScript, React и Vue, а также всем, кто готовится к собеседованиям.

📆 Урок пройдет 8 октября в 20:00 МСК в преддверие старта курса «JavaScript Developer. Professional». Все участники получают скидку на обучение. 👉 Регистрируйтесь и приходите — это ваш шаг к сильному портфолио: *ссылка* https://otus.pw/Loi8/?erid=2W5zFFv2MNx

Реклама. ООО "ОТУС ОНЛАЙН-ОБРАЗОВАНИЕ". ИНН 9705100963.
4🖕2😁1
🛠️ Синхронизация Zustand хранилищ

zustand-sync — это легковесное middleware для синхронизации Zustand хранилищ между несколькими клиентами с использованием JSON Patch. Идеально подходит для проектов на React, позволяя передавать изменения состояния через WebSocket.

🚀 Основные моменты:
- Легкая интеграция с Zustand
- Поддержка WebSocket для передачи данных
- Генерация и применение JSON Patch для обновлений
- Планы на расширение с дополнительными транспортными провайдерами
- Поддержка аутентификации и разрешения конфликтов

📌 GitHub: https://github.com/ryanntannn/zustand-sync

#typenoscript
9
👩‍💻 FullCalendar — библиотека для простого создания календаря с настраиваемым управлением событиями, функцией перетаскивания и представлениями в виде временной шкалы на вашем сайте!

🔗 Ссылка: *клик*

@react_tg
Please open Telegram to view this post
VIEW IN TELEGRAM
👍11🤔2