Варианты данных для отправки через navigator.sendBeacon()

Что можно передать в качестве данных в метод navigator.sendBeacon()?

Если забыли, то вернитесь к посту от 21.05.2024.

👉 @web_craft | #frontend

Получение всех переменных в текущей области видимости PHP

Функция get_defined_vars() в PHP возвращает ассоциативный массив всех определенных переменных в текущей области видимости. Ключи массива – это имена переменных, а значения – их содержимое. Функция возвращает как пользовательские переменные, так и суперглобальные массивы (например, $_GET, $_POST, $_SERVER).

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

$name = "Alice";
$age = 30;

$all_vars = get_defined_vars();

print_r($all_vars);

Результат:

Array
(
    [name] => Alice
    [age] => 30
    [_GET] => Array
        (
        )
    [_POST] => Array
        (
        )
    [_COOKIE] => Array
        (
        )
    [_FILES] => Array
        (
        )
    [GLOBALS] => Array
        *RECURSION*
)

👉 @web_craft | #php

Проверка фокуса на элементе

document.activeElement — это свойство в JavaScript, которое позволяет определить текущий сфокусированный элемент в документе. Его использование позволяет узнать, находится ли определенный элемент в фокусе. Это свойство возвращает элемент, который в данный момент имеет фокус, или null, если ни один элемент не сфокусирован. Важно отметить, что document.activeElement доступно только для чтения, что означает, что нельзя напрямую изменить его значение.

Пример:

let el = document.querySelector('.btn-white');
let isFocus = el === document.activeElement;

console.log(isFocus); // true/false

В этом примере с помощью document.querySelector выбирается элемент с классом .btn-white. Затем, переменная isFocus устанавливается в true, если выбранный элемент el совпадает с текущим сфокусированным элементом document.activeElement, и в false в противном случае. Это позволяет легко определить, сфокусирован ли данный элемент в текущий момент.

👉 @web_craft | #frontend

Создание сервиса для обмена файлами без головной боли.

Статья описывает, как создать сервис для обмена файлами, используя Fly.io и Tigris1. Автор статьи рассказывает о проблемах, связанных с обменом больших файлов между пользователями в разных частях мира, и предлагает решение этой проблемы с помощью глобального хранилища объектов и вычислительных ресурсов, предоставляемых Fly.io и Tigris1.

👉 @web_craft | #frontend

Жизненно?

👍 - Да.

🤔 - Нет.

👉 @web_craft | #юмор

Преобразование запросов и ответов API в Laravel 11

В статье рассматривается проблема различия в соглашениях об именовании в PHP (snake_case) и JavaScript (camelCase). Это может вызвать проблемы при работе с Next.js на фронтенде и Laravel на бэкенде в качестве традиционного REST API2.

Автор предлагает решение этой проблемы с помощью Laravel resources.

👉 @web_craft | #laravel

CSS LEGO Minifigure Maker

Интерактивный редактор LEGO фигурки на CSS.

👉 @web_craft | #frontend

Иллюзия проектирования.

👉 @web_craft | #юмор

Как завалить собеседование, даже не начав его: ошибки в сопроводительных письмах

Статья рассказывает о восьми “подводных камнях”, которые могут подорвать доверие к вашему агенту и лишить вас работы.

Делали подобные ошибки?

🤔 - Было дело.

👍 - Нет.

👉 @web_craft | #собес

Функция анонимных миграций

Что такое анонимные миграции в Laravel?

Если забыли, то вернитесь к посту от 27.05.2024.

👉 @web_craft | #laravel

В Айтилогии стартует 7-дневный бесплатный интенсив по frontend-разработке, на котором ты с нуля без знаний создашь фронтенд-проект на Angular 🔥

На интенсиве ты:
– Сверстаешь лендинг на HTML + CSS
– Реализуешь функционал на JavaScript
– Используешь фронтенд-фреймворк Angular
– Подключишь Backend и загрузишь сайт на хостинг

🎁 Будет общий чат, проверка домашек от экспертов, различные бонусы!

А за кодовую фразу, собранную во время интенсива, автор подарит своё резюме Senior-разработчика, с помощью которого устроился на ЗП 3500$

Первые 100 мест бесплатно, потом 6 990 руб. Не упусти
👉 Frontend Start

Реклама. ИП Чернова О. А., ИНН:771399721044

Использование функции Intl.NumberFormat

Для чего используется Intl.NumberFormat в JavaScript?

Если забыли, то вернитесь к посту от 28.05.2024.

👉 @web_craft | #frontend

Валидация в Laravel

Метод Validator::extend() предоставляет возможность создавать собственные правила валидации, выходя за рамки стандартного набора, предоставляемого Laravel.

Применение:

Validator::extend('older_than', function ($attribute, $value, $parameters) {
    $minAge = $parameters[0] ?? 18;
    return Carbon::parse($value)->age >= $minAge;
});

В данном примере определяется правило older_than, которое проверяет, является ли указанная дата ($value) датой рождения человека, достигшего возраста не менее $minAge лет.


После определения пользовательского правила, его можно использовать в валидаторе данных наряду со встроенными правилами:

$validator = Validator::make($data, [
    'birthdate' => 'required|date|older_than:21', 
]);

👉 @web_craft | #laravel

Отслеживание изменений в DOM

MutationObserver — это API в JS для наблюдения за изменениями в DOM. Оно позволяет отслеживать добавление или удаление узлов, изменения атрибутов и текста.

Пример:

const targetNode = document.getElementById('myDiv');
const config = { attributes: true, childList: true, subtree: true };
const callback = function(mutationsList, observer) {
    for(const mutation of mutationsList) {
        if (mutation.type === 'childList') {
            console.log('A child node has been added or removed.');
        }
        else if (mutation.type === 'attributes') {
            console.log(`The ${mutation.attributeName} attribute was modified.`);
        }
    }
};
const observer = new MutationObserver(callback);
observer.observe(targetNode, config);

В этом примере, при любом изменении атрибутов или дочерних элементов внутри myDiv (или его потомков, благодаря опции subtree: true), функция callback будет вызвана и выведет соответствующее сообщение в консоль.

👉 @web_craft | #frontend

Инструкция, как зайти в IT без опыта

Можно 10 лет проработать на одном месте, выполнять простые задачи, и ваши навыки не будут отличаться от студента-первокурсника. А можно за полгода прокачаться и создать настолько мощный проект в портфолио, что рекрутеры будут в восторге.

Все потому что опыт и стаж работы – разные вещи.

Нужно понимать свой уровень знаний, сильные стороны и как впечатлить своими навыками HR, а не показывать стандартный пет-проект.

Но со стороны отследить такое проще, поэтому FAANG School подготовили тест, где за 5 вопросов вы узнаете, как получить работу в Сбербанке, Тинькофф, Яндекс, Вконтакте и др.

Для всех, кто пройдет тест в течение 24 часов ребята дают бонус – гайд по поиску работы в IT. Переходите, чтобы собрать идеальное резюме, а на бесплатной карьерной сессии поймете, как именно вам получить позицию Java Junior в лучших IT-компаниях.