REACT

Встановлення react через збірник vite у VSCode

Встановити Vite

Встановити react

npm create vite@latest

P.S.Якщо створювати реакт через vite у ВЖЕ існуючій папці, то в якості назви проетку треба вказати . (точка), бо по факту назва проекта - то буде нова папка куди покладутся нові файли

Оновлення реакту

npm install react@latest

Плагіни VSCode для react

ES7 + React/Redux/React-Native snippets

Бібліотеки react

CLSX - Бібліотека стандартизує роботу з CSS

React icons

material-ui бібліотека стилів дизайнів для реакт

NanoId - генератор унікальніх номеров ид-шек

Formik - бібліотека роботи з формами у react

React-hook-form - бібліотека роботи з некерованими формами у react

Yup - Бібліотека для валідації \ перевірка введених користувачем

Бібліотека Axios - простий HTTP-клієнт

React-loader Загрузчиики для реакта

animated-backgrounds - аніміровоні фони для react

react-hot-toast Попапи\сповіщення

react-modal - модальні вікна для react

react-helmet-async - дозволяє на сторінки додавати метатеги (title тощо)

React Router - Бібліотека маршрутизації для React

Reduce - Керування стейтами (базовий ванільний варіант)

Redux Toolkit - Керування стейтами (новий правильний варіант)

Persistor - синхронізація значень стейтів між Redux і локальним сховищем

createAsyncThunk - асинхронні запити в Redux Toolkit

Програмування в react

Умови

Оператор &&

Тернарний оператор

Колекції

map (react)

Стилі

Стилі (react)

Бібліоттека clsx

Використаня класа active в NavLink

Події

Обробка подій

Хук useState

Хук useEffect

Хук useId

Хук useRef

Хук useMemo

Хук useParams

Хук useNavigate

Хук useSearchParams

Хук useLocation

Хук useSelector

Отримання даних з форми react

React.lazy() та React.Suspense Динамічне завантаження модулів

Сховища react

Робота з LocalStorage у react

Redux Toolkit - Керування загальним сховищем стейтів

Persistor - синхронізація станів між redux і локальним сховищем

поради / іньше

Офіційна документація по react

rafce - сниппер для швидкого сформування структури модуля у реакті

Налаштування ESLint

Помилка при створенні реакт-додадку npm ERR! enoent

Щоб повернути з модуоля декілька тегів - можна обгорнути у корневий ПУСТИЙ тег </>

Якщо створювати реакт через vite у ВЖЕ існуючій папці, то в якості назви проетку треба вказати . (точка), бо по факту назва проекта - то буде нова папка куди покладутся нові файли

Створення посилання повернення на попередню адресу сторінки