Demystifying Web Jargons Part - 2
Tags: codenewbie, webdev, database
Published: 2021-07-04 10:58:48


Welcome to the second part of my demystifying web jargons series. If you have not checked the first part, you can do so from here
[Demystifying Web Jargons Part - 1](https://dev.to/_mohanmurali/demystifying-web-jargons-part-1-1364)

 Today we will be covering the below topics. 
 

 - API
 - DOM
 - Web Service 
 - Database

So let's start straight away.

### API

API stands for _Application Programming Interface_. According to Wikipedia “_an API is a type of software interface, offering a service to other pieces of software_”. Let's try to understand this definition by breaking it down. First of all, it's a software interface, which means it is a bridge that allows the software to talk to another software. Unlike a graphical user interface (GUI), which allows a person to communicate with a computer or a computer program, an API is not designed to be used by common people. It is specifically designed to be used by a software of software developer.
	The second line state that it offers services to other software. That means it allows others programs to talk to software through certain methods. These methods are called the _endpoints_ or _API methods_ that the API is said to _expose_ to the outer world. This is one of the purposes of API, which is to hide the underlying implementation of a program. When a program uses these exposed methods it is said to _consume_ the API method or endpoint.

![API image](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/z0u92vccvenje6abppuv.png)

### DOM

We now know that the browser renders a webpage with the help of HTML (check part 1 of this post for details). HTML along with CSS allows us to create beautiful web pages. But if you see any modern websites, you will notice that they allow users to interact with them in multiple ways other than just navigating from one page to the next. This capability to be interactive with the user is done using javascript which is a programming language (although nowadays you can also use web assemblies to achieve this). But to interact with an HTML element javascript will need to understand and parse HTML in a way that makes it easy for it to work with it.

The browser engine converts the HTML document to a tree structure, wherein each node is an object representing a part of the document. Each branch of the tree ends in a note. This Tree structure is called _Document Object Model or DOM_.

The DOM API exposes methods that allow programmatic access to the tree and one can change the structure, style, and/or content of the HTML document using these APIs. They also expose APIs, that allow us to attach _Event handlers_ to the DOM nodes. An _Event Handler_ is a function that is triggered when a certain event is fired. An event can be any of the inputs even like a mouse click or button press. There are various events available for us to work with. Using these _Event Handlers_ It becomes possible for us to build an interactive website.

![DOM tree](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/dqie9v5ooxhbny9og95k.jpg)

  

### Web Service

  

An interactive site is not very useful if it doesn't have any data. Every site needs data from the server. A _web service_ is an API through which a client or another server can talk to a server. A web service can be called from a client or another server. It allows us to communicate with other devices through the world wide web. In other words, a web service is an interface that allows us to communicate over the internet by transferring data.

  

![Web Service](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/n7e7784cjlw2pnshcigw.png)

  

### Database

  

Now we got the data from the client, but this data needs to be stored somewhere. Storing data is a complex and sensitive task. Over the internet, data is everything. A small data inconsistency might be the doom of a company if not worse.

A _Database_ is a special server dedicated to storing and updating data. A database is usually controlled by a _database management system (DBMS)_. There are Primarily two kinds of databases.

1.  Relational Database
2.  Document Database

  

### Relational Database

  

Relational database stores the data in an optimized fashion, to minimize the duplicate storing of the data, by splitting the data and storing them into different tables. When we need to manipulate this data, we need to connect these tables and update the data. This is a complex task and usually performed by using _Structured Query Language_ or _SQL_. SQL is used by almost all relational database management systems for handling the connected or relational nature of the tables. Since the data is split and stored in multiple tables, the data needs to be looked up and fetched from multiple tables. Due to this, a relational database tends to be a little slower in its capacity to read and write data.

![Relational DB](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/w429urpoz85ez5svip2z.png)

  

### Document Database

  

A document database stores the data in unstructured documents or collections. These database systems do not depend on tables and hence they don't need special language like SQL to work with the data. They are also extremely fast in their reads and writes as they don't need to look up and connect multiple tables. The drawback of a document Database is that since they store data in unstructured form, the data is often duplicated and hence they require more space. In a way, document databases are similar to the traditional storage of data in a paper document.

![Doc DB](https://dev-to-uploads.s3.amazonaws.com/uploads/articles/tw861jqaylcwesolmiku.png)