Módulo 1 · 4 de 7

JSON: o idioma que as APIs falam

Leitura: ~5 min

Na página anterior, você viu que APIs fazem pedidos e recebem respostas. Mas em que formato essa resposta vem? Não é um texto corrido, nem uma planilha, nem um PDF. A grande maioria das APIs usa um formato chamado JSON. E a boa notícia: ele é bem mais simples do que parece.

O que é JSON?

JSON significa JavaScript Object Notation, mas não se assuste com o nome. Apesar de ter "JavaScript" no nome, JSON não é código. É só um formato de texto organizado para representar dados. Pense nele como uma ficha cadastral digital.

Olha esse exemplo, os dados de um usuário que uma API poderia retornar:

{
  "name": "Ana Silva",
  "email": "ana@email.com",
  "followers": 1240,
  "verified": true
}

Repare na estrutura: é uma lista de pares. Do lado esquerdo, entre aspas, fica o nome do campo (o "quê"). Do lado direito, o valor (o "conteúdo"). Texto vem entre aspas, números ficam sem, e true/false representam sim/não.

Pense comigo: você consegue olhar esse JSON e entender o que cada dado significa, mesmo sem saber programar. O nome é "Ana Silva", o email é "ana@email.com", ela tem 1240 seguidores e é verificada. É legível assim.

JSON pode ter listas e objetos dentro de objetos

Na vida real, os dados são mais complexos que uma ficha simples. Um usuário tem posts, cada post tem comentários, cada comentário tem um autor. JSON lida com isso usando listas (arrays) e objetos aninhados:

{
  "name": "Ana Silva",
  "bio": "UX Designer na TechCorp",
  "social": {
    "linkedin": "linkedin.com/in/anasilva",
    "portfolio": "anasilva.design"
  },
  "skills": ["Figma", "Research", "Design Systems"],
  "posts": [
    {
      "title": "Meu primeiro case de UX",
      "likes": 42
    },
    {
      "title": "Design tokens na prática",
      "likes": 128
    }
  ]
}

Vamos traduzir o que está acontecendo:

  • "social" é um objeto dentro do objeto: tem seus próprios campos (linkedin, portfólio)
  • "skills" é uma lista (marcada com colchetes [ ]): contém vários itens do mesmo tipo
  • "posts" é uma lista de objetos: cada item tem seus próprios campos (title, likes)

Parece complicado? Respira. A lógica é sempre a mesma: chaves { } abrem um objeto, colchetes [ ] abrem uma lista. O resto é campo e valor.

Por que JSON importa para você?

Você vai encontrar JSON em vários momentos da sua carreira:

  • Quando um dev mostra a resposta de uma API : o que aparece na tela é JSON. Agora você sabe ler.
  • Quando você testa uma API no navegador : como fizemos no exercício com o JSONPlaceholder. Aquela resposta era JSON.
  • Design tokens : no Módulo 4, você vai ver que tokens podem ser exportados como JSON. A mesma estrutura.
  • Configurações de ferramentas : muitos plugins de Figma, configs de projetos e MCPs usam arquivos .json.

Você não precisa escrever JSON. Mas saber ler é como saber ler uma planta baixa, você não constrói a casa, mas entende o que está sendo construído.

Checagem rápida

Sem nota, sem pressão. Responda de cabeça e depois abra para conferir.

Em um JSON, como você diferencia um valor de texto de um número?

Texto vem entre aspas ("Ana Silva"); número fica sem aspas (1240). E true/false, também sem aspas, representam sim/não.

Verdadeiro ou falso: para ler um JSON você precisa saber programar em JavaScript.

Falso. Apesar do nome (JavaScript Object Notation), JSON é só um formato de texto organizado, como uma ficha de cadastro. Você lê sem escrever uma linha de código.