Алгоритм:

• Выделить все строки, которые будут переноситься как целый объект.

• В контекстном меню выбрать "Абзац", вкладка "Положение на странице", установить флажки "Не отрывать от следующего" и "Не разрывать абзац".

• Включить режим отображения скрытых символов форматирования.

• Убедиться, что в конце шаблона последний символ не имеет свойств присоединения к следующему за ним блоку.

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

Это всё. Спасибо за внимание.

https://chmod-calculator.com/

Источник: stackoverflow.com

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

https://easings.net/

На этом сайте можно найти обширный список функций плавности с визуализацией их в нескольких практических вариантах использования, такие как отрисовка градиента, появление/исчезновение объекта через прозрачность, движение, изменение размера. Мне понравилось. Очень наглядно и удобно! Плюс там же есть готовый код для разработки на CSS и JS.

https://www.toptal.com/developers/keycode

npm install use-sound

Выполнить импорт хука и файла с аудио-записью:

import useSound from 'use-sound';
import mySound from '@/../assets/sounds/sound.mp3' // assets располагается в папке resources

Использовать в коде так:

const MyButton = () => {
  const [playSound] = useSound(mySound);
  
  return (
    <button onClick={() => playSound()}>
       Play Sound
    </button>
  );
};

Или так:

const MyButton = () => {
  const [playSound] = useSound(mySound, { volume: 0.7 });
  
  const handleClick = () => {
    playSound();
    // ...
  };

  return (
    <button onClick={() => handleClick()}>
       Play Sound
    </button>
  );
};

Подробности можно посмотреть тут или на гитхаб.

const refValue = React.useRef("Initial value"); <-- initializing 

refValue.current = "new value"; <-- Assigning new value through 'current' property

console.log(refValue.current);  <-- Accessing values using 'current' property
>> "new value" <<

Оба хука и useState, и useRefмогут использоваться для сохранения состояния. Но обновление значений useStateприводит к повторному рендерингу компонента, тогда как для useRefне происходит повторного рендеринга при обновлении значения.

Также useRef используется для сохранения ссылки на элементы DOM-дерева. Но это уже совсем другая тема.

Ссылка на источник.

Чтобы они попали в сборку в конфиге tailwind.config.js необходимо добавить путь до компонентов:

...

export default {
    content: [
        ...
        './node_modules/@material-tailwind/react/components/**/*.{js,ts,jsx,tsx}',
        './node_modules/@material-tailwind/react/theme/components/**/*.{js,ts,jsx,tsx}'    
    ],
    
    ...
};

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

ngrok не зависит от среды, поскольку он может доставлять трафик службам, работающим где угодно, без каких-либо изменений в вашей сетевой среде. Запустите свое приложение на AWS, Azure, Heroku, локальном кластере Kubernetes, Raspberry Pi и даже на своем ноутбуке. С ngrok все работает так же.

ngrok — это унифицированная входная платформа, поскольку она объединяет в одно все компоненты для доставки трафика от ваших сервисов в Интернет. ngrok объединяет ваш обратный прокси-сервер, балансировщик нагрузки, шлюз API, межсетевой экран, сеть доставки, защиту от DDoS и многое другое.

Источник: дока по ngrok.

Команда для создания туннеля и публикации приложения, доступного по протоколу HTTPS:

ngrok http http://localhost:8000 --scheme=https

После успешного запуска в консоли появится информация о зарегистрированном ресурсе:

В строке Forwarding есть адрес, по которому приложение доступно в Интернете: https://6c8d-178-64-170-208.ngrok-free.app При завершении сеанса Ctrl+C туннель будет удален и приложение снова станет недоступно.

Разработчикам это может пригодится, например, для тестирования и отладки подключения платежных систем к проектам.

Could not verify SSL certificate. (Network error [errno 60]: SSL certificate problem: self-signed certificate in certificate chain)

Ошибка происходит, если сертификаты SSL не установлены в системе должным образом.

Можно решить эту проблему следующим образом:

1. Загрузить файл с обновленным списком сертификатов по ссылке:
   https://curl.haxx.se/ca/cacert.pem
2. Переместить загруженный файл cacert.pem в локальное безопасное место.
3. Обновить файл php.ini: добавить или обновить путь до сертификата:
   openssl.cafile=C:/dev/ssl/cacert.pem
4. Перезапустить сервер.