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

Один из самых мощных бесплатных курсов по веб-разработке

FullStackOpen внутри всё, что нужно для современного девелопера: React, Node.js, базы данных, API и реальные проекты, а не просто теория.

Формат максимально практичный: пишешь код, собираешь приложения и постепенно выходишь на уровень уверенного разработчика. Отличный вариант, если хочешь прокачать fullstack без вложений. 📖

Ультимативный онлайн-справочник по командам и операциям Docker

Инструмент быстрого доступа который превращает работу с Docker в простой и предсказуемый процесс. Команды и операции аккуратно сгруппированы по темам, чтобы нужное решение находилось за считанные секунды

Идея сервиса минимализм и польза: ничего лишнего, только команды, которые реально применяются в ежедневной работе с контейнерами 👌

Laravel 13 Tip: Cache::flexible()

Хотите быстрые страницы без постоянной выдачи устаревших данных?

Метод Cache::flexible() в Laravel сразу возвращает данные из cache, одновременно незаметно обновляя их в background:

В CSS появится свойство size – шорткат для задания width и height

✓ size: 100px → одинаковые width и height
✓ size: 200px 80px → ширина и высота
✓ Поддерживает те же единицы измерения, что и width и height

Предложение больше 10 лет оставалось без движения, и наконец его приняли.

Safari уже реализовал поддержку size за экспериментальным флагом

Полный курс по веб-разработке от Google: «Webdev Learn»

Наткнулся на мощный ресурс команды Chrome - всё про HTML, CSS, JS, UX, скорость и доступность. Отличный старт и для джунов, и для тех, кто хочет освежить знания.

Бесплатная онлайн-книга «Красноречивый JavaScript»

Книга для формирования прочной базы знаний по программированию на JavaScript. Она охватывает весь путь от базовых конструкций языка до более сложных тем, таких как замыкания, асинхронность и взаимодействие с браузером 📚

Вот полезный совет по TypeScript:

Используйте шаблонные строковые литералы, чтобы убедиться, что ваши заголовки Authorization правильно отформатированы

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

В сети появилось пространство, где новичков учат программировать не через термины, а через метафоры

CodeAnalogies превращает абстрактные концепции веб-разработки в понятные жизненные ситуации, благодаря чему обучение становится не только проще, но и заметно увлекательнее 📖

Вероятно, есть веские причины, почему такое поведение не используется по умолчанию.

Однако в этом конкретном use case, на мой взгляд, type/tab hints стоят небольшого снижения производительности, если это помогает снизить когнитивную нагрузку.

Мне этот Chrome DevTools теперь абсолютно понятен

Chrome DevTools – это не только панель для отладки, но и полноценная среда для проектирования, тестирования и анализа веб-приложений. С его помощью можно глубоко изучать DOM, стили, JavaScript, сетевые запросы, оптимизировать производительность и управлять данными пользователя.

Хорошая статья. Читайте тут ✌️

А ты знал про заголовок Clear-Site-Data? 👀

Один HTTP-заголовок, который позволяет очистить cookies, хранилище или кэш для твоего сайта. Идеально подходит для реализации logout-флоу

Подробнее:
https://developer.mozilla.org/en-US/docs/Web/HTTP/Reference/Headers/Clear-Site-Data

Добавь это в основной CSS-файл; приложение от этого точно не сломается, обещаю!

Твои юзеры скажут тебе спасибо!

MDN запустила собственный MCP-сервер

Теперь AI-агенты для программирования могут напрямую обращаться к актуальной документации MDN и данным о совместимости браузеров. Благодаря этому они генерируют более точные и актуальные ответы по веб-разработке.

→ официальный MCP-сервер от MDN
→ доступ к самой свежей веб-документации
→ работает с Claude Code, Cursor, VS Code и другими инструментами

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

http://developer.mozilla.org/en-US/blog/introducing-mdn-mcp-server

Этот универсальный SEO-скилл для Claude Code включает 25 специализированных скиллов и 18 ИИ-агентов, которые охватывают:

→ техническое SEO
→ E-E-A-T
→ Schema-разметку
→ GEO — оптимизацию под ИИ-поиск
→ обратные ссылки
→ локальное SEO
→ оптимизацию изображений
→ и многое другое...

Если вы используете Claude Code для разработки или поддержки сайтов, это точно стоит попробовать ✌️

Кубернетес для норм пацанов

Автор взял и развернул себе Kubernetes на виртуалке, но сделал это не абы как, а по красоте — с нормальной сеткой, OSPF, Calico и даже BGP

Всё пошагово: сначала сеть поднял, потом мастер и воркеры прикрутил, и в итоге три ноды бодро стали в строй. Получилась инструкция «для своих» — без лишних слов, но с кучей полезных деталей.

Предложение Await Dictionary для ECMAScript перешло на Stage 3 в TC39

Сейчас Promise.all возвращает результаты в виде массива, где значения определяются их позициями. Новый метод Promise.allKeyed позволит получать именованные результаты в объекте – это сделает код более читаемым и упростит работу с несколькими промисами

Хотите, чтобы сайт ощущался мгновенно отзывчивым?

<script type="speculationrules"> позволяет пререндерить следующую страницу ещё ДО того, как пользователь кликнет по ссылке.

Например, когда пользователь наводит курсор на ссылку.

Это веб-стандарт. Просто HTML. Без библиотек.

Минус: поддержка сейчас около 70% – Safari и Firefox пока не поддерживают.

Плюс: если браузер не поддерживает эту возможность, тег просто игнорируется. И всё

Онлайн книга «Total TypeScript Essentials»

Если ты хочешь уверенно разбираться в TypeScript эта книга именно для тебя. Matt Pocock простым языком объясняет даже сложные темы: от установки до крутых типовых фишек.

С этой книгой ты научишься писать безопасный код, понимать что делает TypeScript под капотом и использовать его возможности по максимуму. 📚

https://www.totaltypescript.com/books/total-typescript-essentials

«SVG Tutorial – How to Code Images with 12 Examples» как писать изображения прямо в HTML

Полезное руководство познакомит вас с миром SVG: вы узнаете, как писать изображения прямо в HTML, рисовать простые фигуры, группировать и переиспользовать элементы, добавлять текст и анимацию

Практичные примеры шаг за шагом делают материал доступным даже новичкам.