React Query v4 | Paginação (Tutorial)

[@alexnascimento8435]

Caí aqui de paraquedas e esse foi o vídeo mais completo de react query que já vi, rsrs. Acabei refatorando muita coisa aqui em meus projetos. Obrigado por isso!

[@Coffstack]

Valeu Alex. Que bom que curtiu!

[@SidneiMV]

cara.. peguei aquele teu video de React Query - com a mock.api - e depois implementei um CRUD completo com base nele e até algumas validations. Agora vou implementar essa parte de paginar que você tá mostrando aqui e vai ficar dez!! valeu demais man!! show de bola! massa!!

[@SidneiMV]

nossa.. viajei kkkkkk mock.api aceita mutation mas nao pagina e essa api do rickmorty pagina mas nao aceita mutation kkkk 😅🤣😅🤣😅😅OU SEJA nao dá pra condensar tudo - CRUD e paginar - usando a mesma api

[@Coffstack]

Valeu Sidnei! Que bom que os vídeos te ajudaram. É difícil achar API de teste que aceite as duas coisas ao msm tempo. Geralmente só API de um peneiro real

[@wevertonsantiago4305]

Preciso nem assistir que já chego com curtida e comentário 😂 Irá ser um excelente vídeo. Obrigado por compartilhar!

[@Coffstack]

Valeu Weverton! hahaha Tamo junto!

[@luccarauedys]

Que aula sensacional, ajudou demais! Valeu, Lucas!

[@Coffstack]

Disponha!

[@Manuelsembola]

Showww, Cara me ajudou muito sua paginação e muito melhor que minha! Antigamente ou jogava o numero da pagina no params e seguida ele recarregava o component com numero da pagina! Agora somente vou fazer desse jeito. Valeu Cara !😅😆

[@Coffstack]

Valeu Guilherme! Que bom que o vídeo te ajudou, tamo junto!

[@Gabriel-x6k2t]

muito bom mano!

[@Coffstack]

Valeu, fico feliz que tenha gostado!

[@brunno_gonzalez_dev]

🔥🔥🔥🔥🔥 Boooooa mestre!! valeuuu

[@Coffstack]

Valeu Brunno!! Tamo junto!

[@leonardomotta150]

Muito bom mesmo, super explicativo

[@Coffstack]

Valeu Leonardo, que bom que curtiu, tamo junto!

[@imdevbutok]

Essa libe é sensacional. Valeu pelo vídeo man. Trás um fazendo scroll infinito

[@Coffstack]

Vou trazer com certeza, React Query é top demais!

[@tricoto8509]

Quando quiser simular um delay em api é só configurar no devtools do navegador na aba network tem uma opçao onde você pode colocar slow 3g

[@eduardokohn9134]

Muito bom ! Não conhecia e gostei bastante. Da pra usar no React Native de boas ? Sugestão de vídeo: React Native Paper !

[@Coffstack]

Da sim! Já usei em vários projetos!

[@luigginosa809]

muito obrigado cara de verdade

[@Coffstack]

Valeu Luiggi, obrigada você por acompanhar o canal!

[@saulloalmeida2080]

Ótimo video! Poderia dar um exemplo também de quando as API's não são paginadas?

[@Coffstack]

Hmmm fica meio complicado fazer paginação quando isso não está especificado na API, não vejo uma forma de fazer isso.

[@crowbr]

Muito bom e se API não estiver paginada como faz?

[@Coffstack]

Não tem muito o que fazer, qualquer implementação no frontend vai ser gambiarra. Paginação tem que vir da API.

[@pablonunes6723]

Rola um vídeo sobre responsividade no react Native ??? Pfvr 😉

[@Coffstack]

Esse é um dos mais pedidos, to pra fazer aqui. O que você gostaria de ver sobre responsividade, consegue ser mais específico ?

[@pablonunes6723]

@@Coffstack Gostaria de saber sobre: pixel ratio, fontscale, acho que poderia falar sobre flexbox e se tem alguma lib que possa facilitar nossa vida nesse sentido.

[@Coffstack]

@@pablonunes6723 obg pelo feedback, vou estruturar um vídeo pensando nesses pontos!

[@luismartins589]

Faz um vídeo explicando quanto cobrar por projeto

[@Coffstack]

Fala Luis, excelente ideia! Realmente muita gente me pergunta sobre isso.

[@KamaitachiNoPiano]

Ensina a fazer infinity scroll com useInfiniteQuery pfvvv

[@Coffstack]

Ah esse é o próximo tópico que vou trazer aqui sobre React Query! Em breve!

[@SidneiMV]

só uma question: é possível definir um "tamanho de página"? tipo, quero 10 cards, 16 cards, algo assim, em cada página..

[@Coffstack]

Se a API permitir essa customização, da sim. Só passar mais um parâmetro pra função que faz a chamada a API. Algo como getCharacters(page, limit) no caso o limit vai determinar quantos items vem por página.

[@SidneiMV]

@@Coffstack joia! tks

[@SidneiMV]

ahh mais uma question.. a última! tentei fazer funcionar um botao "Início da Lista", ou seja, ir diretamente para a página 1, mas nao tá funcionando. entra em loop. alguma sugestao?

[@SidneiMV]

já resolvi! não conseguia fazer funcionar com o button de página inicial no App entao coloquei o button direto no componente de Lista onde é feito o get e controle de paginacao. daí funcionou tranquilo

[@danilojose7370]

Meu Deus, pq nng me apresentou isso antes 😢

[@Coffstack]

hahahaha Tive esse mesmo sentimento sobre o Rect Query, vou trazer mais vídeos sobre ele aqui!

[@Manuelsembola]

Galera, Achei um situação gostaria de compartilhar no meu contexto. seguir o video e implementei a paginação no meu projeto! Observerm no video o lucas usar modais para editar a lista de personagens, no meu caso eu envés de usar um modal, minha aplicação troca da pagina por exermplo :"personagem/editar/:id" no entanto ao editar um personagem a aplicação volta novamente para a primeira pagina e não a pagina do personagem editado! bom eu resolvi isso com o sessionStorega guardando o numero da pagina do item editar em cache,ao voltar ele voltar para a mesma pagina do personagem editado. Sei que tem formas melhores de resolver, mas foi a primeira forma que veio na minha mente. Estou somente compartilhando uma situação que aconteceu comigo, pode acontecer no contexto de voces também!

[@jhowazvdo]

Show, geralmente eu guardo a paginação como query params na url, sendo assim quando eu volto da tela de edição eu uso um navigate(-1) e volta a URL anterior com a pag salva.

[@Manuelsembola]

@@jhowazvdo eu também fazia dessa em projetos antigamente!