#html #css #JavaScript #frontend

Зачем нужен элемент <dialog>

Хотите получить от пользователя подтверждение? Предоставляете пользователю диалог с возможностью выбора. Хотите получить информацию от пользователя? Используйте диалог с отправляемым полем ввода формы. Существует множество вариантов использования диалогов в пользовательских интерфейсах.

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

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

Именно здесь на помощь приходит встроенный в браузер элемент <dialog>. Это всё, что нужно в диалоге, и теперь, когда Safari добавил поддержку элемента <dialog>, начиная с версии 15.4, нет никаких оправданий, чтобы не использовать их в продакшене!

📄 Читать статью

@dev_notes_ru

#laravel #php #tips #backend

Найдите запросы, занимающие много времени. Их легко логировать.

@dev_notes_ru

#laravel #feature #php #backend

Новое в Laravel 11.20.

Новый строковый метод deduplicate().

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

```php
Str::dedup('random double spaces'); // 'random double spaces'
Str::dedup('/some//odd/path//', '/'); // '/some/odd/path/'
Str::dedup('zondaaaa', 'a'); // 'zonda'
```
Примечание: Хотя второй параметр можно было бы добавить в `squish`, их основной замысел был иным. `squish` существует и в других языках. Поэтому создание отдельного, нового метода показалось более целесообразным, чем расширение поведения `squish` в Laravel.

👉 Pull Request Add `deduplicate` to strings #52350

@dev_notes_ru

#DevOps #curl #shell

Примеры использования cURL

Независимо от того, разработчик ли вы, DevOps-инженер, системный администратор, QA или представитель любой другой технической профессии, вы наверняка знакомы с cURL — инструментом командной строки и библиотекой для передачи данных с помощью URL (как описано в документации).

Однако чаще всего curl используется только для простых задач, таких как загрузка файла или проверка доступности сайта, а ведь он может гораздо больше!

И в этой статье рассмотрим именно такие крутые примеры и трюки, демонстрирующие, почему curl является удивительным и недооценённым инструментом…

📄 Читать статью

@dev_notes_ru

#css #feature #frontend

CSSWG одобрила...
переменные в контейнерных запросах!

@dev_notes_ru

#js #JavaScript #tips #frontend #webdev

Хотите генерировать случайные цвета с помощью JavaScript?

Сейчас я покажу как это сделать 🎨.

@dev_notes_ru

#laravel #middleware #tips #php #backend

Ограничьте количество запросов, которые может выполнить пользователь за определенное время, и предотвратите злоупотребление вашими API.

@dev_notes_ru

#laravel #eloquent #ORM #tips #php #backend

Laravel предоставляет отношения belongsToMany(), позволяющие формировать отношения "многие-ко-многим" между двумя различными моделями в приложении.

Примером такого отношения может служить модель User и Role, в которой одна роль может принадлежать многим пользователям, а один пользователь - многим ролям.

Мы создаем промежуточную/поворотную таблицу, чтобы отобразить отношения между этими двумя моделями.

Но знаете ли вы, что можно также сохранять временные метки, когда эти отношения были сформированы, используя метод withTimestamp() при создании отношений?


@dev_notes_ru

#css #frontend

Что, если использовать контейнерные единицы измерения для... всего

Однажды я спросил себя: а что, если использовать контейнерные единицы измерения для каждого элемента дизайна? Я задался этим вопросом, отчасти потому, что мне показалось, что ответ может быть таким: ну, тогда всё будет очень хорошо масштабироваться!

Контейнерные единицы измерения, если вы ещё не слышали о них, — это единицы измерения (такие, как px или rem, но более близкие к единицам измерения области просмотра, таким как vw или vi), имеющие размер в соответствии с контейнером, в котором они находятся.

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

📄 Читать статью

@dev_notes_ru

#laravel #vlade #tips #php #backend

Laravel Tip💡: Подсказки типов для Blade

Мы часто используем Blade, и если на что и можно пожаловаться, так это на подсказки типов. Однако эту проблему можно решить, определив блок @php для всех используемых переменных 🚀.

@dev_notes_ru

#php #tips #backend

Если хотите проверить, является ли строка действительным кликабельным URL, используйте метод filter_var() с параметром FILTER_VALIDATE_URL.

Один из упрощенных примеров - добавление префикса "https://", если пользователь его забыл.

@dev_notes_ru

#php #tips #frontend

Зачем нужна типизация массивов в PHP

В PHP уже давно существует возможность типизировать параметры методов и функций. Добавление типов в массивы (и просто добавление типов в целом) поможет при использовании IDE или статического анализа, а также поможет другим разработчикам в команде понять ваш код. Также это поможет избежать ошибок и сделает код чище и читабельнее.

В принципе, в любой версии PHP, можно сделать что-то вроде:

function getNames(array $input): array {
  return array_map(function($item) {
    return $item->getName();
  }, $input)
}

Однако это мало говорит о типах, с которыми имеем дело.

📄 Читать статью

@dev_notes_ru

#css #tips #example #frontend

Арка (неполная обводка круга) с закругленными краями

Создание арки (неполной обводки круга) с закругленными краями с помощью нескольких строк CSS

✅ Одиночный элемент (без псевдоэлемента)
✅ Менее 10 объявлений CSS
✅ Поддерживает градиентное окрашивание
✅ Оптимизировано с помощью переменных CSS

.arc {
  --b: 30px; /* the boder thickness */
  --a: 220deg; /* control the progression */
  
  width: 200px;
  aspect-ratio: 1;
  padding: var(--b);
  box-sizing: border-box;
  border-radius: 50%;
  background: linear-gradient(#CC333F,#8A9B0F);
  --_g:/var(--b) var(--b) no-repeat
    radial-gradient(50% 50%,#000 calc(100% - 1px),#0000);
  mask:
    top var(--_g),
     calc(50% + 50%*sin(var(--a))) 
     calc(50% - 50%*cos(var(--a))) var(--_g),
    linear-gradient(#0000 0 0) content-box intersect,
    conic-gradient(#000 var(--a),#0000 0);
}

👉 Пример на CodePen

@dev_notes_ru

#laravel #collection #tips #php #backend

Методы Laravel Collection toArray и all часто используются как взаимозаменяемые. Однако toArray проверяет каждый элемент на наличие Arrayable и вызывает toArray() для этих элементов.

Если содержимое коллекции известно, можно избежать этой дополнительной обработки, просто используя all.

@dev_notes_ru

#joke #tdd

#MySQL #features #DB #DataBase

MySQL 9.0 Community Edition: Ключевые возможности и улучшения

Ознакомьтесь с новыми возможностями и улучшениями в MySQL 9.0 Community Edition, вышедшем 1 июля 2024 года. Обзор охватывает обновления типов данных, производительности и новых возможностей, ориентированных на современные приложения.

1 июля 2024 года вышла MySQL 9.0 Community Edition, названная "Инновационным релизом". Новая версия обещает повышенную производительность, гибкость и новые возможности, призванные удовлетворить динамичные потребности современных приложений. Но оправдает ли она надежды, особенно после бурного приёма MySQL 8.0? Давайте посмотрим, что может предложить MySQL 9.0.

📄 Читать статью

@dev_notes_ru

#laravel #eloquent #php #tips #backend

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

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

Это вызвало исключение LazyLoadingViolationException, потому что Laravel теперь пытался лениво загрузить эти недостающие вложенные отношения.

Чтобы избежать этой проблемы, всегда используйте метод loadMissing($relation) вместо метода load(), если не уверены, что отношения уже загружены.

@dev_notes_ru