100%

Some refactored API live coding

✓ Published2🌍 Public

Last edited Oct 27, 2020

Created on Oct 22, 2020

This example demonstrates a live-coded workflow for inspecting and cleaning data from the Dutch government’s open-data API for road traffic information, accessed via the `fetch` API. It fetches JSON from the RDW endpoint, extracts values from a specified column (`areaid`), and then logs unique values and filters entries containing “WEST” using standard JavaScript array methods. The code shows a step-by-step refactoring process, with console output at each stage, but does not render a visualization. It uses no external libraries, relying solely on native JavaScript functions like `Set` for deduplication.

AI-generated description

A livecoded example on an API

Refactor code
Inspect data
Get unique values for a certain column

MIT Licensed

Similar vizzes

Loading thumbnail…

Some refactored API live coding

This example demonstrates a live-coding workflow for inspecting and cleaning data fetched from the Dutch RDW open-data API (`https://opendata.rdw.nl/resource/t5pc-eb34.json`). It fetches the raw JSON using the `fetch` API within an `async` function, then maps results down to a single selected column (`areaid`). With the filtered array, the code logs all data, a single record, and the cleaned column values, then uses a `Set` to list unique entries and filters for values containing "WEST". The visualization is limited to console output, with no graphical rendering.

Ddavidvanr21

88% match

Loading thumbnail…

Live API coding for fame

A live-coded API exploration fetches Dutch parking location data from the RDW open-data endpoint and prints it to the console. The example filters the JSON response by a selected column, computes unique values for area and usage identifiers, and counts empty strings within the area IDs. It uses JavaScript’s native `fetch` function and a set of custom helper functions for data manipulation, all in plain code without external visualization libraries.

RRobert Spier

80% match

Loading thumbnail…

Live API coding for fame

This example demonstrates the process of live-coding an API data exploration workflow, fetching parking location data from the RDW opendata endpoint and inspecting its structure. It retrieves the JSON response, extracts values from selected columns like `areaid` and `usageid` using JavaScript array methods, and logs unique values to the console. The code also counts occurrences of empty strings within the `areaid` field, showcasing basic data quality checks. It relies on the browser’s native `fetch` API and plain JavaScript functions for filtering, deduplication, and counting, with no external visualization libraries involved.

VVictor Boucher

80% match

Loading thumbnail…

Live API coding for fame

This example demonstrates live API coding for fame, fetching parking location data from the RDW Open Data endpoint (`https://opendata.rdw.nl/resource/t5pc-eb34.json`) and logging it to the console. It retrieves all records, then uses custom filtering and utility functions to extract and analyze values from the `areaid` and `usageid` columns. The code highlights unique values in those columns and counts empty strings in area IDs, showing how to programmatically explore a public dataset through JavaScript's `fetch` and JSON handling.

NNathan

79% match

Loading thumbnail…

Live API Coding - By Laurens

This example fetches live data from the RDW Open Data API using the `fetch` function, starting with the endpoint `https://opendata.rdw.nl/resource/t5pc-eb34.json`. It retrieves the JSON response, logs the full dataset and the first record, and then applies a custom `filterData` function to extract all values for the `areaid` column. The code also defines a `listUnique` function to identify unique values in an array, though it is not called in the visible flow. The page itself is minimal, with no visual output—only console logging and basic HTML/CSS styling.

Ddavidvanr21

78% match

Loading thumbnail…

Live API coding for fame

This example demonstrates how to fetch and explore parking-location data from the RDW open-data API, logging unique area and usage identifiers to the console. It uses the Fetch API to retrieve a JSON endpoint (`https://opendata.rdw.nl/resource/t5pc-eb34.json`), then maps over the objects to extract values from specific columns. Custom functions filter the data, list unique values, and count empty strings, revealing data-quality issues and the diversity of geographic regions and usage types.

LLaurens

78% match

Loading thumbnail…

Live API + d3 coding for fame

This example fetches live parking location data from the RDW open data API and processes it using custom JavaScript functions. It loads JSON from the endpoint `https://opendata.rdw.nl/resource/t5pc-eb34.json`, extracts values from columns such as `areaid` and `usageid`, and lists unique values or counts empty entries in the arrays. The page displays a large text label reading "Hello Js" and relies on a bundled script (`bundle.js`) with no D3 or other visualization library; it only demonstrates API fetching and array manipulation.

LLaurens

78% match

Loading thumbnail…

live API coding for fame

This example demonstrates a live, step-by-step coding session that fetches parking location data from the RDW Open Data API and explores its structure. The code retrieves a JSON dataset via the `fetch` API, extracts specific columns such as `areaid` and `usageid`, and logs unique values and counts of empty strings to the console. The page itself displays a simple "Hello API" message. It shows how to work with asynchronous data loading and array manipulation in vanilla JavaScript without visualization libraries.

SSimonPlanje

76% match