#Frontend

💻 CSS наконец-то становится языком программирования!

В Chrome 137 появилась долгожданная функция if() в CSS — теперь можно писать условную логику прямо в стилях!


Как это работает:

div {
  color: var(--color);
  background-color: if(
    style(--color: white): black;
    else: pink
  );
}

.dark { --color: black; }
.light { --color: white; }

Что это даёт:

• Условные стили без JavaScript
• Адаптивный дизайн на новом уровне
• Динамические темы через CSS-переменные
• Работа с HTML-атрибутами для стилизации

🔖Пример с атрибутами:

.card {
  border-color: if(
    style(--status: error): red;
    style(--status: success): green;
    else: gray
  );
}

<div class="card" style="--status: error">Ошибка</div>
<div class="card" style="--status: success">Успех</div>

💡 Пока что:

- Только Chrome 137+
- Другие браузеры в разработке
- Можно тестировать в Chrome Canary с флагом


📎 Статья

🎙 Новости

📝 База вопросов

#Api

🔖Hoppscotch — веб-клиент для тестирования API

Что это? Open-source альтернатива Postman, которая работает прямо в браузере.

🔹 Сверхбыстрый — в 15-20 раз легче Postman/Insomnia
🔹 Без установки — работает на hoppscotch.io
🔹 Минималистичный — чистый интерфейс без лишнего
🔹 Командная работа — real-time коллаборация
🔹 Self-hosting — можно развернуть у себя


Что умеет:

- REST, GraphQL, WebSocket
- Все виды аутентификации
- Переменные окружения
- Коллекции запросов
- Встраивание в сайты
- Тесты и скрипты

✔️ Никакой регистрации
✔️Поддержка 30+ языков
✔️500k+ запросов в неделю

📎 Ссылка

🎙 Новости

📝 База вопросов

#WebDev

🔥4 надежных веб-сайта на страже времени разработчика

Разработка проектов может занимать много времени, но правильные инструменты помогают значительно оптимизировать рабочий процесс.

1️⃣Hidden Tools
Многофункциональный набор инструментов для разработчиков

Веб-сайт с полезными инструментами для ускорения и оптимизации процесса создания. Предоставляет широкий спектр утилит, которые помогают автоматизировать рутинные задачи и повысить продуктивность.


2️⃣Can I Use
Проверка совместимости с браузерами

Незаменимый сайт для выявления совместимости функциональностей с различными браузерами. Позволяет быстро узнать, поддерживается ли конкретная CSS-функция, JavaScript API или HTML-элемент в разных версиях браузеров.


3️⃣Dev Hints
Шпаргалки и справочники

Веб-сайт со шпаргалками по различным концепциям, функциям и коду. Содержит краткие и понятные справочники по популярным технологиям, что позволяет быстро найти нужную информацию без долгого поиска в документации.


4️⃣Bundle Phobia
Анализ размера npm-пакетов

Специализированный веб-сайт для выбора более легких и производительных пакетов npm. Показывает реальный размер пакетов, время загрузки и влияние на производительность приложения, помогая принимать обоснованные решения при выборе зависимостей.


🎙 Новости

📝 База вопросов

#Backend

📂 DrawDB — это онлайн-редактор диаграмм баз данных и генератор SQL-скриптов, который работает бесплатно

✨ Что умеет:

- Создание ER-диаграмм в браузере
- Автогенерация SQL из диаграмм
- Экспорт в различные форматы
- Настраиваемый интерфейс

📎 Ссылка

🎙 Новости

📝 База вопросов

#VScode

SonarLint для VS Code: Надежный помощник для чистого кода


🔍Что это?

Бесплатное расширение для VS Code, которое ищет баги и уязвимости прямо во время написания. Работает с JavaScript, TypeScript, Python, Java, C++ и другими языками.


✨ Зачем нужно?

- Находит ошибки в реальном времени (например, утечки памяти, SQL-инъекции).
- Подсказывает лучшие практики (стиль, производительность, безопасность).
- Интегрируется с SonarQube/SonarCloud для синхронизации правил.


📎 Ссылка

🎙 Новости

📝 База вопросов

#Frontend

🔖Мета-фреймворки JavaScript: что это и зачем нужны

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


▪️Что такое мета-фреймворки

Это "фреймворки поверх фреймворков". Если React/Vue дают кирпичики для UI, то мета-фреймворки строят из них готовый дом со всеми коммуникациями: маршрутизацией, SSR, оптимизацией, API и прочим.


▪️Почему они появились

Раньше фронтенд-разработчики тратили больше времени на настройку инструментов, чем на само приложение. Нужна маршрутизация? Добавляй React Router. SSR? Настраивай отдельно. Состояние? Еще один инструмент.

Мета-фреймворки решили эту "усталость от инструментов", предложив готовые решения с разумными настройками по умолчанию.


▪️Основные игроки

• Next.js - для React, пионер гибридных приложений
• Nuxt.js - аналог для Vue
• Remix - фокус на web-first подходе
• SvelteKit - для любителей компилируемого Svelte
• RedwoodJS - полностековое решение с GraphQL


▪️Главные преимущества

- Быстрый старт проекта за минуты
- Единая структура кода в команде
- Автоматическая оптимизация производительности
- Меньше времени на конфигурацию, больше на разработку


▪️Потенциальные проблемы

- Ограниченная гибкость из-за жестких соглашений
- Сложность обновлений зависимостей
- Может быть избыточно для простых проектов
- Высокий порог входа для новичков

Мета-фреймворки - это эволюция веб-разработки в сторону большей продуктивности и меньшего количества головной боли. Они позволяют сосредоточиться на создании ценности для пользователей, а не на борьбе с инструментами.

🎙 Новости

📝 База вопросов

#Backend

💌 BFF - Backend For Frontend: персональный бэкенд для каждого клиента

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

©️Что такое BFF

Backend For Frontend - это отдельный бэкенд для каждого типа клиента. Мобилке нужны сжатые данные? Есть мобильный BFF. Веб-приложению требуется детальная информация? Отдельный веб-BFF. Каждый получает ровно то, что нужно.


©️Как работает

• Клиент отправляет запрос в свой BFF
• BFF собирает данные из микросервисов
• Преобразует их в нужный формат
• Возвращает оптимизированный ответ


©️Традиционный подход vs BFF

Раньше: один API-шлюз для всех клиентов. Результат - over-fetching (слишком много данных) или under-fetching (слишком мало, нужны дополнительные запросы).

С BFF: каждый клиент получает персонализированный API, заточенный под его потребности.


©️Главные преимущества

• Оптимизация под клиента - мобилка получает легкие данные, десктоп - полные
• Лучшая производительность - меньше лишних запросов и данных
• Независимая разработка - команды не мешают друг другу
• Упрощение клиентской логики - вся оркестрация на стороне BFF
• Безопасность - контроль доступа на уровне BFF


©️Когда использовать

- Мультиплатформенные приложения (веб + мобайл + IoT)
- Микросервисная архитектура с множеством сервисов
- Миграция с legacy-систем
- Разные требования к производительности у клиентов


©️Подводные камни

- Больше сервисов = больше сложности в поддержке
- Риск дублирования логики между BFF
- Потенциальные узкие места производительности
- Проблемы с консистентностью данных


©️Успешные примеры

Netflix - разные BFF для мобильных и десктопных клиентов. Мобилка получает упрощенные данные, десктоп - детальную информацию.

Spotify - оптимизированные данные для телефонов, планшетов и умных колонок обеспечивают быстрое воспроизведение.

Лучшие практики

• Минимум бизнес-логики в BFF - только оркестрация
• Активное кеширование для мобильных клиентов
• Централизованная обработка ошибок
• Строгая безопасность на уровне BFF

BFF - это не просто модная архитектура, а решение реальной проблемы. Когда у вас несколько типов клиентов с разными потребностями, BFF обеспечивает каждому персональный сервис вместо универсального "одного размера для всех".

🎙 Новости

📝 База вопросов

#Backend

💬 Как сэкономить 100 часов в месяц ?

Устали бороться с дублями в данных? Тратите часы на группировку по датам? Мучаетесь с обновлением таблиц в ETL?

Опытный дата-инженер за 8 лет работы собрал 6 малоизвестных техник SQL, которые решают эти проблемы одним запросом.

1️⃣Находить и удалять дубли
2️⃣Получать свежие данные
3️⃣Группировать по периодам
4️⃣Создавать кастомные категории
5️⃣Сравнивать данные между датами
6️⃣Обновлять таблицы без боли


📎 Статья

🎙 Новости

📝 База вопросов

#Frontend

🔖Pull-to-refresh в Compose Material 3: что изменилось и как использовать

Google кардинально обновил API для реализации pull-to-refresh в Compose Material 3 версии 1.2.0+, и большинство туториалов в интернете теперь устарели.


▪Что такое pull-to-refresh?

Это популярный жест в мобильных приложениях — пользователь тянет экран вниз, чтобы обновить данные. Вы наверняка видели это в Instagram, Twitter или Facebook.


▪Новый подход

Вместо старого PullToRefreshContainer теперь используется PullToRefreshBox — готовый контейнер, который оборачивает ваш прокручиваемый контент (например, LazyColumn).


▪Ключевые параметры:

• isRefreshing — показывает состояние загрузки
• onRefresh — функция, которая вызывается при жесте пользователя
• content — ваш прокручиваемый контент


▪Что нужно сделать в коде:

1. Добавить свойство isRefreshing в состояние экрана
2. Создать функцию обновления данных во ViewModel
3. Обернуть LazyColumn в PullToRefreshBox


▪Дополнительные возможности:

Если нужен больший контроль (например, включение/выключение жеста), можно использовать модификатор .pullToRefresh напрямую. Также можно кастомизировать анимацию индикатора через PullToRefreshState.


❗️Важно

Старые API помечены как deprecated в версии 1.3.0, поэтому обновление критически важно для поддержания актуальности приложения.
Новый API проще в использовании и предоставляет больше возможностей для кастомизации, делая реализацию pull-to-refresh более интуитивной для разработчиков.

🎙 Новости

📝 База вопросов

#Frontend

📎 Как использовать дизайн-токены в React — опыт команды Bit

Дизайн-токены — это стандартизированные значения (цвета, шрифты, отступы), которые помогают создавать единый интерфейс. Они синхронизируют работу дизайнеров и разработчиков, обеспечивая визуальную согласованность.

Интеграция в Bit и React
В Bit дизайн-токены структурированы по типам (цвета, состояния и др.) и работают как часть системы компонентов. Они самодокументируются и легко адаптируются под разные платформы, что ускоряет разработку.

Кросс-платформенные преимущества
Токены позволяют создавать универсальные решения для всех платформ. Разработчики быстро вносят изменения, а дизайнеры контролируют их корректное применение.

Управление в Bit
Токены отделены от тем и передаются компонентам через провайдер. Это позволяет глобально обновлять стили, меняя всего одно значение.

Дизайн-токены в Bit — это мощный инструмент для масштабируемых и согласованных дизайн-систем. Больше можно прочитать в статье ⬇️


📎 Статья

🎙 Новости

📝 База вопросов

#BigData

📝 Как обрабатывать большие данные в Pandas, если они не помещаются в память

Представьте: у вас есть файл с 260 миллионами транзакций, но на компьютере всего 8 ГБ оперативной памяти. Если попробовать загрузить всё сразу — Python просто «упадёт». Что делать?


🔹Решение: обрабатываем данные по частям

Вместо того чтобы грузить весь файл разом, будем читать его порциями, например по 1 млн строк за раз. В Pandas это делается так:

import pandas as pd

# Загружаем данные по кускам
chunk_size = 1_000_000  # По 1 млн строк за раз
total_transactions = 0

for chunk in pd.read_csv('transactions.csv', chunksize=chunk_size):
    # Обрабатываем каждую порцию данных
    total_transactions += len(chunk)

print(f"Всего транзакций: {total_transactions:,}")
  

🔹Какие задачи можно решать?

1. Сколько всего транзакций? → Считаем строки в каждом куске и суммируем.

2. Сколько потратили за каждый год? → В каждом куске группируем по году и суммируем, потом складываем результаты.

3. Средние траты на развлечения по месяцам? → Фильтруем данные за 2020 год, оставляем только категорию «Развлечения», группируем по месяцам и считаем среднее.


🔹Почему это работает?

- Не нагружает оперативную память — обрабатывается только небольшая часть данных за раз.

- Можно делать сложные расчёты — главное аккуратно собирать промежуточные результаты.


🔹Как ускорить?

- Использовать `dtypes` — указать типы данных для экономии памяти.

- Фильтровать данные сразу при чтении — если нужен только 2020 год, не загружайте остальное.

- Параллельная обработка — если компьютер многопроцессорный.


🎙 Новости

📝 База вопросов

#DevOps

🔖Почему ваш Docker-образ не готов к продакшену

Многие разработчики пишешь Dockerfile по принципу "лишь бы работало". Образ собирается, контейнер запускается, приложение отвечает — всё отлично! Но проходит время, и начинаются проблемы: в CI/CD сборка падает, на другом сервере приложение ведёт себя странно, а размер образа превышает несколько гигабайт.


Основные проблемы, которые убивают стабильность:

▪️Нестабильные зависимости — когда вы указываете FROM python:latest или FROM node:latest, вы полагаетесь на удачу. Сегодня latest указывает на одну версию, завтра — на другую. В результате код, который работал вчера, сегодня может не собираться из-за изменений в базовом образе или несовместимости библиотек.

▪️Раздутый размер образа — использование "толстых" базовых образов типа ubuntu:latest или python:3.12 без суффикса приводит к образам весом в гигабайты. Это замедляет развёртывание, увеличивает потребление дискового пространства и создаёт больше точек уязвимости. Альтернативы вроде python:3.12-slim содержат только необходимые компоненты и весят в разы меньше.

▪️Неэффективное кеширование — неправильная структура слоёв убивает эффективность кеширования Docker. Если сначала копировать весь код, а потом устанавливать зависимости, то при любом изменении в коде придётся заново устанавливать все библиотеки. Правильный порядок: сначала файлы зависимостей, их установка, и только потом копирование кода приложения.

▪️Проблемы безопасности — запуск приложения от пользователя root создаёт ненужные риски. Если злоумышленник получит доступ к контейнеру, он автоматически получит максимальные привилегии. Создание отдельного пользователя — простая мера, которая значительно снижает потенциальный ущерб.

▪️Мусор в образе — отсутствие файла .dockerignore приводит к попаданию в образ ненужных файлов: .git директории, кеша IDE, логов, переменных окружения. Это увеличивает размер образа и может случайно включить конфиденциальную информацию.


Готовый к продакшену Docker-образ должен быть предсказуемым, компактным и безопасным. Он собирается одинаково в любой среде, не зависит от внешних изменений и минимизирует поверхность атак. Потратив время на правильную настройку сборки один раз, вы избежите множества проблем в будущем и сэкономите время всей команде.


🎙 Новости

📝 База вопросов

#Tech

🔖Эволюция за $1000: как менялись игровые ПК за 30 лет

Помните то чувство, когда копили на "компьютер мечты", а накопив — обнаруживали, что за те же деньги можно взять что-то в разы мощнее? В мире железа нет идеального момента для покупки.

Но что, если взглянуть на эту гонку под другим углом? Представьте: у вас есть $1000 в каждой эпохе. Что можно было собрать в 1995-м, когда DOS правил миром? Какой монстр получился бы в 2005-м с первыми двухъядерными процессорами? И насколько далеко мы ушли в 2025-м с ИИ-апскейлингом?

Отправляемся в путешествие от мегагерцовых Pentium с 8 МБ оперативки до современных чудовищ с трассировкой лучей. Узнаем, как одна и та же сумма превращалась в игровую мощь в разные десятилетия.


📎 Статья

🎙 Новости

📝 База вопросов

#AI

✨ 7 лучших нейросетей для создания видео в 2025

Устали от бесконечных туториалов по видеомонтажу? Теперь можно просто описать идею — и получить готовый ролик


📎 ТОП-7 AI-сервисов:

1. BotHub (Veo 2)
• Модель от Google
• Понимает русский язык
• 5-8 секунд видео
• 600₽/месяц за премиум

2. Sora в Bing (бесплатно!)
• 10 роликов на старт
• +5 баллов за каждый поиск в Bing
• Только вертикальный формат

3. Hailuo
• Китайская разработка MiniMax
• 1100 кредитов при регистрации
• $9.99/месяц без вотермарки

4. Kling
• 366 кредитов в месяц бесплатно
• Негативные промпты
• Генерация до суток (минус!)

5. Pika
• 80 кредитов ежемесячно
• 5-10 секунд анимации
• $28/месяц за Pro

6. Genmo
• 200 единиц энергии в месяц
• Модели Mochi и Replay
• $10/месяц за Lite

7. Runway
• Бесплатно только по фото
• Gen-4 и Gen-3 модели
• $15/месяц за полный доступ


💭 Вывод

Технологии впечатляют, но пока что видео получаются без души. Настоящее творчество всё ещё за человеком — мы создаём идеи, контекст и эмоции.

А вы уже пробовали генерировать видео с ИИ? Поделитесь опытом! ⬇️


🎙 Новости

📝 База вопросов

#Linux

Почему SSH-ключи безопаснее паролей в Linux?

Пароли уязвимы к взлому: их можно подобрать, украсть или перехватить. SSH-ключи решают эти проблемы за счёт криптографии.

Почему ключи лучше?
🔸Стойкость – ключи (2048+ бит) невозможно подобрать, в отличие от паролей.
🔸Без передачи секрета – приватный ключ остаётся у вас, сервер проверяет только подпись.
🔸Защита от утечек – даже если сервер взломают, ключ не украдут.
🔸Удобство – не нужно запоминать сложные пароли, доступ автоматизируется.


✳️Как перейти на SSH-ключи?

1. Генерация ключа:

ssh-keygen -t ed25519  

2. Копирование на сервер:

ssh-copy-id user@server  

3. Отключение паролей в /etc/ssh/sshd_config:

PasswordAuthentication no  

✔️ Статистика
• 81% взломов – из-за слабых паролей.
• Атаки на SSH начинаются уже через 10 минут после поднятия сервера.


💡Совет
Храните приватные ключи в менеджерах паролей (например, Selectel Secrets) и защищайте их парольной фразой.

Откажитесь от паролей – используйте ключи!


🎙 Новости

📝 База вопросов

📝 Подсказка для собеседований: ИИ и МО

Что такое ИИ?

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


Ключевые понятия:

🔹Машинное обучение — алгоритмы для обучения на данных без явного программирования

🔹Глубокое обучение — нейронные сети с несколькими слоями

🔹NLP — обработка естественного языка

🔹Computer Vision — интерпретация визуальной информации


Применение ИИ:

🔸Здравоохранение — анализ медизображений, диагностика

🔸Финансы — прогнозы рынка, выявление мошенничества

🔸Автономные ТС — беспилотники

🔸Обслуживание клиентов — чат-боты 24/7

🔸Развлечения — игры, рекомендательные системы


Типы МО:

▫️Контролируемое — обучение на помеченных данных (есть правильные ответы)

▫️Неконтролируемое — поиск закономерностей в непомеченных данных

▫️С подкреплением — обучение через вознаграждения в среде


Популярные алгоритмы:

▪️Линейная/логистическая регрессия

▪️Деревья решений, случайный лес

▪️SVM (машины опорных векторов)

▪️Нейронные сети


📎 Статья

🎙 Новости

📝 База вопросов

📎 RPG за гранью разума: когда жанр ломает собственные правила

Жанр RPG давно перестал ограничиваться эльфами, драконами и спасением мира. Некоторые разработчики создают игры, которые ломают все шаблоны — от сюрреалистичных историй до механик, которые заставляют пересмотреть само понятие ролевой игры. Эти проекты могут показаться безумными, но именно они толкают индустрию вперед и открывают новые горизонты для интерактивного повествования.


📎 Статья

🎙 Новости

📝 База вопросов

🥇 Новый Guru Android в YeaHub!

Мы рады представить нового эксперта в нашей команде! К YeaHub присоединился опытный Android-разработчик и ментор, который вместе с учениками будет разрабатывать Open Source-версию мобильного приложения YeaHub. Код открыт в нашем репозитории.

В качестве Guru (эксперта) он:
- Будет улучшать контент по Android-разработке
- Добавлять новые вопросы и коллекции
- Публиковать авторские посты и гайды на канале

✈️ Блог Антона 📹 YouTube Канал

И это только начало! В планах привлечь Guru (Экспертов) по каждому направлению!

Спасибо, что остаетесь с нами — мы продолжаем прокачивать продукт 💪
Пробуйте, тестируйте, делитесь обратной связью!

👍 Обучайтесь, общайтесь, растите вместе с https://yeahub.ru

#IT

📎 Мечта каждого разработчика — создать продукт, который будет приносить стабильный доход. Но почему большинство побочных проектов так и остаются в папке "pet projects" и никогда не монетизируются?

Опытный инди-разработчик с 25-летним стажем делится болезненными, но честными инсайтами о том, что на самом деле нужно для успешной монетизации. Спойлер: дело не в коде.

В статье вы узнаете:

- Почему отличная идея и качественный код — это еще не бизнес
- Как правильно исследовать рынок перед написанием первой строки кода
- Платформы vs SaaS: что выбрать инди-разработчику
- Конкретные маркетинговые каналы, которые реально работают
- Секрет выбора прибыльной ниши

Особенно ценно: автор рассказывает о своих провалах и объясняет, когда нужно "убить" проект без сожалений.

Если вы разработчик, который хоть раз думал о создании собственного продукта — эта статья обязательна к прочтению.


📎 Статья

🎙 Новости

📝 База вопросов