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

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

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

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

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

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

Laravel 13 Tip: Cache::flexible()

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

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

Laravel 13 Tip: Cache::flexible()

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

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

PHP Tip

Используете ли вы выражение match, чтобы сделать conditional logic чище и понятнее?

Cправочник по паттернам проектирования в JavaScript и TypeScript

Архитектура, масштабируемость, анти паттерны и лучшие практики всё в одном месте, понятно и с примерами применения в реальных проектах.

Забираем тут

Laravel Tip

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

Подборка из 200+ тщательно отобранных ресурсов для веб-разработчиков

В нем собраны лучшие материалы для обучения, инструменты, библиотеки, хостинги, расширения и многое другое.

Забираем с сайта или GitHub

Laravel Tip

Если целевые значения имеют тип integer, данные можно загружать быстрее.

Используйте whereIntegerInRaw() вместо whereIn(), когда работаете с целочисленными значениями — это может повысить производительность запроса.

Laravel Tip

Передавайте большие файлы без лишней нагрузки на память с помощью streams:

Laravel Tip

А вы знали, что filled() умнее, чем has()?

Он не только проверяет наличие значения, но и убеждается, что оно не null и не пустое.

В Full Stack Open вышел новый раздел по Next.js

Бесплатный онлайн курс по Full Stack разработке от Университета Хельсинки продолжает расширяться, в программе появился новый отдельный раздел, посвящённый современному Next.js.

Хороший повод студентам вернуться к курсу, которые уже прошли основные части React и Node.js и хочет двигаться дальше в Full Stack.

Топ бесплатных GitHub-репозиториев для изучения программирования

JavaScript Algorithms: Реализации популярных алгоритмов и структур данных на JavaScript.
https://github.com/trekhleb/javascript-algorithms

30 Days of JavaScript: 30-дневный практический курс для прокачки JavaScript.
https://github.com/Asabeneh/30-Days-Of-JavaScript

System Design Primer: Большая база по System Design и подготовке к техническим собеседованиям.
https://github.com/donnemartin/system-design-primer

Awesome Python: Огромная подборка библиотек, frameworks и инструментов для Python.
https://github.com/vinta/awesome-python

Frontend Developer Interview Preparation: Материалы для подготовки Frontend-разработчиков к собеседованиям.
https://github.com/EnoahNetz/Frontend-Developer-Interview-Preparation

Developer Roadmap: Roadmaps для Backend, Frontend, DevOps и других направлений разработки.
https://github.com/kamranahmedse/developer-roadmap

Free Programming Books: Огромная коллекция бесплатных книг, курсов и других материалов по программированию.
https://github.com/EbookFoundation/free-programming-books

Совет: добавляйте полезные репозитории в ⭐️ Stars и используйте GitHub как собственную библиотеку для обучения.

Laravel Tip

Как вам такой приём? Используйте when() для условного построения Eloquent queries.

✅ Более чистые queries
✅ Проще поддерживать код
✅ Отлично подходит для optional filters

Так controllers остаются чистыми, а код не превращается в набор громоздких if.

Мини учебник по JavaScript для новичков

Откройте для себя идеальный старт в мире JavaScript! Wes Bos собрал всё что нужно новичку: понятные объяснения, живые примеры и доступ к коду на GitHub.

Учитесь в своём темпе и создавайте веб‑страницы уже сегодня.

https://wesbos.com/javascript

Совет по HTML: Используй тег <picture> для адаптивных изображений

Когда тебе нужно отображать разные версии изображения на разных устройствах например, для мобильных и десктопных экранов, применяй тег <picture>. Он позволяет задавать условия, при которых будет загружаться конкретная версия картинки.

<picture>
  <source srcset="320.jpg" media="(max-width: 800px)">
  <img src="640.jpg" alt="...">
</picture>

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

Браузер проходит по тегам <source> сверху вниз и выбирает первый, условия media которого совпадают с текущими

Если ни один <source> не подходит или браузер не поддерживает <picture>, загрузится изображение из тега <img>

Эта платформа предлагает более 500 вопросов, разбитых на 20 категорий, включая такие темы, как Git, CSS, JavaScript, React и многое другое.

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

https://quizzes.madza.dev/