Use code completion for your custom JSON format in just 1 minute

JM Robles
3 min readNov 22, 2020

TL;DR: How you can to enable the code completion for your Visual Studio Code IDE

JSON Schema rules!

Motivation

The code completion is one of the most worth and important features of an IDE. Since the first version of Visual Basic or Visual C++, the presence of “IntelliSense” feature improved the productivity of thousands of programmers.

Normally, to create a custom code-completion bundle for your favorite programming or scripting language is a non trivial task.

But in the case of JSON formats, that task is not so hard.

The JSON Schema

As you probably knows the JavaScript Object Notation (JSON) is a structureless format.

You can define whatever properties, arrays, etc.

The JSON schema enters to add schema to specify a custom JSON format for a specific payload.

We’ll not go into the details, just say that a JSON schema is another JSON file where we describe the properties and types about our objects.

In the following example, we define the types and required element of a JSON object to specify a calendar data type.

You can check how easy it is to define a data type using this scheme.

Here it’s important the meta-properties, named with the prefix “$”. With “$ref” we can reference others JSON schema in order to build complex types using schema recursivity.

How a JSON schema is referenced?

In order for your IDE to know the schema that your JSON object must comply with, you just have to include the meta-property $schema with the URI where said schema resides.

Continuing with the previous example, if I’m specifying a new calendar JSON, just I need to add a line like to:

{
$schema: './schemas/calendar.json'
...
}

--

--

JM Robles

Backend / Platform engineer #go #python #kubernetes #terraform #devops