React JS

Anthropic вместе с Frontend Masters выкатили бесплатный курс по Claude Code. И это не поверхностный обзор, а нормальный разбор инструмента для тех, кто хочет реально прокачать вайбкодинг и работу с AI-агентами. Курс ведёт Lydia Hallie из Anthropic. Внутри: • основы Claude Code • skills • hooks • sub-agents • MCP • плагины • Agent SDK • продвинутые сценарии работы Хороший вход для тех, кто хочет не просто “просить ИИ написать код”, а собирать нормальный рабочий процесс вокруг Claude Code. Ссылка: http://frontendmasters.com/courses/claude-code

Open-source мониторинг без SaaS-привязки CheckCle выглядит как интересная self-hosted альтернатива для мониторинга инфраструктуры, сервисов и приложений. Проект даёт uptime-мониторинг, проверки HTTP, DNS, Ping и TCP-сервисов, распределённые региональные проверки, историю инцидентов, SSL и domain monitoring, public status pages, отчёты и алерты в Telegram, Slack, Discord, Matrix и email. Главный плюс в том, что всё можно поднять у себя через Docker. Не нужен внешний SaaS, не нужно отдавать данные третьей стороне, не нужно платить за каждый монитор или сидеть в чужой панели. По стеку тоже интересно: основа на Go, фронт на TypeScript, лицензия MIT. На GitHub у проекта уже около 2.7k звёзд, так что это не просто заброшенная утилита на вечер. Подойдёт тем, кто хочет свой мини-UptimeRobot/Better Stack для VPS, pet-проектов, внутренних сервисов или небольшой команды. Репозиторий: https://github.com/operacle/checkcle

xyflow предоставляет библиотеки для создания интерфейсов на основе узлов для React и Svelte, которые готовы к использованию сразу из коробки и бесконечно настраиваемы. - Пакеты @xyflow/react и @xyflow/svelte для создания редакторов узлов - Включает встроенные компоненты MiniMap, Controls и Background - Лицензирован по MIT с опциями коммерческой поддержки через React Flow Pro или GitHub Sponsors - https://github.com/xyflow/xyflow

Slice vs. Splice в JavaScript

Credit Card Payment Form Форма оплаты кредитной картой. Реализована с помощью CSS и JavaScript. https://codepen.io/quinlo/pen/YONMEa

🔴 Эфир начнётся уже через 2 часа. Переходи в бот за ссылкой: @shortcut_front_bot

Совет по javascript 💡 Более короткий способ проверки нескольких условий OR в javascript 🤩

🔍Тестовое собеседование с руководителем Frontend-разработки в этот четверг 18 июня(в четверг!) в 19:00 по мск приходи онлайн на открытое собеседование, чтобы посмотреть на настоящее интервью на Middle Frontend-разработчика. Как это будет: 📂 Виталий Черков, руководитель группы Frontend разработки с опытом 8+ лет, будет задавать реальные вопросы и задачи разработчику-добровольцу 📂 Виталий будет комментировать каждый ответ респондента, чтобы дать понять, чего от вас ожидает собеседующий на интервью 📂 В конце можно будет задать любой вопрос Виталию Это бесплатно. Эфир проходит в рамках менторской программы от ШОРТКАТ для Frontend-разработчиков, которые хотят повысить свой грейд, ЗП и прокачать скиллы. Переходи в нашего бота, чтобы получить ссылку на эфир → @shortcut_front_bot Реклама. О рекламодателе.

Визуальное разделение группы связанных параметров с помощью <hr> внутри <select> Demo https://www.codewithshripal.com/playground/html/visually-breakup-options-in-select

JavaScript. Напишите функцию order, которая принимает строку и возвращает её вариант, очищенный от цифр, вшитых в каждое слово, и отсортированный на основе этих цифр. Ответ

🖥 Сервисы крутятся. Прод вроде живой. Но когда тимлид спрашивает: «почему здесь лучше ValueTask, а не Task?» или «как GC поведёт себя под нагрузкой?» - ты начинаешь плыть. И дело не в том, что ты плохо пишешь код. Просто большинство курсов заканчиваются ровно там, где начинается настоящий .NET. Этот курс про то, что обычно остаётся под капотом: - CLR - JIT - GC - Span - async state machine - Source Generators - lock-free подходы - OpenTelemetry - дампы в проде На практике разбираем, как .NET реально работает внутри: что происходит с кодом после компиляции, как память живёт под нагрузкой, почему async иногда помогает, а иногда ломает производительность, как читать проблемы по дампам и метрикам, а не гадать по логам. Если хочешь дойти до уровня, где система для тебя не чёрный ящик, а инструмент, который ты понимаешь до IL, - велкам. Сейчас на stepik доступна скидка 55%: https://stepik.org/a/288694

⚡️ Linux Roadmap: подробный практический курс от нуля до уверенного администратора Это пошаговый маршрут изучения Linux с упором на практику. Каждый раздел содержит объяснение «почему это устроено именно так», разбор команд и обязательные задания, которые нужно выполнить руками в терминале. Чтение без повторения навыка не даёт — держите терминал открытым рядом с этим текстом. Как работать с этим курсом: идите сверху вниз, не перепрыгивайте разделы; каждую команду набирайте руками, а не копируйте; в конце каждого блока выполняйте задание; специально ломайте систему в виртуалке и чините — это лучший способ учиться. https://github.com/justxor/linuxfullroadmap/

Gentle button 'explode' Визуальные эффекты при наведении мыши на кнопку. Использованы SCSS и JS. https://codepen.io/cassie-codes/pen/zYdxopE

Совет по CSS 💡 Возможно, вы не знаете, что мы можем использовать псевдоэлемент ::marker, чтобы изменить стиль маркера/номера списка. 🤩 Demo https://www.codewithshripal.com/playground/css/style-list-marker

🖼️✨ Упрощение создания динамических обоев Dynamic Wallpaper Project Toolkit — это мощный инструмент для организации и управления проектами динамических обоев. Он предлагает стандартизированную структуру, шаблоны и утилиты для упрощения разработки и повышения эффективности. 🚀 Основные моменты: - Стандартизированная структура проекта для упрощения навигации. - Шаблоны для различных типов динамических обоев. - Утилиты для управления активами и их синхронизации. - Скрипты для автоматизации рутинных задач. - Подробная документация и поддержка сообщества. 📌 GitHub: https://github.com/alfiyahkamilah1239298/WallpaperDownloader-26

Коллекция текстильных паттернов Все паттерны созданы при помощи CSS-градиентов, без каких-либо изображений. И они очень маленькие! https://codepen.io/thebabydino/pen/OJmpzya

✔️ Black Forest Labs запустила MCP-сервер Сервер доступен по адресу mcp.bfl.ai и позволяет создавать и редактировать изображения в чат-клиентах, поддерживающих этот протокол. Заявлена совместимость с Claude, Cursor, Codex, Windsurf и другими MCP-клиентами. MCP-сервер предоставляет несколько инструментов: генерацию до 8 изображений параллельно, создание вариаций на основе предыдущего результата, просмотр истории запросов и проверку остатка средств на счёте. Нужную модель клиент выбирает автоматически в зависимости от запроса. Доступно несколько моделей линейки FLUX.2: от быстрой Klein до топовой Мax. По умолчанию используется Flux2 Pro. Оплата, согласно документации, производится напрямую BFL: счёт выставляется той организации, которая была выбрана при авторизации. Актуальные тарифы - на странице bfl.ai/pricing. @ai_machinelearning_big_data #news #ai #ml

Button with rotating gradient border Кнопка с вращающейся градиентной рамкой – это эффектный веб-элемент, который был разработан и анимирован с использованием языков HTML и CSS. Этот элемент привносит интересное визуальное восприятие на веб-страницу и обращает на себя внимание пользователей благодаря своей креативной анимации. 🌐Ссылка на код

Ring Prepulsion Создано на canvas и JS. https://codepen.io/shubniggurath/pen/qeXRrW

🚀 Мощный панель управления для игровых серверов MCSManager — это современная веб-панель для управления серверами Minecraft, Steam и другими играми. Она позволяет легко управлять несколькими серверами с одного интерфейса, предлагая надежную систему разрешений для пользователей и поддержку многоязычности. 🚀 Основные моменты: - Быстрая установка игровых серверов с помощью встроенного магазина приложений. - Поддержка множества игр, включая Terraria и Project Zomboid. - Настраиваемый интерфейс с возможностью перетаскивания элементов. - Поддержка Docker и коммерческого хостинга. - Легковесная архитектура на TypeScript. 📌 GitHub: https://github.com/MCSManager/MCSManager