What is API - Frontend and Backend Connection

What is API

API full form is Application Programming Interface.

API is very important for building big projects in Angular, React, Vue, etc.

Without API knowledge, it is not possible to build a proper project.


Why API is Needed

JavaScript and its frameworks cannot directly connect to the database.

JavaScript code runs in the browser, not on the server.

Database is always on the server.

So, API is used to connect:

  1. Frontend (browser)
  2. Backend (server + database)


How API Works

Backend languages like:

  1. Node.js
  2. Java
  3. Python
  4. PHP

run on the server and connect to the database.

They fetch data from the database and convert it into JSON format.

This JSON data is sent to the frontend using API.

JavaScript easily understands JSON.


API as a Bridge

API works as an interface between frontend and backend.

Flow:

  1. Database
  2. Backend (Node / Python / Java)
  3. API
  4. Frontend (Angular / React / Vue)

Frontend uses API to get data and display it.


Why Not Build Everything in Backend Only

Backend websites are:

  1. Slower
  2. Not single-page
  3. Page reloads again and again

Modern applications are built for:

  1. Web
  2. Mobile apps (Android, iOS)

One API can be used for:

  1. Web application
  2. Mobile application
  3. Desktop application

Backend is written once, frontend can be built many times.


Frontend and Backend Meaning

Frontend:

  1. Browser
  2. Mobile applications

Backend:

  1. Server-side code
  2. Database

API connects both.


Main Use of API

API is used to:

  1. Get data from backend
  2. Send data to frontend
  3. Share data between backend and frontend