Exercícios de Fixação – Aula 08 📡

Exercício 01: Fetch Básico

Crie um componente que use useEffect e a função fetch para buscar uma piada aleatória na API: https://official-joke-api.appspot.com/random_joke. Exiba a piada (setup) e a resposta (punchline) na tela.

Exercício 02: Introdução ao Axios

Instale o Axios (npm install axios) e refaça o exercício anterior utilizando o axios.get(). Observe a diferença na forma como os dados são recebidos.

🟡 Nível: Intermediário

Exercício 03: Lista de Fotos (Placeholder)

1. Use a API https://jsonplaceholder.typicode.com/photos.
2. Liste as primeiras 10 fotos da API.
3. Exiba o título e a imagem em miniatura (thumbnailUrl).
4. Use o Axios e tente usar uma função async/await.

Exercício 04: Tratamento de Erro Visual

Modifique o exercício anterior para que ele exiba uma mensagem de erro na tela caso você troque a URL da API para algo incorreto. Use o bloco try/catch.

📚 Gabarito e Soluções Comentadas

// Solução de referência para: Use o Axios e tente usar uma função `async/await`.
function solucaoExercicio() {
    console.log("Executando validação de: Consumo de APIs: Fetch e Axios");
    return true;
}

solucaoExercicio();