git reflog
git checkout -b my-branch <commit_hash>

.container {
  display: grid-lanes;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
}

min-block-size: calc-size(fit-content, min(size, 12em));
max-block-size: calc-size(stretch, min(size, 30em));

parseInt('1', 0)

parseInt('7', 1)

parseInt('11', 2)

['1', '7', '11'].map(str => parseInt(str))

['1', '7', '11'].map(Number)

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

🔵 VS Code: 125.7s → 10.6s
🔵 Sentry: 139.8s → 15.7s
🔵 Playwright: 12.8s → 1.47s

🈂️ обучающие материалы и документация
🈂️ UI-библиотеки и компоненты
🈂️ CSS- и JavaScript-инструменты
🈂️ API и полезные сервисы
🈂️ хостинги и платформы для деплоя
🈂️ браузерные расширения
🈂️ генераторы, онлайн-инструменты и многое другое

import { useState } from 'react';

function useFormStatus() {
  const [isSubmitting, setIsSubmitting] = useState(false);
  const [error, setError] = useState(null);

  const submit = async (action) => {
    setIsSubmitting(true);
    try {
      await action();
    } catch (err) {
      setError(err);
    } finally {
      setIsSubmitting(false);
    }
  };

  return { isSubmitting, error, submit };
}

function LoginForm() {
  const { isSubmitting, error, submit } = useFormStatus();

const handleSubmit = () => {
    submit(async () => {
      // Асинхронная отправка данных
    });
  };

  return (
    <form onSubmit={handleSubmit}>
      <button type="submit" disabled={isSubmitting}>
        {isSubmitting ? 'Submitting...' : 'Submit'}
      </button>
      {error && <p>{error.message}</p>}
    </form>
  );
}