Learn REST Architecture in 8 Simple Steps:
🧵👇
🧵👇
1. Traditional System
The web app use to contain UI+Data together.
Eg:
When we load the application it is used to load HTML, CSS, Pull data from the server, Images etc.
If data on the web page changes after some time, we needed to refresh the whole page again.
The web app use to contain UI+Data together.
Eg:
When we load the application it is used to load HTML, CSS, Pull data from the server, Images etc.
If data on the web page changes after some time, we needed to refresh the whole page again.
2. The Problem
Loss of Bandwidth and slow response.
UI and Data are tightly coupled together.
Eg:
We cannot reuse the same backend for the Mobile client as mobile has a different UI.
Loss of Bandwidth and slow response.
UI and Data are tightly coupled together.
Eg:
We cannot reuse the same backend for the Mobile client as mobile has a different UI.
3. REST Architecture
REST stands for "REpresentational State Transfer"
It talks about an architecture where the client and server are separated from each other and a single server can cater to multiple clients.
REST stands for "REpresentational State Transfer"
It talks about an architecture where the client and server are separated from each other and a single server can cater to multiple clients.
4. How REST Works?
The front-end takes care of UI, and the back-end takes care of only Data.
The backend only responds with data and based on it frontend visualizes it on UI.
Backend supports formats i.e. JSON, XML, etc. to cater to multiple clients.
The front-end takes care of UI, and the back-end takes care of only Data.
The backend only responds with data and based on it frontend visualizes it on UI.
Backend supports formats i.e. JSON, XML, etc. to cater to multiple clients.
5. Request in REST
The request should be Stateless.
Each request should be independent of the other and each request should carry user authentication-related information i.e. token.
The request should be Stateless.
Each request should be independent of the other and each request should carry user authentication-related information i.e. token.
6. URI in REST
Communication in REST is only done via HTTP or HTTPS.
Everything in REST is treated as a "Resource" and those resources can be accessed via "URI" - Unique Resource Identification.
Communication in REST is only done via HTTP or HTTPS.
Everything in REST is treated as a "Resource" and those resources can be accessed via "URI" - Unique Resource Identification.
7. HTTP Methods
To perform common operations on "Resource" we use standard HTTP methods
To "Create" Resource - POST
To "Retrieve" Resource - GET
To "Update" Resource - PUT/PATCH
To "Delete" Resource - DELETE
To perform common operations on "Resource" we use standard HTTP methods
To "Create" Resource - POST
To "Retrieve" Resource - GET
To "Update" Resource - PUT/PATCH
To "Delete" Resource - DELETE
8. REST Example
We've got a web application running on "abc. com".
And we've got students in our application as "Resource".
To operate on Student Resource we'll have a separate "URI".
We've got a web application running on "abc. com".
And we've got students in our application as "Resource".
To operate on Student Resource we'll have a separate "URI".
8.a. GET Method
To get all students resources we will use URI:
Method: GET
URI: http://abc .com/api/students
To get single student resource we will use URI with student Id:
Method: GET
URI: http://abc .com/api/students/1
To get all students resources we will use URI:
Method: GET
URI: http://abc .com/api/students
To get single student resource we will use URI with student Id:
Method: GET
URI: http://abc .com/api/students/1
8.b. POST Method
To create new student resource we will use below URI:
Method: POST
URI: http://abc .com/api/students
Request: {name: '', age:'', ...}
To create new student resource we will use below URI:
Method: POST
URI: http://abc .com/api/students
Request: {name: '', age:'', ...}
8.c. PUT Method
To update a student we will use below URI with Id:
Method: PUT
URI: http://abc .com/api/students/1
Request: {name: '', age:'', ...}
To update a student we will use below URI with Id:
Method: PUT
URI: http://abc .com/api/students/1
Request: {name: '', age:'', ...}
8.d. DELETE Method
To delete a student we will use below URI with Id:
Method: DELETE
URI: http://abc .com/api/students/1
To delete a student we will use below URI with Id:
Method: DELETE
URI: http://abc .com/api/students/1
That's the wrap!!
Namaste, I'm Vikas!
I write a thread every Mon, Wed & Fri on Fullstack Development.
To read all my future threads follow @vikasrajputin
Namaste, I'm Vikas!
I write a thread every Mon, Wed & Fri on Fullstack Development.
To read all my future threads follow @vikasrajputin
جاري تحميل الاقتراحات...