Заметки разработчика
473 subscribers
667 photos
4 videos
1.16K links
Заметки о Frontend, Backend и немного DevOps. В основном о #PHP, #Laravel, #JavaScript, #HTML, #CSS, тестировании и настройке серверов.

https://www.dev-notes.ru

@snakenf
Download Telegram
👩‍💻 navigator.clipboard — Новый асинхронный Clipboard API в JavaScript

Копирование и вставка текста, изображений и файлов с помощью нового API navigator.clipboard

Впервые столкнувшись с новым API navigator.clipboard, я был поражён тем, насколько просто он упростил копирование и вставку в веб-приложениях. Прошли времена хаков document.execCommand.

Раньше для обработки операций с буфером обмена использовался document.execCommand("copy"). Этот подход был синхронным и ограниченным — он мог копировать текст только из выбранных элементов DOM. Кроме того, в разных браузерах он работал нестабильно.

🖥 Читать статью

📱 @dev_notes_ru

#JavaScript #Clipboard #API
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3🔥2
👩‍💻 HTML элемент <details>: Встроенный аккордеон, который вы не используете

Узнайте, как HTML элемент <details> может заменить JavaScript аккордеоны и почему он может быть лучше, чем ваше текущее решение.

HTML элемент <details>, возможно, один из самых недооцененных встроенных элементов. Меня постоянно удивляет, как много разработчиков прибегают к использованию JavaScript, когда им нужно показать/скрыть содержимое, совершенно не обращая внимания на эту встроенную возможность.

🖥 Читать статью

📱 @dev_notes_ru

#HTML #details
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5👍2
👩‍💻 align-content: Простой способ выравнивания по центру с CSS

Наконец, можно центрировать/выравнивать по центу содержимое блочных макетов, не прибегая к flexbox гимнастике

Блочные макеты были частью CSS с самого начала, но им всегда не хватало необходимых элементов управления выравниванием. Теперь, благодаря поддержке align-content в блочных макетах, можно центрировать по вертикали с той же гибкостью, что и в flex и grid.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #AlignContent
Please open Telegram to view this post
VIEW IN TELEGRAM
👍1
👩‍💻 Не раздражающая валидация формы: CSS :user-valid и :user-invalid

Новые псевдоклассы :user-valid и :user-invalid предоставляют более умный способ стилизации состояния валидности формы в зависимости от действия пользователя.

Стилизация валидации форм всегда была сложной задачей. Новые псевдоклассы :user-valid и :user-invalid устраняют давнее неудобство CSS стилизации валидации форм — слишком раннее отображение состояния ошибки.

В отличие от своих предшественников :valid и :invalid, новые селекторы ждут реального взаимодействия с пользователем, перед применением стилей. Это, небольшое отличие приводит к значительному улучшению пользовательского опыта: больше нет полей, помеченных как невалидные до того, как пользователь начал вводить текст.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #Form #Validation
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3🔥1
Отладка мелкого бага

📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
😁4
Please open Telegram to view this post
VIEW IN TELEGRAM
👏3
👩‍💻 CSS `@import`: Плюсы и минусы

Использование @import обычно считается плохой практикой. Несмотря на определённые соображения, связанные с производительностью, @import предоставляет полезную функциональность, которой не обладает <link>.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #import
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Что такое PSR-6: Руководство по стандартам кэширования PHP

PHP приложение тормозит из-за повторяющихся запросов к базе данных или неэффективного кэширования? Вы хотите, чтобы переключение между библиотеками кэширования было более простым? PSR-6 — стандарт PHP, обеспечивающий согласованный интерфейс для систем кэширования, делающий код гибким, эффективным и простым в сопровождении.

🖥 Читать статью

📱 @dev_notes_ru

#PHP #PSR6
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Руководство по вебхукам в Laravel

Свежее руководство по вебхукам в Laravel от Steve McDougall.

Освойте вебхуки в Laravel. Узнайте о настройке, безопасности, обработке событий и многом другом, позволяющем создавать мощные интеграции в режиме реального времени.

В наши дни общение в реальном времени не просто ожидается — оно необходимо. Пользователям надоело ждать обновления всей страницы, чтобы получить самую свежую информацию. Появились вебхуки, невоспетые герои мира технологий. О них мало кто говорит, но это скоро изменится. Моя миссия — создать полное руководство по вебхукам в Laravel, сделав его основным ресурсом для интеграции веб-хуков в следующее приложение на Laravel.

🖥 Читать статью

📱 @dev_notes_ru

#Laravel #webhook
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Различие между PHP getenv() и $_ENV

Переменные среды играют важную роль в современной разработке, в частности, для управления конфиденциальными данными, такими как ключи API или специфические конфигурации среды. В PHP существует два основных способа доступа к этим переменным: функция getenv и суперглобальная переменная $_ENV. Хотя они могут показаться взаимозаменяемыми, но ведут себя по-разному и могут создавать проблемы при неправильном использовании.

🖥 Читать статью

📱 @dev_notes_ru

#PHP #getenv #ENV
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥21👎1
👩‍💻 Кэширование аутентифицированных пользователей в Laravel

Для ускорения работы приложений Laravel с высокой посещаемостью можно кэшировать аутентифицированных пользователей, избавляясь от лишних обращений к базе данных.

Я покажу, как это сделать, но это не быстрое решение; придётся подумать, что произойдёт, когда пользователь будет обновлён или удалён.

🖥 Читать статью

📱 @dev_notes_ru

#Laravel #cache #auth
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥1
День 1: Начало нового проекта
...
День 217: Решение продакшен тикетов

📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
💯5🤣2🔥1
Please open Telegram to view this post
VIEW IN TELEGRAM
😁4🔥1
Три стадии отладки, описанные нашими предками

📱 @dev_notes_ru

#joke
Please open Telegram to view this post
VIEW IN TELEGRAM
😁4🔥1🤣1
💡 Совет по Laravel: Поиск дубликатов

Иногда может потребоваться найти дубликаты значений, например, при очистке данных. Хотя это можно сделать вручную, Laravel поставляется с методом duplicates, позволяющим сделать именно это 🚀.

📱 @dev_notes_ru

#Laravel #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥2
💡 Совет по Laravel: Обновление сводных столбцов

Вам когда-нибудь требовалось обновить сводный столбец? Хотя это можно сделать вручную с помощью конструктора запросов, Laravel поставляется с методом updateExistingPivot, позволяющим сделать именно это 🚀.

📱 @dev_notes_ru

#Laravel #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥1
💡 Совет по Laravel: Полезные свойства `loop`

При работе с циклами в Blade может понадобиться проверить наличие нечетных итераций или вычислить оставшееся количество итераций для настройки UI. Хотя это можно сделать и вручную, переменная loop содержит почти все необходимые свойства 🚀.

📱 @dev_notes_ru

#Laravel #Blade #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
Статистика версий PHP: Январь, 2025

Использование PHP в январе 2025 года. Дважды в год я пишу обновлённую информацию об использовании версий PHP в сообществе.

🖥 Читать статью

📱 @dev_notes_ru

#PHP
Please open Telegram to view this post
VIEW IN TELEGRAM
💡 Совет по Laravel: Правило валидации `distinct`

Вам когда-нибудь требовалось проверить, содержит ли массив дубликаты значений? Хотя это можно сделать вручную, но это может выглядеть несколько запутанно. Вместо этого можно использовать правило валидации distinct, позволяющее сделать именно это 🚀.

📱 @dev_notes_ru

#Laravel #Validation #tips
Please open Telegram to view this post
VIEW IN TELEGRAM
👩‍💻 Несколько интересных вещей о `@counter-style`

А вы уже использовали @counter-style? Этот инструмент способен существенно облегчить работу со списками и маркерами.

🖥 Читать статью

📱 @dev_notes_ru

#Frontend #CSS #Counter
Please open Telegram to view this post
VIEW IN TELEGRAM
👍2🔥1