Http Flashcards
1
Q
Pacote Json Server
A
Api Fake
1- npm i json-server
2 - cria uma pasta/file data/db.json
3 - colocar um objeto com dados nessse objeto
4 - vai em pack.json area scripts e add:
“server”:”json-server –watch data/db.json”
5 - no terminal execute: npm run server
6 - para acessar localhost:3000/chaveDoJsonDB
2
Q
hook useEffect
A
- Garante que determinada ação só executa uma vez.
- Controle a atualização de variáveis de estados, executando a função sempre que o estado mudar.
- O hook useEffect estará presente sempre nas requisições assíncronas
3
Q
realizando requisição com fecth API
A
useEffect(()=>{ async function buscar(){ const data = await fetch(url).json(); console.log(data); } buscar() },[])
4
Q
por que usamos o useEffect nas requisições http
A
estudar
5
Q
realizando post com fetch api
A
const res = await fetch(url,{ method:"POST", headers:{ "Content-Type":"application/json", }, body:dados })
6
Q
custom hooks para o fetch
A
- Podemos dividir funções que podem ser reaproveitadas em hooks
- Customs Hooks Geralmente ficam na pasta hooks
- Devem utilizar o padrão useNome
7
Q
Criando o custom hook useFetch
A
//Basta criar uma funcão no formato export const useRequisicaoGet = (url) =>{ const [data, setData] = useState([]); //como vou fazer uma requisição http get então preciso colocar dentro do useEffect para controlar o efeito colateral useEffect(()=>{ const buscar = async () =>{ const res = await fetch(url); const json = res.json(); setData(json); } buscar(); }) return {data} }
8
Q
usar o custom hook
A
import { useRequisicaoGet } from './hooks/useRequisicaoGet " const {data} = useRequisicaoGet (url);