JSON Crash Course
Tags: javascript, api, webdev, beginners
Published: 2022-09-12 00:08:48

Hello Techies, how is it going?
I know most of us use "JSON", but at the same time most of us don't know what it really means and how to use it best.
In this article, I will explain what JSON really is and how to use it best.

## Introduction
The term "JSON" stands to "Javascript Object Notation". JSON is a lightweight data format that stores data in human-friendly key-value pair structure. It is mostly used to interchange data between different servers or clients.

## Advantages of JSON
1. It is light.
2. It uses key-value pair to store data.
3. More human readable.
4. Have native support in multiple programming languages.
5. Multiple data types supportes.
6. Nested values allowed

## Datatypes in JSON
JSON can represent data of 6 different types, the key must be enclosed in double quotes(`""`), below is an example of a JSON code :
```json
    {
        "name" : "Femi Fatokun",
        "age" : 0,
        "isAsleep" : false,
        "wifeName" : null,
        "hobbies" : [
            "Cooking", "Football", "Coding"
        ],
        "address" : {
            "country" : "Nigeria",
            "state" : "Kaduna",
            "lg" : "Kaduna South",
            "street" : "Dummy Street"
        }
    }
```
1. **String** : The `name` key in the code above represents a value of `string` type. The string datatype in JSON is very similar to most programming languages, but in JSON you can only create use double quotes(`""`) to represent a string.
2. **Number** : `age` in the code above represents a value of `number` type, the number type in JSON is most similar to that of `Javascript`. The number type represent `integers` like `10` and `floating point` number like `10.67847`.
3. **Boolean** : The `boolean` type in JSON is the same thing with most programming languages. It is can only contain 2 values, `true` or `false`. `isAsleep` in the code above is an example of a boolean.
4. **Null** : This datatype is represent data that is not available, it is different from `""` which represents an empty string. `wifeName` is an example.
5. **Array** : An array in JSON is very similar to arrays in most programming languages. An array is a list of object, this object can be any other datatypes including an array itself. An array also allows nesting. `hobbies` in the code above is an example of an array. Below is an example of an array with different datatypes and nested values.
```json
{
    "array" : [
        "string",
        10,
        true,
        null,
        ["One", "Two", "Three"],
        {
            "key" : "value"
        }
    ]
}
```
6. **Object** : We can refer to the `object` type as the JSON itself, object are used to store different datatypes in key-value pair format, they also allow nested values, below is an example : 
```json
{
    "object" : {
        "string" : "Hello world",
        "number" : 40.9,
        "boolean" : false,
        "n_a" : null,
        "array" : [
            "One", "Two", "Three"
        ],
        "nested_object" : {
            "key" : "value"
        }
    }
}
```
## JSON in popular programming languages( JS and PHP )
As I already mentioned earlier, JSON is natively supported in most programming languages, this means you don't need any external library to handle JSON data in most languages, below we will parse JSON in 2 popular programming languages, PHP and Javascript.

### **Javascript**
Javascript is one of the popular languages that has inbuilt support for JSON.
- Encoding : We can encode a javascript object literal or array to JSON
```javascript
//Javascript Object Literal
let object = {
    name : "Femi Fatokun",
    age : 20
};
//JSON Encoded Object
let encodedObject = JSON.stringify(object);
```
- Decoding : We can decode a JSON object or an array into a Javascript object literal or array.
```javascript
//JSON object
let object = `{
    "name" : "Femi Fatokun",
    "age" : 20
}`; 
//Javascript Object Literal
let decodedObject = JSON.parse(object)
```
### **PHP**
PHP also have built in support for JSON.
- Encoding : Below we will encode a php associative array to JSON.
```php
<?php
    //PHP associative array
    $object = [
        "name" => "Femi Fatokun",
        "age" => 20
    ];
    //JSON object
    $encodedObject = json_encode($object);
?>
```
- Decoding : Below we will decode a JSON object into a php associative array.
```php
<?php
    //JSON Object
    $object = '{
        "name" : "Femi Fatokun",
        "age" : 20
    }';
    //PHP associative array
    $decodedObject = json_decode($object, true);
?>
```
### Watch me demonstrate this on Youtube.
{% embed https://youtu.be/qpqfGT7c-5g %}