Руслан Куянец | Reactify
前往频道在 Telegram
Я IT-специалист, ментор и основатель проекта YeaHub и сообщества Reactify. Здесь рассказываю про Frontend и IT. Менторство: https://reactify.ru YouTube канал: https://youtube.com/@reactify-it YeaHub: https://yeahub.ru/ Связь: @ruslan_kuyanets
显示更多6 553
订阅者
无数据24 小时
-217 天
-6930 天
数据加载中...
相似频道
![Frontender's notes [ru]](https://cdn.tlmtr.io/_next/image?url=https%3A%2F%2Fimg.tlmtr.io%2Fc%2F1qrVZ3%2F5348049928330532677%3Fty%3Dx&w=96&q=75){kind=small}
标签云
进出提及
---
---
---
---
---
---
吸引订阅者
八月 '26
八月 '26
+97
在0个频道中
七月 '26
+158
在5个频道中
Get PRO
六月 '26
+374
在26个频道中
Get PRO
五月 '26
+376
在0个频道中
Get PRO
四月 '26
+350
在1个频道中
Get PRO
三月 '26
+103
在0个频道中
Get PRO
二月 '26
+108
在0个频道中
Get PRO
一月 '26
+139
在2个频道中
Get PRO
十二月 '25
+128
在1个频道中
Get PRO
十一月 '25
+142
在4个频道中
Get PRO
十月 '25
+166
在1个频道中
Get PRO
九月 '25
+436
在1个频道中
Get PRO
八月 '25
+101
在1个频道中
Get PRO
七月 '25
+147
在2个频道中
Get PRO
六月 '25
+226
在2个频道中
Get PRO
五月 '25
+191
在2个频道中
Get PRO
四月 '25
+175
在1个频道中
Get PRO
三月 '25
+173
在1个频道中
Get PRO
二月 '25
+224
在0个频道中
Get PRO
一月 '25
+358
在2个频道中
Get PRO
十二月 '24
+160
在2个频道中
Get PRO
十一月 '24
+284
在11个频道中
Get PRO
十月 '24
+376
在7个频道中
Get PRO
九月 '24
+304
在6个频道中
Get PRO
八月 '24
+498
在24个频道中
Get PRO
七月 '24
+435
在12个频道中
Get PRO
六月 '24
+401
在5个频道中
Get PRO
五月 '24
+228
在0个频道中
Get PRO
四月 '24
+533
在3个频道中
Get PRO
三月 '24
+713
在4个频道中
Get PRO
二月 '24
+151
在1个频道中
Get PRO
一月 '24
+295
在9个频道中
Get PRO
十二月 '23
+782
在22个频道中
Get PRO
十一月 '23
+187
在3个频道中
Get PRO
十月 '23
+375
在7个频道中
| 日期 | 订阅者增长 | 提及 | 频道 | |
| 27 八月 | 0 | |||
| 26 八月 | +7 | |||
| 25 八月 | +3 | |||
| 24 八月 | +2 | |||
| 23 八月 | +4 | |||
| 22 八月 | 0 | |||
| 21 八月 | +4 | |||
| 20 八月 | +4 | |||
| 19 八月 | +4 | |||
| 18 八月 | +12 | |||
| 17 八月 | +17 | |||
| 16 八月 | +2 | |||
| 15 八月 | +1 | |||
| 14 八月 | +3 | |||
| 13 八月 | +5 | |||
| 12 八月 | +6 | |||
| 11 八月 | +1 | |||
| 10 八月 | +4 | |||
| 09 八月 | +2 | |||
| 08 八月 | 0 | |||
| 07 八月 | +2 | |||
| 06 八月 | 0 | |||
| 05 八月 | +5 | |||
| 04 八月 | +3 | |||
| 03 八月 | 0 | |||
| 02 八月 | 0 | |||
| 01 八月 | +6 |
频道帖子
Вас интересует тема Валютных Удаленок и Международного рынка?
| 2 |  Offer Man 😁 | 1 029 |
| 3 |  👩💻 Как работает CI/CD в Production: GitHub Actions, Docker, ArgoCD и GitOps
Как выглядит CI/CD в настоящем проекте? В этом видео разберем полный pipeline от Git Push до Production: GitHub Actions, Docker, ArgoCD и GitOps.
Покажу весь путь от изменения кода до деплоя в production:
— как устроен CI/CD процесс;
— как работает GitHub Actions;
— сборка и запуск Docker контейнеров;
— автоматизация проверок и деплоя;
— как используется ArgoCD;
— что такое GitOps и как он применяется на практике.
Мы не будем просто рисовать схемы — я покажу еще весь процесс на живом проекте:
✅ трекер задач;
✅ GitHub Actions;
✅ Docker;
✅ структура проекта;
✅ pipeline;
✅ deployment flow.
Это видео подойдет frontend, backend и fullstack разработчикам, которые хотят понять, как реально работает DevOps-процесс в команде.
Видео уже на канале Reactify!
Я не оставляю ссылку, так как видео лучше продвигается, если заходить на него напрямую с YouTube. Это помогает улучшить его рейтинг и увеличить шансы на органическое продвижение.
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 1 109 |
| 4 |  Так, ребята
Если я захочу перейти во фуллстек, то как называть канал? Fullstackify?
Есть идеи? | 1 118 |
| 5 |  Вчера побывал на «Профсоюзная Конференция».
Хочу сказать следующее: «Если интернешенал - это праздник доты, то профсоюзная - это праздник айти»
Ни на одной другой конфе/митапе я так много не общался.
Зарядился энергией от самых разных людей. Хардворк ✊🏼
В комментарии пришлю немного видео/фото с конфы | 1 260 |
| 6 |  +8Как устроены ИИ-агенты, которые умеют программировать сами?
27 августа в 19:00 встречаемся в кампусе Центрального университета на митапе про кодинговых ИИ-агентов.
На митапе:
⚫️ узнаем, почему кодинговые агенты превращаются в отдельные сервисы и как устроены распределенные агентные системы;
⚫️ разберем протоколы ACP и A2A и посмотрим, как разные агенты и клиенты могут взаимодействовать между собой;
⚫️ на практическом мастер-классе создадим собственного автономного агента с помощью Deep Agents от LangChain — с планированием, управлением контекстом, файловой системой и параллельной работой сабагентов.
Мастер-класс — с ноутбуками, так что получится не только посмотреть, но и попробовать собрать агента своими руками.
Спикеры:
⚫️Денис Артюшин — технический владелец продукта агентской платформы в Т-Банке
⚫️Полина Реброва — ведущий инженер по разработке, Сбер
⚫️Александр Шахов — инженер-преподаватель и академический руководитель направления «Разработка» в Центральном университете
📍 27 августа, 19:00
📍 Кампус Центрального университета, Москва
Зарегистрироваться по ссылке | 1 518 |
| 7 |  Видео по CI/CD готово
Такого вы не видели еще
На следующей неделе... скоро.. | 1 546 |
| 8 |  ИИ эпидемия
Уже не первый раз слышу такой фидбек | 1 764 |
| 9 |  Все готово
Завтра сниму видео про CI/CD, в понедельник опубликую
Потом сниму видео по инфраструктуре
Все это я буду показывать на примере YeaHub
https://github.com/YeaHubTeam/yeahub-platform | 1 738 |
| 10 |  视频消息 | 1 480 |
| 11 |  💪 Как я довожу Frontend-разработчиков до оффера (показываю всю систему)
https://www.youtube.com/watch?v=ZIl3kHEL0XQ
Разошелся я с контентом, но мои гайды по менторству устаревают очень быстро за счет добавления новых ритуалов 😁
Плюс решил окончательно на схеме отбить все вопросы по процессу обучения. Один раз провести презентацию и отправлять это видео в приветственном сообщении, чтобы экономить 15–20 минут на каждой консультации на вопросы вроде: «А с чего начнем?», «Как всё проходит?», «А что такое стажировка?» и т. д.
В общем, видос уже на YouTube. Держим качество. Улучшаем всё.
Скоро видео по инфраструктуре, CI/CD и деплою.
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 1 578 |
| 12 | Задания с собеса
Задание 1 (код с Promise):
let counter = 0;
const increment = new Promise(resolve => {
counter++;
resolve(0);
});
await increment;
await increment;
console.log(counter);
Вопрос: Чему будет равен counter?
Задание 2 (React-компонент с Counter A и Counter B):
import React, { useState } from "react";
import "./styles.css";
console.log = (...args) => {
const node = document.createElement("div");
node.innerHTML = args.join(" ");
document.getElementById("log").appendChild(node);
};
const Counter = (props) => {
console.log(`Counter ${props.name} rendered`);
return (
<div>
Counter {props.name} : {props.count}
</div>
);
};
export default function App() {
const [countB] = useState(0);
const [countA, setCountA] = useState(0);
const handleCountA = () => {
setCountA(countA + 1);
};
return (
<div className="App">
<Counter name="A" count={countA} />
<Counter name="B" count={countB} />
<button onClick={handleCountA}>Count A</button>
</div>
);
}
Задача: Counter A и Counter B рендерятся вместе, нужно чтобы Counter B не ре-рендерился при клике на Counter A. Оптимизировать компонент.
Задание 3 (сравнение функций):
const test = 0 => test()
const test1 = async 0 => await test1()
const test2 = async 0 => await Promise.resolve(0).then(test2)
const test3 = 0 => setTimeout(test3, 1)
Вопрос (по контексту собеса): С чем можно столкнуться (например, переполнение стека, бесконечный цикл, таймаут и т.д.)? Вопрос про переполнение стека вызовов и разницу между синхронной/асинхронной рекурсией.
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 1 467 |
| 13 |  🖥 20 вопросов с жесткого Frontend собеседования: V8 / JS engine / React Fiber
Почему один JavaScript-код работает быстро, а другой тормозит? Что происходит внутри V8, когда мы запускаем наш код?
В этом видео разбираем оптимизации JavaScript под капотом:
— как работает JIT-компилятор
— что такое Hidden Classes в V8
— почему структура объектов влияет на производительность
— что такое мономорфизм и deoptimization
— как работает Garbage Collector и поколенческий сборщик мусора
— почему создание лишних объектов может замедлять приложение
— когда использовать Object, а когда Map
Это вопросы, которые часто встречаются на собеседованиях Frontend Senior уровня, но самое важное — понять не термины, а логику работы JavaScript-движка.
После этого видео станет понятнее:
- почему V8 любит предсказуемый код
- почему один и тот же JS может работать в 100 раз быстрее в разных условиях
- какие привычки в коде помогают движку оптимизировать приложение
JavaScript — это не просто язык, который выполняется в браузере. Внутри работает сложный движок, который постоянно анализирует наш код и пытается сделать его быстрее.
Видео уже на канале Reactify!
Я не оставляю ссылку, так как видео лучше продвигается, если заходить на него напрямую с YouTube. Это помогает улучшить его рейтинг и увеличить шансы на органическое продвижение.
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 1 487 |
| 14 |  Айти уходит на дно 😭 | 1 888 |
| 15 |  视频消息 | 2 057 |
| 16 |  视频消息 | 1 925 |
| 17 |  👩💻 Эволюция Frontend Архитектуры: от Монолита до Microfrontends (Monorepo, Multirepo)
В этом видео разберём эволюцию больших frontend-систем:
Monolith → Modular Monolith → Monorepo → Multirepo → Microfrontends.
На примере роста большой платформы посмотрим:
— почему один frontend начинает не справляться с ростом команды;
— зачем переходят от монолитного приложения к модульной архитектуре;
— чем отличаются Monorepo и Multirepo;
— когда появляются отдельные приложения и бизнес-контуры;
зачем нужны Microfrontends;
— как независимые команды получают свои релизы, CI/CD и жизненный цикл.
Разберём:
— Frontend Architecture
— Microfrontend Architecture
— Monorepo vs Multirepo
— Modular Monolith
— Frontend Scaling
— Large Scale Frontend Applications
Видео будет полезно frontend-разработчикам, архитекторам и техническим лидерам, которые строят масштабируемые веб-приложения.
Видео уже на канале Reactify!
Я не оставляю ссылку, так как видео лучше продвигается, если заходить на него напрямую с YouTube. Это помогает улучшить его рейтинг и увеличить шансы на органическое продвижение.
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 2 283 |
| 18 |  视频消息 | 1 991 |
| 19 |  Скоро возвращение на YouTube 💪🏼
1. Разбор самого душного собеса: V8, Hidden classes, JIT, TS, Garbage Collector и другие необычные темы на собесе 🤯
2. Архитектура Frontend: Monorepo, Multirepo, Microfrontends, Monoliths
Схема эволюция на примере больших компаний
Видео в монтаже 💪
Так же много сценариев написал, буду контент машину запускать
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 2 038 |
| 20 |  +1👩💻 CI/CD для фронтендера часть 3
В прошлый раз мы остановились на моменте, когда Pull Request прошел ревью, получил аппрув и попал в ветку develop.
Теперь начинается самое интересное — что происходит после merge и как код оказывается в Kubernetes. Разберем путь от merge до деплоя.
Итак, разработчик сделал merge:
feature/YH-1422 → develop
С этого момента обычно запускается новый workflow.
Первый этап — сборка.
CI/CD система берет свежий код из ветки develop и выполняет примерно такие шаги:
— скачивает репозиторий;
— устанавливает зависимости;
— собирает приложение;
— запускает необходимые проверки;
— создает артефакты сборки.
Для фронтенда результатом обычно будет набор статических файлов:
dist/
├── index.html
├── assets/
├── javascript bundles
└── styles
Но часто в современных проектах дальше появляется Docker. Вместо того чтобы просто отправлять файлы на сервер, приложение упаковывается в Docker image.
Например:
код приложения
↓
npm install
↓
npm run build
↓
Docker image
↓
Container Registry
Docker image — это готовая версия приложения вместе с необходимым окружением.
Например:
frontend-app:1.25.0
Эта версия уже сохранена в Registry, откуда ее сможет забрать Kubernetes.
Следующий этап — Kubernetes.
Kubernetes сам по себе не знает, какую версию приложения нужно запускать.
Ему нужно описать желаемое состояние:
— какой image использовать;
— сколько запустить копий приложения;
— какие ресурсы выделить;
— какие настройки применить.
Обычно это описывается через Kubernetes manifests или Helm charts.
Например:
frontend:
image: frontend-app:1.25.0
replicas: 3
То есть мы говорим Kubernetes: "Мне нужно 3 экземпляра фронтенда версии 1.25.0"
И Kubernetes делает все необходимое:
— скачивает Docker image;
— создает контейнеры;
— запускает приложение;
— проверяет, что оно работает;
— заменяет старую версию новой.
В GitOps подходе мы обычно не отправляем команды напрямую в Kubernetes. Вместо этого есть отдельный репозиторий с описанием состояния инфраструктуры.
Например:
application-config
frontend:
image: frontend-app:1.25.0
Изменили версию в Git → система увидела изменение → обновила Kubernetes.
И здесь появляется ArgoCD. ArgoCD постоянно сравнивает: что написано в Git vs что реально запущено в Kubernetes. Если есть различия — он выполняет синхронизацию.
Например:
В Git: frontend-app:1.25.0
В Kubernetes: frontend-app:1.24.0
ArgoCD увидит расхождение и обновит приложение.
В итоге весь путь выглядит примерно так:
Merge в develop
↓
CI/CD workflow
↓
Build приложения
↓
Docker image
↓
Container Registry
↓
Обновление конфигурации в Git
↓
ArgoCD
↓
Kubernetes
↓
Новое приложение работает
И вот этот процесс обычно скрыт от фронтендера. Разработчик сделал merge — через несколько минут новая версия уже доступна на стенде.
Но за этим стоят несколько систем, которые работают вместе:
Git → CI/CD → Docker → Registry → GitOps → ArgoCD → Kubernetes
Первые 4 шага можно изучить в нашем репозитории: https://github.com/YeaHubTeam/yeahub-platform/blob/main/Dockerfile
В следующей части можно разобрать уже сам Kubernetes: что такое Pod, Deployment, Service, Ingress и как вообще фронтенд приложение живет внутри кластера 🙂
🚀 База собесов — 💪 Frontend Элита — 📚 Менторство — 📹 YouTube | 2 240 |
