Have you ever thought about BTS - no I am not talking about the boy band but we sure must have thought about them once :P - I am talking about the BTS of how website works. There are three key parts to it - Frontend - Backend and API.
Overview -
A website is like a digital machine which has a User Interface (that we see infront of us, interact with) or as we say front end,the brain (which is where the logic is written) - backend and lastly the mediator between the frontend and the backend - API (Application User Interface).
What is Frontend?
In simple terms, if you are reading this article, everything you see and interact with on this website—from colors, fonts, and buttons to images and layouts—is part of the frontend. It is created using HTML, CSS, and JavaScript (JS) (might cover these 3 in diff. article or you can look up in the net for now. :) ) These technologies define the structure, style, and interactivity of a webpage.
What is Backend?
The backend is like the brain of a website, where the logic is written to make the frontend function as intended. It manages how the website operates, handles data, and ensures everything runs smoothly. Think of it as the engine of a car—it powers the website and makes it work. The logic can be written in various programming languages such as Python, Java, C#, PHP, JavaScript, Golang, C++, SQL, Kotlin, Ruby, etc and language most commonly used to manage data in the backend is SQL (Structured Query Language) (e.g., MySql, MS-SQL, MongoDB etc )
What is API?
API stands for Application Programming Interface. It acts like a bridge between the frontend and the backend. To explain with a simple example - imagine going to a restaurant: you don't directly go to the kitchen to place an order. Instead, a waiter takes your order, communicates it to the kitchen, and brings back your food. Similarly, an API takes requests from the frontend, communicates with the backend, and returns the data to the frontend.
In technical terms:
The frontend sends a request to the backend through an API.
The backend processes the request, fetches the necessary data, and sends it back through the API.
The frontend then displays the data to the user.
For example, when you search for something on a website, the frontend sends a request via an API to the backend to fetch the search results. That's how APIs work. Thats how API works.
- Now bringing all of them into a single picture -
You go to website (front-end) and interact with it. If you request specific information,
The front-end send the request to the API.
The API then communicates with the back-end with your request and fetches the information according to your request.
The back-end sends the data back through the API to the front-end.
The front-end then displays your requested data on the screen.
Conclusion -
In summary, the front-end, back-end, and APIs are like the different parts of a car working together to give you a smooth ride. The front-end is what you see and interact with, the back-end is the engine making everything run, and the APIs are the messengers that connect the two. Now you know the BTS of a website!