Ответ
Для приложения доставки пиццы я бы выбрал:
- React Router - для навигации между страницами (меню, корзина, оформление заказа)
- React Hook Form - для валидации форм (адрес доставки, контактные данные)
- Yup - в паре с React Hook Form для схем валидации
- Leaflet/Mapbox - для отображения карты и выбора адреса доставки
- Framer Motion - для анимаций (добавление в корзину, переходы между страницами)
- Date-fns - для работы с временем доставки
- React Toastify - для уведомлений (подтверждение заказа, статус доставки)
Пример использования React Hook Form:
import { useForm } from 'react-hook-form';
import { yupResolver } from '@hookform/resolvers/yup';
import * as yup from 'yup';
const schema = yup.object({
address: yup.string().required('Укажите адрес доставки'),
phone: yup.string().matches(/^+?[0-9]{10,15}$/, 'Некорректный телефон')
});
function DeliveryForm() {
const { register, handleSubmit, formState: { errors } } = useForm({
resolver: yupResolver(schema)
});
const onSubmit = data => console.log(data);
return (
<form onSubmit={handleSubmit(onSubmit)}>
<input {...register("address")} />
{errors.address && <p>{errors.address.message}</p>}
<input {...register("phone")} />
{errors.phone && <p>{errors.phone.message}</p>}
<button type="submit">Оформить заказ</button>
</form>
);
}