React JS
Kanalga Telegram’da o‘tish
React программирование @haarrp - admin @itchannels_telegram - 🔥лучшие ит-каналы @javascriptv - продвинутый javascript @programming_books_it - бесплатные it книги @ai_machinelearning_big_data - ml № 5037566384
Ko'proq ko'rsatish
Tarmoq:📈 Telegram kanali React JS analitikasi
React JS (@react_tg) Rus til segmentidagi kanali faol ishtirokchi. Hozirda hamjamiyat 16 112 obunachidan iborat bo'lib, Texnologiyalar & Aralashmalar toifasida 7 993-o'rinni va Rossiya mintaqasida 40 644-o'rinni egallagan.
📊 Auditoriya ko‘rsatkichlari va dinamika
невідомо sanasidan buyon loyiha tez o‘sib, 16 112 obunachiga ega bo‘ldi.
30 Oktabr, 2026 dagi oxirgi ma’lumotlarga ko‘ra kanal barqaror faollikka ega. Oxirgi 30 kunda obunachilar soni -144 ga, so‘nggi 24 soatda esa -7 ga o‘zgardi va umumiy qamrov yuqori darajada qolmoqda.
- Tasdiqlash holati: Tasdiqlanmagan
- Jalb etish (ER): Auditoriya o‘rtacha 14.14% darajada jalb etiladi. Nashrdan keyingi dastlabki 24 soatda kontent odatda umumiy obunachilar sonining 5.66% ini tashkil etuvchi reaksiyalarni to‘playdi.
- Post qamrovi: Har bir post o‘rtacha 2 279 marta ko‘riladi; birinchi sutkada odatda 912 ta ko‘rish yig‘iladi.
- Reaksiyalar va o‘zaro ta’sir: Auditoriya faol: har bir postga o‘rtacha 16 ta reaksiya keladi.
- Tematik yo‘nalishlar: Kontent javascript, github, css, интерфейс, браузер kabi asosiy mavzularga jamlangan.
📝 Tavsif va kontent siyosati
Muallif resursni shaxsiy fikrni ifoda etish maydoni sifatida ta’riflaydi:
“React программирование
@haarrp - admin
@itchannels_telegram - 🔥лучшие ит-каналы
@javascriptv - продвинутый javascript
@programming_books_it - бесплатные it книги
@ai_machinelearning_big_data - ml
№ 5037566384”
Yuqori yangilanish chastotasi (oxirgi ma’lumot 31 Oktabr, 2026 da olingan) sababli kanal doimo dolzarb va katta qamrovli bo‘lib qoladi. Analitika auditoriya kontent bilan faol hamkorlik qilishini, uni Texnologiyalar & Aralashmalar toifasidagi muhim ta’sir nuqtasiga aylantirishini ko‘rsatadi.
16 112
Obunachilar
-724 soatlar
-477 kun
-14430 kun
Postlar arxiv
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
