Разбор Tanstack Router - убийца React Router

แชร์
ฝัง
  • เผยแพร่เมื่อ 22 พ.ย. 2024

ความคิดเห็น • 58

  • @PurpleSchool
    @PurpleSchool  9 หลายเดือนก่อน +2

    🔗 Ссылки:
    TanStack Router: tanstack.com/router/v1
    Курс по React и Redux: purpleschool.ru/course/react-...
    Промокод COURSESTOP на скидку 5%
    🎓 Мои курсы: purpleschool.ru
    💬 Telegram канал с полезными советами:
    t.me/purple_code_channel

  • @nikita_belous
    @nikita_belous 9 หลายเดือนก่อน +5

    Наверное, вместо Number(search?.page) ?? 1 должно быть Number(search?.page) || 1.
    Так как если page не передали, то мы получим undefined, а Number(undefined) -> NaN, NaN ?? 1 -> NaN

  • @gubatenkov
    @gubatenkov 9 หลายเดือนก่อน +3

    Чувак, ты чисто на волне передовых фронтенд технологий залетел с видосом про Tanstack 👏

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน +2

      Всегда на грани технологий)

  • @Фрукт-я7п
    @Фрукт-я7п 9 หลายเดือนก่อน +3

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

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Спасибо! Рад, что было полезно

    • @Фрукт-я7п
      @Фрукт-я7п 9 หลายเดือนก่อน +1

      ​@@PurpleSchoolединственное, надо было ещё показать как layouts использовать и показывать loading компонент

  • @Edgar-pu1lc
    @Edgar-pu1lc 9 หลายเดือนก่อน +3

    Спасибо за видео, жаль про layout ничего не показал

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Спасибо!

    • @Фрукт-я7п
      @Фрукт-я7п 9 หลายเดือนก่อน

      Поддерживаю

    • @golden_smiles
      @golden_smiles 9 หลายเดือนก่อน

      Да, по лейаутам по файл роутингу они чтото намудрили, разбираюсь тоже ))

  • @evoleurt
    @evoleurt 6 หลายเดือนก่อน

    Спасибо, избавился от реакт роутера в пользу адекватного роутинга от tanstack

  • @ДмитрийРовер
    @ДмитрийРовер 9 หลายเดือนก่อน +2

    хотел использовать в новом проекте, стал разбираться и столкнулся с тем, что документация описана криво, например не работают ссылки, или несовсем понятно, например про контекст, показалось что кода как-будто бы писать больше, а в конце, из-за чего вообще забросил, типы в библиотеке не дописаны, тупо есть название интерфейса, а полей в нём нет, закоменчены, в связи с чем будут проблемы с типизацией в проекте. Встретил на зарубежном форуме комент, где человек откровенно удивлён, что библиотеку выпустили, тк он следил за разработкой и она была далека до завершения. Короче буду ждать следующие версии, а там посмотрим

    • @vint_razboltaylo
      @vint_razboltaylo 9 หลายเดือนก่อน +2

      Либа и правда сырая, но потенциал у нее есть, так что пока ждем апдейты

    • @viktorkasap
      @viktorkasap 8 หลายเดือนก่อน

      Такая же история, документация пока сырая, в примерах такое ощущение что на скорую руку делали, чисто для демки. Походу да, надо ждать, они ща получать миллион негативного фидбэка и доведут до ума... надеюсь

  • @data-center-project
    @data-center-project 6 หลายเดือนก่อน

    А как его правильно с Tanstack Query подружить ?

  • @bolovy6093
    @bolovy6093 9 หลายเดือนก่อน +5

    Привет, думаю если бы вы писали в обычном редакторе (vscode/webstorm) код воспринимался бы намного легче, а так спасибо за годный контент 🎉

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Спасибо)

  • @d.sadykov1354
    @d.sadykov1354 7 หลายเดือนก่อน

    У меня почему-то не генерируется файл .gen при npm run dev. Хотя плагин добавлен, может быть это потому что vite + electron + react отличается от vite + react просто. Плагин добавлен в конфиг рядом с плагином react()

  • @ananasios
    @ananasios 9 หลายเดือนก่อน

    Молодой человек подскажи что за тема у тебя в nvim установлена ? Оч уж зашла

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Это TokioDark

  • @viktorkasap
    @viktorkasap 9 หลายเดือนก่อน

    Спасибо, отличный обзор! 🤘
    На будущее интересно увидеть было бы реализацию авторизации, хотя бы минимум и я пока не очень понял, используя эту либу надо ли нам ставить query, для запросов, или она так же хранит кэшем данные в себе и дополнительная либа уже будет лишней, нам хватит только router?

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน +1

      Спасибо! Все равно нужен дополнительный state manager или хотя бы tanstack query

    • @viktorkasap
      @viktorkasap 9 หลายเดือนก่อน

      @@PurpleSchool понял, спасибо 🙏, значит одно не исключает другое.

    • @viktorkasap
      @viktorkasap 9 หลายเดือนก่อน +1

      ​@@PurpleSchoolя вообще такой микс использую: tanstack query у меня хранит то что от сервера получено, effector хранит то что в рамках приложения используется (например у меня с одной стороны форма для ввода данных, с другой стороны превью, это два разных и не связных компонента, и чтобы не костылить effector очень помогает как независимое хранилище)

  • @proletarian
    @proletarian 7 หลายเดือนก่อน

    Дочерних роутов здесь нету? Как то не обнаружил как они работают, или может плохо искал

  • @awenn2015
    @awenn2015 6 หลายเดือนก่อน

    Не пон, а как обрабатывать загрузку? Я думал по логике танстака в компоненте в data мы должен получить данные и что то вроде isLoading рядом, а по факту ничего такого там нет, как по итогу спинер то показывать?

    • @onizuka117
      @onizuka117 2 หลายเดือนก่อน

      также как и ReactRouter, с помощью

  • @bellmoon2754
    @bellmoon2754 9 หลายเดือนก่อน

    Спасибо за обзор! Но честно говоря видео получилось не рыба и не мясо. Для обзора слишком длинное для полноценного урока как-то не хватило объяснений зачем это нужно и чем это решение лучше существующих

  • @CJIu3eHb
    @CJIu3eHb 9 หลายเดือนก่อน

    Блокирующий лоадер - это не круто, конечно. Тема с типизированными роутами не нова, в RN такое есть (без учета фишки сопоставления файловой структуры, ну и в целом не под web заточено, понятное дело).
    Хочу офтопнуть по Next 13: как сохранять состояние между запросами на серверные эндпойнты (которые /app/api/...)? Там файлы походу не постоянно крутятся, а чуть ли не как в php на каждый запрос вызываются. По крайней мере, console.log в импортируемом в хендлер запроса файле отрабатывает на каждый запрос. Ну и начальная инициализация там через одно темное место, какой-то точки входа нет, если экпериментальная фича положить функцию register в файл instrumentation.ts, типа там можно подобие бутстрапа организовать. Так вот, между запросами хочу хранить данные в памяти, а-ля сервис, который хранит/выдает массив с данными. И ничего не выходит. Т.е. данные можно только хранить на диске и оттуда каждый раз читать (а так как данные нужно иногда менять, то и писать). А хотелось бы в памяти, подумываю попробовать засорить своей переменной global ноды (уж она то должна постоянно крутиться, запросы ожидать), но это как-то кривенько (хотя если заработает, то и хрен с ним). И вообще, интересно, как Next эту свою черную магию делает - нагуглить, почему состояние не сохраняется между запросами не получилось, и пока не настолько отчаялся, чтобы ковыряться в исходниках.

  • @VB-s4p
    @VB-s4p 9 หลายเดือนก่อน

    Спасибо за обзор. Подскажите, какой плагин отвечает за предложение вариантов кода (серым цветом), которое появляется при начале создания функции итд. Видел похожее поведение и в vscod.

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Это стандартный complete плагин NVChad

    • @VB-s4p
      @VB-s4p 9 หลายเดือนก่อน

      @@PurpleSchool спасибо

  • @proletarian
    @proletarian 9 หลายเดือนก่อน

    Вообще не по теме но всё же, у меня в ARC на многих популярных сайтах не работает голосовой ввод, жму микрофончик, даю разрешение и ничего, в гугл переводчике к примеру сразу же выпрыгивает уведомлении о том что отсутствует интернет, вот хотел спросить это только у меня такое или это проблема браузера?
    P.S. работает только в TH-cam

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Не пользуюсь голосовым вводом, потому не подскажу(

  • @llwebstylell242
    @llwebstylell242 9 หลายเดือนก่อน +8

    Я единственный кто не увидел убийцу реакт роутера ?) видос просто не о чём)

    • @StarkElessar
      @StarkElessar 9 หลายเดือนก่อน +2

      полазил по доке этого роутера, и не понял зачем оно мне нужно)) Когда react-router просто идеально покрывает мои нужды)

    • @llwebstylell242
      @llwebstylell242 9 หลายเดือนก่อน +1

      @@StarkElessar я в доках не лазил, видео глянул - мне хватило понять, что реакт роутер, может всё тоже самое что и тан-стак роутер, так что какой смысл изучать тан-стак роутер - хз

    • @man-jj7rc
      @man-jj7rc หลายเดือนก่อน

      что-то не понятно как схемы search params валидировать нормально в react router , в tanstack router изи

  • @undertale-15075O
    @undertale-15075O 9 หลายเดือนก่อน

    Сколько нам ждать обзор на Nuxt

  • @fedordostoevskiy4209
    @fedordostoevskiy4209 9 หลายเดือนก่อน +1

    На этом канале одни убийцы каждую неделю)

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Триллеры показываем)

  • @iGotton
    @iGotton 9 หลายเดือนก่อน +1

    +

  • @jessrabbitxt
    @jessrabbitxt 9 หลายเดือนก่อน +1

    Запили видос vue vs react в 2024)

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน

      Я не такой активный пользователь Vue

    • @chirkov
      @chirkov 9 หลายเดือนก่อน

      Епт нравится синтаксис vue - используй vue, нравится синтаксис react - используй react.
      Но имей в виду что плагины новые и современные выходят чаще на реакт.
      Вакансий на реакте больше примерно в 4 раза и 3 года назад было примерно так же

    • @jessrabbitxt
      @jessrabbitxt 9 หลายเดือนก่อน

      @@chirkov поэтому и нужен видос, потому что это очень плохое сравнение.

  • @xice111
    @xice111 9 หลายเดือนก่อน +3

    Опять наш нитакуся пытается выбрать не трендовый стек

    • @PurpleSchool
      @PurpleSchool  9 หลายเดือนก่อน +3

      Я не пытаюсь выбрать, я обозреваю новинки, чтобы вы принимали взвешенное решение при выборе стека

  • @АлексейСтепанов-к9о
    @АлексейСтепанов-к9о 9 หลายเดือนก่อน

    И преимуществ танстэк роутера перед реакт роутером не раскрыто и видео занудно снято…