📘 Client Side
🔹 What is Client Side?
The client side refers to all the operations that happen on the user’s device, typically in a web browser or mobile app. This is the environment where the user sees, interacts with, and experiences the application.
🔹 What Happens on the Client Side?
-
Rendering HTML and applying CSS
-
Running JavaScript logic
-
Handling user interactions (clicks, input)
-
Making requests to the server (
fetch,XHR) -
Showing data received from the server
-
Caching/storing small data (
localStorage,cookies)
🔹 Example:
You open a website:
-
Your browser sends a request to a server.
-
The server sends HTML, CSS, and JS files.
-
The browser (client) builds the UI, runs JS, and responds to your actions — all of this happens on the client side.
🔹 Core Technologies:
| Tech | Role |
|---|---|
| HTML | Structure of the web page |
| CSS | Styling and layout |
| JavaScript | Dynamic behavior and logic |
| Browser APIs | Built-in functions for interaction, storage, etc. |
| Frameworks | React, Vue, Angular for building UIs efficiently |
🔹 Characteristics:
-
Executes in user’s browser
-
Visible and inspectable
-
Device-dependent (performance varies)
-
Doesn’t require internet for all actions (can work offline partially using Service Workers)
🔹 Related Concepts:
-
Server Side: Runs on backend (e.g., Node.js, Java, Python)
-
CSR (Client-Side Rendering): Entire UI is built on the client using JavaScript
-
SPA (Single Page Application): A type of web app that works entirely on the client side after initial load