ar
Feedback
WebDev+ | Веб-разработка

WebDev+ | Веб-разработка

الذهاب إلى القناة على Telegram

Присоединяйтесь к нашему каналу и погрузитесь в мир веб-разработки Связь: @devmangx

إظهار المزيد
8 330
المشتركون
لا توجد بيانات24 ساعات
-117 أيام
-8930 أيام

جاري تحميل البيانات...

جذب المشتركين
يونيو '26
يونيو '26
+4
في 2 قنوات
مايو '26
+43
في 0 قنوات
Get PRO
أبريل '26
+40
في 0 قنوات
Get PRO
مارس '26
+34
في 0 قنوات
Get PRO
فبراير '26
+26
في 3 قنوات
Get PRO
يناير '26
+42
في 3 قنوات
Get PRO
ديسمبر '25
+200
في 9 قنوات
Get PRO
نوفمبر '25
+504
في 316 قنوات
Get PRO
أكتوبر '25
+24
في 0 قنوات
Get PRO
سبتمبر '25
+49
في 1 قنوات
Get PRO
أغسطس '25
+63
في 0 قنوات
Get PRO
يوليو '25
+828
في 282 قنوات
Get PRO
يونيو '25
+323
في 1 قنوات
Get PRO
مايو '25
+205
في 0 قنوات
Get PRO
أبريل '25
+1 473
في 0 قنوات
Get PRO
مارس '25
+674
في 0 قنوات
Get PRO
فبراير '25
+470
في 0 قنوات
Get PRO
يناير '25
+69
في 0 قنوات
Get PRO
ديسمبر '24
+74
في 0 قنوات
Get PRO
نوفمبر '24
+14
في 0 قنوات
Get PRO
أكتوبر '24
+24
في 0 قنوات
Get PRO
سبتمبر '24
+18
في 0 قنوات
Get PRO
أغسطس '24
+43
في 0 قنوات
Get PRO
يوليو '24
+93
في 0 قنوات
Get PRO
يونيو '24
+58
في 0 قنوات
Get PRO
مايو '24
+84
في 0 قنوات
Get PRO
أبريل '24
+105
في 0 قنوات
Get PRO
مارس '24
+100
في 0 قنوات
Get PRO
فبراير '24
+121
في 0 قنوات
Get PRO
يناير '24
+159
في 0 قنوات
Get PRO
ديسمبر '23
+199
في 0 قنوات
Get PRO
نوفمبر '23
+351
في 0 قنوات
Get PRO
أكتوبر '23
+291
في 0 قنوات
Get PRO
سبتمبر '23
+583
في 0 قنوات
Get PRO
أغسطس '23
+1 008
في 0 قنوات
Get PRO
يوليو '23
+1 427
في 0 قنوات
Get PRO
يونيو '23
+912
في 0 قنوات
Get PRO
مايو '23
+404
في 0 قنوات
Get PRO
أبريل '23
+287
في 0 قنوات
Get PRO
مارس '23
+154
في 0 قنوات
Get PRO
فبراير '23
+68
في 0 قنوات
Get PRO
يناير '23
+57
في 0 قنوات
Get PRO
ديسمبر '22
+78
في 0 قنوات
Get PRO
نوفمبر '22
+292
في 0 قنوات
Get PRO
أكتوبر '22
+100
في 0 قنوات
Get PRO
سبتمبر '22
+116
في 0 قنوات
Get PRO
أغسطس '22
+86
في 0 قنوات
Get PRO
يوليو '22
+116
في 0 قنوات
Get PRO
يونيو '22
+127
في 0 قنوات
Get PRO
مايو '22
+129
في 0 قنوات
Get PRO
أبريل '22
+137
في 0 قنوات
Get PRO
مارس '22
+168
في 0 قنوات
Get PRO
فبراير '22
+164
في 0 قنوات
Get PRO
يناير '22
+270
في 0 قنوات
Get PRO
ديسمبر '21
+258
في 0 قنوات
Get PRO
نوفمبر '21
+508
في 0 قنوات
Get PRO
أكتوبر '21
+309
في 0 قنوات
Get PRO
سبتمبر '21
+309
في 0 قنوات
Get PRO
أغسطس '21
+80
في 0 قنوات
Get PRO
يوليو '21
+166
في 0 قنوات
Get PRO
يونيو '21
+459
في 0 قنوات
Get PRO
مايو '21
+515
في 0 قنوات
التاريخ
نمو المشتركين
الإشارات
القنوات
04 يونيو+1
03 يونيو+2
02 يونيو0
01 يونيو+1
منشورات القناة
Наткнулся на очень годный File Tree-компонент 🌳 Trees — open-source файловое дерево для приложений, которым нужен проводник уровня IDE. Из коробки есть: • поиск по файлам • drag-and-drop • выделение файлов и папок • Git-статусы • горячие клавиши • всё, что обычно ожидаешь от нормального файлового проводника Подходит для редакторов кода, девтулзов, файловых менеджеров и любых приложений, где нужно современное дерево файлов. Выглядит настолько отполированным, будто его вытащили из готовой IDE, а не из очередного npm-пакета. @WebDev_Plus

2
Мой набор JavaScript-библиотек, без которых уже сложно представить разработку: 🛡 zod → валидация схем и типобезопасная проверка данных 📅 date-fns → работа с датами без боли и лишнего веса 📊 tanstack-table → мощные и гибкие таблицы для React 🔐 better-auth → аутентификация пользователей без лишней возни 🎞 motion → анимации на JavaScript с современным API 🔤 fontsource → подключение веб-шрифтов прямо через npm 📈 chart.js → доступные и удобные HTML5-графики 🐻 zustand → простое глобальное управление состоянием 🖱 pragmatic-drag-and-drop → drag-and-drop от команды Atlassian ⌨️ hotkeys-js → горячие клавиши и клавиатурные шорткаты @WebDev_Plus
274
3
Кейс большой frontend-миграции от ВКонтакте. Команда перевела ключевые разделы vk.com на SPA. В итоге получили ускорение первой отрисовки страницы на 25% и ускорение среднего времени перехода между разделами в 3,5 раза. Переход был плавным: снаружи все привычно, внутри — новая платформа https://www.cnews.ru/news/line/2026-06-03_vkontakte_obnovila_veb-platformu @WebDev_Plus
292
4
Design Engineering Tip Попробуйте делать textarea, которая растёт вместе с контентом, вместо вложенного скролла внутри поля.
Design Engineering Tip Попробуйте делать textarea, которая растёт вместе с контентом, вместо вложенного скролла внутри поля. Так пользователю проще писать длинный текст, а форму легче просматривать целиком. CSS: textarea { field-sizing: content; } Маленькая деталь, но UX сразу становится приятнее. @WebDev_Plus
333
5
Определи форму данных. Убери проверки 👇 #TypeScript
Определи форму данных. Убери проверки 👇 #TypeScript
356
6
npm install новый месяц npm install возможности Цитата с верой @WebDev_Plus
npm install новый месяц npm install возможности Цитата с верой @WebDev_Plus
410
7
Открой X. Выполни этот JavaScript в консоли браузера: s = document.createElement("style"); s.innerHTML = "*{font-family:comic sans ms!important}"; document.head.append(s); Наслаждайся. @WebDev_Plus
438
8
Если хотите, чтобы Claude нормально делал вам слайды, не используйте Claude Design. Используйте Reveal.js. - https://github.c
Если хотите, чтобы Claude нормально делал вам слайды, не используйте Claude Design. Используйте Reveal.js. - https://github.com/hakimel/reveal.js Пусть Claude генерирует презентации как обычные HTML + Markdown-файлы. Это намного приятнее: → слайды лежат в коде → их легко редактировать → можно хранить в Git → можно версионировать → можно быстро менять структуру → можно деплоить как обычную веб-страницу Вместо того чтобы возиться с визуальным редактором, вы просто описываете, какую презентацию хотите получить, а Claude собирает её как фронтенд-проект. Для разработчиков это ощущается естественнее. Слайды становятся не «файлом презентации», а частью нормального рабочего процесса. @WebDev_Plus
426
9
#Laravel Tip Автоматическое удаление записей из коробки 🪄 Иногда нужно автоматически удалять устаревшие записи из базы данны
#Laravel Tip Автоматическое удаление записей из коробки 🪄 Иногда нужно автоматически удалять устаревшие записи из базы данных. Многие для этого пишут собственные Artisan-команды и настраивают cron-задачи. В Laravel для таких случаев уже есть готовое решение — трейт Prunable. Достаточно определить условие, какие записи считаются устаревшими: use Illuminate\Database\Eloquent\Prunable; class Flight extends Model { use Prunable; public function prunable(): Builder { return static::where('created_at', '<=', now()->subMonth()); } } После этого Laravel сможет автоматически находить и удалять подходящие записи через команду: php artisan model:prune Можно добавить её в планировщик задач и больше не думать об очистке старых данных. Меньше кастомного кода. Меньше поддержки. Больше встроенных возможностей Laravel. @WebDev_Plus
396
10
Блин... Этот визуальный инспектор для React просто шикарен 😍 React Trace от скромного разраба — это инспектор для разработки
Блин... Этот визуальный инспектор для React просто шикарен 😍 React Trace от скромного разраба — это инспектор для разработки, который помогает находить React-компоненты, определять их исходные файлы и быстро разбираться в структуре приложения. → визуально инспектировать React-компоненты → мгновенно переходить к исходному коду компонента → понимать иерархию компонентов → передавать контекст компонента в AI-инструменты для программирования, такие как OpenCode С ним отладка и навигация по крупным React-кодовым базам становятся намного проще :) Исходник 🔗: http://github.com/buzinas/react-trace @WebDev_Plus
411
11
⚡️Типобезопасная работа с формами множественного числа с помощью Intl.PluralRules и отображаемого типа (mapped type) @WebDev_
⚡️Типобезопасная работа с формами множественного числа с помощью Intl.PluralRules и отображаемого типа (mapped type) @WebDev_Plus
404
12
На Stepik вышла программа «Фундамент DevOps» Это комплексная программа из 4 практических курсов по ключевым технологиям совре
На Stepik вышла программа «Фундамент DevOps» Это комплексная программа из 4 практических курсов по ключевым технологиям современного DevOps: Linux, Git, Docker и Kubernetes. Вы последовательно пройдёте путь от работы в Linux и Git до контейнеризации приложений и управления ими в Kubernetes. Что вы изучите: • уверенную работу в Linux и терминале • Git и контроль версий в реальных проектах • Docker и контейнеризацию приложений • Kubernetes и оркестрацию контейнеров • основы сетей, безопасности и хранения данных • автоматизацию задач и диагностику инфраструктуры ... и многому другому Все знания закрепляются на практике с помощью заданий с автопроверкой. Материал подаётся понятным языком, шаг за шагом, с большим количеством примеров, схем и демонстраций. После прохождения вы получите сертификат, который можно добавить в резюме. Отдельно курсы стоят 16 600 ₽, но в составе программы доступны всего за 7 990 ₽: открыть на Stepik
311
13
Можно сделать sticky-navbar, который меняется при скролле, на чистом CSS — без JS и библиотек анимаций. header { container-ty
Можно сделать sticky-navbar, который меняется при скролле, на чистом CSS — без JS и библиотек анимаций. header { container-type: scroll-state; position: sticky; top: 0; } @container scroll-state(stuck: top) { .nav-bar { max-width: 56rem; border-radius: 0.75rem; background: rgb(255 255 255 / 0.92); } } Теперь браузер сам понимает, когда sticky-элемент «прилип» к верхней границе, и всё срабатывает через один container query. Пока доступно только в Chromium-браузерах — без Firefox и Safari, что, конечно, обидно. @WebDev_Plus
419
14
Подготовьте свой сайт к взаимодействию с ИИ-агентами с помощью Lighthouse → https://goo.gle/3ReK3JD Если вы хотите, чтобы ИИ-
Подготовьте свой сайт к взаимодействию с ИИ-агентами с помощью Lighthouse → https://goo.gle/3ReK3JD Если вы хотите, чтобы ИИ-агенты действительно корректно работали с вашим сайтом, новый экспериментальный аудит в Lighthouse позволяет проверить: - Обнаруживаемость сайта для ИИ-агентов - Интеграцию с WebMCP Доступность для ИИ-систем #GoogleIO @WebDev_Plus
439
15
Наконец-то это происходит npm планирует по умолчанию блокировать postinstall-скрипты в одном из будущих релизов. В ближайшее
Наконец-то это происходит npm планирует по умолчанию блокировать postinstall-скрипты в одном из будущих релизов. В ближайшее время (через поэтапный rollout) пользователи, скорее всего, начнут сначала получать предупреждения. Ссылка на implementation PR для первой фазы: https://github.com/npm/cli/pull/9360 Ссылка на RFC с описанием всех связанных изменений и трёхфазного плана rollout’а: https://github.com/npm/rfcs/pull/868 Сейчас смержена только Phase 1 для npm v11.16, А вот настоящее блокирование по умолчанию планируется уже в npm v12 (Phase 2), и PR для этого ещё только готовится. @WebDev_Plus
432
16
Сегодня узнал, что zsh умеет вызывать функцию для несуществующих команд. Поэтому если добавить это в .zshrc, можно буквально
Сегодня узнал, что zsh умеет вызывать функцию для несуществующих команд. Поэтому если добавить это в .zshrc, можно буквально писать prompt’ы прямо в терминал: command_not_found_handler() { codex "$*" return $? } Теперь любая неизвестная команда будет автоматически отправляться в Codex. Это не очень хорошая идея. @WebDev_Plus
452
17
Как frontend-разработчику вырасти в ЗП? День сурка frontend-разработчика выглядит так Зарплата замерла, задачи — бесконечный
Как frontend-разработчику вырасти в ЗП? День сурка frontend-разработчика выглядит так Зарплата замерла, задачи — бесконечный повтор, растет только кол-во бессмысленных созвонов Откликаешься на вакансии — отвечают только ноунеймы, на собесах закидывают странными алгоритмами «на скорость». И самое бесящее — пока буксуешь, кто-то вокруг спокойно забирает офферы в Яндекс и VK... Ты тоже можешь получить оффер в компанию, в которой тебя будут ценить и хорошо платить. 👋 Меня зовут Тихон, привет! Я — действующий Frontend-разработчик и ментор. Я за руку довожу до оффера на хорошую позицию в Big Tech и сопровождаю на испытательном сроке. В своем канале: 👉Объясняю, как проходить HR-фильтр и превращать отклики в реальные приглашения 👉Помогаю найти мотивацию, борюсь убеждениями, которые мешают развиваться 👉На примерах объясняю, как проходить собеседования, включая техничку 👉Разбираю резюме и делюсь лайфхаками, например как аккуратно “пинговать” рекрутеров А еще регулярно публикую полезные материалы: ▪️Задачи, на которых валяться кандидаты ▪️База по микрофронтам ▪️Подборка из 100+ каналов с вакансиями для разработчиков ▪️100 вопросов, которые точно помогут тебе на собеседовании ▪️Чек лист проверки своего резюме А еще у меня множество успешных кейсов и трогательных отзывов, найти их можно в канале. Реклама, erid: 2W5zFGrysSZ ИП Галактионов Тихон Витальевич, ИНН 771618975809
422
18
#Laravel Tip А вы знали, что Laravel понимает ваши связи между моделями и позволяет писать код намного чище 👇 @WebDev_Plus
#Laravel Tip А вы знали, что Laravel понимает ваши связи между моделями и позволяет писать код намного чище 👇 @WebDev_Plus
429
19
Кто-то выложил в open source библиотеку со всеми тех-логотипами, которые вам когда-либо могли понадобиться — в виде чистых, о
Кто-то выложил в open source библиотеку со всеми тех-логотипами, которые вам когда-либо могли понадобиться — в виде чистых, оптимизированных SVG. Называется developer-icons. Вот что в ней есть: → 200+ логотипов технологий (React, HTML, JS, Docker и другие) в виде полноценных компонентов → гибкая настройка размера, цвета и толщины stroke для каждой иконки → масштабирование под любое разрешение без потери качества → встроенные light/dark и wordmark-варианты → поддержка tree-shaking — в bundle попадут только импортированные иконки Больше не нужно копаться в Figma-экспортах или вставлять случайные SVG, найденные на Stack Overflow. npm i developer-icons — импортируете иконку, вставляете в JSX, и готово. Полностью open source. Лицензия MIT. 2.1k звёзд. @WebDev_Plus
485
20
Если хотите изучить Python, SQL или Machine Learning, у Kaggle есть бесплатные курсы с сертификатами. Самое приятное — они ср
Если хотите изучить Python, SQL или Machine Learning, у Kaggle есть бесплатные курсы с сертификатами. Самое приятное — они сразу переходят к сути и подходят для обучения с нуля. Материал объясняется без предположения, что у вас уже есть какой-то опыт. Отличный вариант для старта. Каждый курс занимает всего несколько часов. Благодаря этому можно быстро освоить новую тему без серьёзных временных затрат. Найти их можно на сайте Kaggle в разделе Learn. Ссылку не оставляю — вы и сами знаете, как работают алгоритмы этой соцсети. https://www.kaggle.com/ @WebDev_Plus
475