What is JSON-LD? With Example -trickCode.in

Introduction to JSON-LD

JSON-LD stands for JavaScript object notation for linking data so you may have heard of Jason before because Jason is basically what we use to transmit data back and forth between websites and in browsers, link data is a fairly new term link data is basically a way of publishing data on.

The web such that it's interconnected between different websites so one website can refer to data on another website right so JSON-LD is an extension to Jason and it's most useful for people that are web developers or designers or anyone that transmits information back and forth between web browsers and web servers.

How as I said this is a fairly basic introduction so most people that are familiar with kind of the web and using a browser should be able to follow along in this tutorial now before we get into how JSON-LD works.

What it do we need to think about how the web works today right we have what's called a document-based web we have HTML documents that are sitting out there on the web servers that we can use to display.

We have this great little tool called a hyperlink to link from one document to another document.
website and we can also have multiple links coming into our website from the outside world so websites are really broken into two parts there's the front end which is basically.

Where we see all the HTML kind of coming into play so whatever we see on the web is typically HTML and JavaScript and that's really meant for humans there's another side of of the website which is meant mainly for computers and that usually serving up data in the form of Jason now Jason which stands for the JavaScript object notation is a way of expressing data it's both human-readable and machine.
Readable it's just kind of really simple property value type format so Jason is really easy for both computers to read and web developers to read HTML is meant for other people that are viewing the site typically all you see is the HTML you don't see the Jason coming in so when we talk about link data what we're talking about like I said was we want data to be linked between multiple websites so if you imagine these green little dotted lines or the borders between websites so this is one website this is another website and this is yet another website this data needs to reference data on another website and the way it does it through linked data is it does it through links the same way as the document based web does it so basically link data is a way of publishing your data so that people can reuse it and so your data joins all the other data on the web and it's and it becomes more useful to society as a whole now we've figured out how to publish data in HTML right so we use a technology called RDF a to publish data and RDF is basically a way of tagging the bits of the WebPages.

search engines and social networking sites and things of that nature so while people see the HTML pages and think and read the text and look at the pictures computers see something very different they see the data that's embedded in the web page.

Now while this is a solved problem for HTML we haven't really figured out how to do it in a standard way for Jason right and so that's kind of where JSON-LD comes and it proposes a standard way of expressing linked data in Jason now if we go back and we think about how we interact with websites.

how data served from websites typically you get a web page the JavaScript goes out to the website and requests data the data is transmitted as Jason and I said before the Jason is really simple key-value pairs right I mean you can kind of look at this and figure out kind of what's going on so the type is the person the name of this a person is Bob Bob's home page is this URL and so JSON is really good at being both human-readable and easily possible by machines the problem though is what happens when you start getting this data from multiple different websites right so let's say you've got one website another.

website another website all al throwing data at you don't really know if each one of these websites is using the name in the same exact way or using type in the same exact way right so there's the big problem when you start trying to mix and match JSON data is that there's an ambiguity problem right so let's look at this example to kind of show demonstrate the ambiguity problem so let's say that this is data.

website so view and this is data that another website served you one of them says the name is Bob the other one says this name is something that looks like a login name but the home page is the same for both of them so if we think about this data is probably related in some way but we don't really know how its related right so in this case, the developer probably means the name is like the person's first name in this case the developer probably means the name is like the login name or the user login name so we need to figure out a way to get rid of this ambiguity if we're going to be able to share data between multiple different websites now we can do that using what we've always done on the web which is using URLs to specify and be very specific.

We could give the property an entire URL to identify the property so when we say this type of the name then everyone knows oh then we're talking about a first name or this type of the homepage then we mean the person's homepage right now the problem with this is that it's really verbose no developer would ever want to develop with this kind of complexity what you ideally you want to do is you want to just use terms simple terms. so we want to be specific but we also want to be very concise with the JSON code that we're writing so, this is where JSON-LD comes in JSON-LD introduces.

this very simple concept it's called the context and what the context does is it tells the application how to interpret the rest of the data in the document so in JSON-LD you say my context is and then you give it a URL to a document somewhere out and out on the web and this document tells you exactly what name is exactly what homepage is right not only does the JSON-LD context tell you exactly what these properties are it also tells you what type of data should be associated with them so should it be a string or should it be a date or should it be a number or should it be a URL right so the most fundamental concept JSON-LD is this idea of giving your data context now if you zoom out for a second think about how we communicate as human beings almost every conversation that we have has some kind of context associated with it there's an environment.

 there's a situation in which the content of the conversation is taking place and when we say when we use words like oh I just saw Bob the other day the person that you're speaking with has context they know that Bob is shorthand for that person that both of you know right so you're you can be concise in the words that you're saying to whom you're conversing with but very specific at the same time of who talking about so the JSON-LD context basically gives context to your JSON data.

Now another really useful feature with JSON-LD is that it allows you to identify these objects right so not only is it important to just use very concise terminology when you're expressing data but it also helps that when you're talking about someone like Bob that you can identify them and then when anybody else wants to talk about Bob that they use Bob's identifier so we use URLs to identify things in JSON-LDand the way we do that is we use this handy ID keyword so the context tells us how to interpret name and homepage and the data that goes  along with name and homepage and ID. says this is this data's universal identifier on the web so if other people want to talk about Bob they can use Bob's URL and make statements other statements like Bob's age or Bob's current mood or Bob's hometown so there you want to keep in mind that JSON-LD does one it gives your document context - it makes it really easy for you to use short terminology in your in your document and three it allows you to give your data and identifiers and those things are the foundational layers of linked data now there's much more to JSON-LD.

for example, you can give your objects a type so you can tell the application I'm talking about a person or a place or a recipe or an event you can use different languages so if you wanted to express someone's name in Japanese or Mandarin or Spanish or French you could use language tags to do that you can be very specific about certain types of values you can say this is definitely, a date or this is a time or this is a unit of measure you can convert this the JSON-LD do something called RDF which is one of the fundamental models.

that we use to model linked data and there are other features like being able to reshape the data something called compassion and expansion and framing that allows you to modify JSON-LD documents to make it easier for your application to use that data so this tutorial is just the tip of the iceberg, there's much more than you can learn just search for JSON-LD and advanced concepts and you should be able to come across those so if you'd like to find out a bit more about JSON-LD or maybe even play around with the markup you can go JSON-LD org this site has a bunch of good starting tutorials and it also has something called a playground so it's a live JSON-LD editor that allows you to kind of mark up data and play.