ausdata.io

Chart Australian CPI with React and Recharts

Fetch the CPI series and render a YoY line chart in a React component.

Steps

  1. 1Fetch in a server function.
  2. 2Compute YoY change.
  3. 3Pass to LineChart.

Code

cURL
curl https://api.ausdata.io/v1/data/abs/cpi \
  -H "Authorization: Bearer YOUR_KEY"
Python
import requests
r = requests.get(
    "https://api.ausdata.io/v1/data/abs/cpi",
    headers={"Authorization": "Bearer YOUR_KEY"},
)
print(r.json())
JavaScript
const r = await fetch("https://api.ausdata.io/v1/data/abs/cpi", {
  headers: { Authorization: "Bearer YOUR_KEY" },
});
console.log(await r.json());

Watch out for

  • Hydration mismatch is the most common bug. Render the chart in useEffect or a client-only component.

Related

Try it now

500 free calls per month. No credit card.

Get a free API key