React JS
Open in Telegram
React программирование @haarrp - admin @itchannels_telegram - 🔥лучшие ит-каналы @javascriptv - продвинутый javascript @programming_books_it - бесплатные it книги @ai_machinelearning_big_data - ml № 5037566384
Show more
Network:📈 Analytical overview of Telegram channel React JS
Channel React JS (@react_tg) in the Russian language segment is an active participant. Currently, the community unites 16 106 subscribers, ranking 7 993 in the Technologies & Applications category and 40 644 in the Russia region.
📊 Audience metrics and dynamics
Since its creation on невідомо, the project has demonstrated rapid growth, gathering an audience of 16 106 subscribers.
According to the latest data from 30 October, 2026, the channel demonstrates stable activity. Although there has been a change in the number of participants by -144 over the last 30 days and by -7 over the last 24 hours, overall reach remains high.
- Verification status: Not verified
- Engagement rate (ER): The average audience engagement rate is 14.14%. Within the first 24 hours after publication, content typically collects 5.66% reactions from the total number of subscribers.
- Post reach: On average, each post receives 2 279 views. Within the first day, a publication typically gains 912 views.
- Reactions and interaction: The audience actively supports content: the average number of reactions per post is 16.
- Thematic interests: Content is focused on key topics such as javascript, github, css, интерфейс, браузер.
📝 Description and content policy
The author describes the resource as a platform for expressing subjective opinions:
“React программирование
@haarrp - admin
@itchannels_telegram - 🔥лучшие ит-каналы
@javascriptv - продвинутый javascript
@programming_books_it - бесплатные it книги
@ai_machinelearning_big_data - ml
№ 5037566384”
Thanks to the high frequency of updates (latest data received on 31 October, 2026), the channel maintains relevance and a high level of publication reach. Analytics show that the audience actively interacts with content, making it an important point of influence in the Technologies & Applications category.
16 106
Subscribers
-724 hours
-477 days
-14430 days
Posts Archive
16 112
erid: LjN8KPnH8
Каждый день мы просыпаемся и идём к компьютеру писать код.
Но новогодние праздники — отличный повод отвлечься и показать, чему вы научились за год. Поэтому мы запускаем телеграм-игру «Код сурка», чтобы вы могли блеснуть знаниями в веб-разработке и получить за это ценные призы.
Забрать их легко — достаточно отвечать на вопросы о веб-разработке (их будет аж 1200) и набирать баллы за правильные ответы. Чем выше вы вскарабкаетесь в рейтинге — тем круче призы.
К слову: разыграем профессию на выбор победителя, 2 «инженерии», 7 курсов по вёрстке и JavaScript, 20 безлимитных доступов к тренажёрам на месяц и 70 доступов к тренажёрам на неделю.
Ну и самое приятное — все участники акции смогут легко получить безлимитный доступ к тренажёрам Академии на время игры, а после игры — скидки и бонусы.
Присоединяйтесь, и пусть каникулы не проходят зря.
Реклама. ООО "ИНТЕРАКТИВНЫЕ ОБУЧАЮЩИЕ ТЕХНОЛОГИИ". ИНН 7807382880.
16 112
Чистая архитектура фронтенда
В этой статье речь пойдет об архитектуре фронтенда, проектирование которой подчиняется множеству принципов, в том числе SOLID, KISS, DRY и DDD.
В чем важность архитектуры фронтенда?
Функциональные и нефункциональные требования должны применяться не только к бэкенду, но и к фронтенду. Именно архитектура фронтенда позволяет полностью реализовать потребности бизнеса. Кроме того, она дает более четкое представление о сложности проектов, тем самым сокращая время их создания, риски и стоимость. Однако, на мой взгляд, наибольшая ценность фронтенд-архитектуры заключается в том, что она обеспечивает поддерживаемость и масштабируемость любого проекта.
Что представляет собой архитектура фронтенда?
📌 Читать
16 112
🔥 Дайджест полезных материалов из мира React за неделю
Почитать:
— Многооконное веб приложение — решение для перегруженных интерфейсов
— Как мы отказались от styled-components в React Native приложениях
— Билдер Vue 3 веб приложений
— 8 бесплатных курсов по большим языковым моделям
— Современные варианты баз данных
— Typescript: лучшие практики
— Архитектура серверного рендеринга для SPA
— Интересные трюки HTML. Экстремальный минимализм
— Как сгенерировать безопасный, типизированный Node.js API с использованием Prisma, TypeGraphQL и graphql-query-purifier
— Unveiling the Unparalleled Style: Essentials Hoodie Collection by Fear of God
— Animated 3D text with bubble background using html,css
— Reinforcing my ReactJS Knowledge
— Solid.js vs React: Which is Better in 2024?
— Yes! There’s a Technology that’s Faster than React!
— Resolving React Hook Error and Building a Simple Todo List Page
— Uncovering the React Universe: The Starter Guide
— Mastering useState: A Guide to Avoiding Common Pitfalls in React Development
— Mastering React Performance: In-Depth Guide to useCallback and useMemo. 🚀
— 3 Things I Learned by Building a Portfolio Website
Посмотреть:
🌐 Ollama — модель уровня GPT. Используй GPT без ограничений и абсолютно бесплатно.
🌐 Refactoring a React component - Design Patterns
🌐React Zero to Hero (5 Days)
🌐 WTF Do These Even Mean (⏱ 13:44)
🌐 This New Tailwind Feature Is A Game Changer (⏱ 00:59)
Хорошего дня!
@react_tg
16 112
🖥 Представляем Million.js 3.0!
Million.js - это чрезвычайно быстрый и легкий (<4 кб) виртуальный DOM, который позволяет ускорить работу компонентов React на 70 %.
Сделайте React быстрее⚡️.
▪Github
▪Документация
@react_tg16 112
После 3-х месяцев обучения вы научитесь пользоваться библиотекой React, использовать Type-скрипт и тестировать веб-приложения
с помощью юнит-тестов и cypress.
→ Начните учиться бесплатно
16 112
🖥 Полезные сайты, на которых вы можете попрактиковаться в использовании JavaScript:
1. Codewars
http://codewars.com
2. JS challenger
http://jschallenger.com
3. W3resource
https://w3resource.com/javascript-exercises/
4. Герой JS
https://jshero.net/en/koans/var.html
5. Edabit
http://edabit.com/practice
@react_tg
16 112
🖥 Compound components - это подход, в котором вы объединяете несколько компонентов одной общей сущностью и общим состоянием. Отдельно от этой сущности вы их использовать не можете, тк они являются единым целым.
Это как в BEM нельзя использовать E - элемент, отдельно от B - блока.
На гифке пример, как вы можете использовать этот паттерн, чтобы сделать свои компоненты открытыми для расширения и закрытыми для модификации.
@react_tg
16 112
🔥🔥 Вышел Redux Toolkit 2.0!!!🔥🔥
В свежей версии добавлены новые возможности, ускорена работа, уменьшен размер пакета и удалены устаревшие опции.
Она сопровождается обновлениями для всех наших пакетов семейства Redux.
https://github.com/reduxjs/redux-toolkit/releases/tag/v2.0.0
@react_tg
16 112
Действительно хороший вариант кнопки, никогда не видел ничего подобного.
Даже немного поиграл с ней 😅.
http://rive.app
@react_tg
16 112
🖥 Сайты вы найдете сниппеты кода Javascript:
➽ javascripting - http://javascripting.com
➽ codepen - http://codepen.io
➽ codemyui - http://codemyui.com
➽ jsfiddle - http://jsfiddle.net
➽ jsbin - http://jsbin.com
➽ 30secondsofcode - http://30secondsofcode.org/js/p/1/
➽ freefrontend - http://freefrontend.com
➽ snippit - http://snippit.io
➽ codesandbox - http://codesandbox.io
➽ glitch - http://glitch.com
➽ tabnine - http://tabnine.com
➽ github - http://github.com
@react_tg
16 112
Верстаешь?
Оцени 7 причин пройти наш бесплатный интенсив по Frontend-разработке:
1. Сверстаешь веб-сайт на HTML + CSS;
2. Оживишь страницу с помощью JavaScript;
3. Используешь фронтенд-фреймворк Angular;
4. Подключишь Backend и загрузишь сайт на хостинг;
5. Получишь советы по доработке своего проекта;
6. Добавишь в портфолио 1 качественный проект;
7. Получишь в подарок чек-лист «45 мест для поиска работы».
А главное, ты проведёшь 7 дней в приятной компании Fullstack-разработчика с 10-летним стажем – Романа Чернова.
👉 Проскочить на интенсив бесплатно
Начинаем 6 декабря.
16 112
⚡️ 10 сайтов для отработки навыков работы с фронтендом:
1. Frontend Mentor
http://frontendmentor.io
2. Codewars
http://codewars.com
3. Codewell
http://codewell.cc
4. JavaScript30
http://javascript30.com
5. Кодербайт
http://coderbyte.com
6. CSS Battle
http://cssbattle.dev
7. FreeCodeCamp
http://freecodecamp.org/learn/
8. Frontend Practice
http://frontendpractice.com
9. Задачи CodePen
http://codepen.io/challenges/?re
10. Dev Challenges
http://devchallenges.io
@react_tg
16 112
⭐️Совет по CSS!⭐️
Для создания инвертированного эффекта :hover вы можете использовать режим mix-blend-mode с настраиваемыми свойствами :hover.
button > span {
left: calc(var(--x, 0) * 1px);
top: calc(var(--y, 0) * 1px);
mix-blend-mode: difference;
}const UPDATE = ({target, x, y }) => {
const bounds = target.getBoundingClientRect()
target .style.setProperty('--x', x - bounds.left)
target .style.setProperty('--y', y - bounds .top)
}
const BTNS = document.querySelectorAll('button')
BTNS.forEach(BTN => BTN.addEventListener('pointermove', UPDATE))button:is(:hover, :focus-visible) {
--active: 1;
}
button span {
transform: translate(-50%, -50%) scale(calc(var(--active, 0) * 3);
transition: transform 0.25s;
}
@react_tg16 112
🏆 Stagger Cube — вращающийся куб с анимацией расширения-уменьшения квадратиков в каждой из сторон. Реализована с помощью CSS и JavaScript
https://codepen.io/hexagoncircle/pen/qBdEGrj
@react_tg
16 112
Чёрная Пятница в Практикуме заканчивается 30 ноября. Выберите любой курс до 30.11 и учитесь на 20% дешевле.
→ Выбрать курс
16 112
Что происходит, когда вы вводите в браузер URL-адрес?
Давайте рассмотрим этот процесс пошагово:
1️⃣ Пользователь вводит в браузер URL и нажимает Enter. Первое, что нам нужно сделать, это преобразовать URL в IP-адрес. Браузер ищет IP-адрес в нескольких уровнях кэша.
2️⃣ Если IP-адрес не удается найти ни в одном из кэшей, браузер обращается к DNS-серверам для выполнения рекурсивного DNS-поиска, пока IP-адрес не будет найден.
3️⃣ Теперь, когда у нас есть IP-адрес сервера, браузер посылает на него HTTP-запрос. Для безопасного доступа к ресурсам сервера всегда следует использовать протокол HTTPS. Сначала браузер устанавливает TCP-соединение с сервером с помощью трехстороннего рукопожатия TCP.
4️⃣ Сервер обрабатывает запрос и отправляет ответ. Ответ состоит из 3 частей: HTML, CSS и Javascript. Браузер анализирует HTML и формирует дерево DOM. Он также анализирует CSS и генерирует дерево CSSOM. Затем он объединяет дерево DOM и дерево CSSOM в дерево рендеринга. Браузер отображает содержимое пользователю.
@react_tg
