Computer Science & Networking Fundamentals

Web Development Fundamentals

Before writing code, understand the physical wires, wire protocols, DNS lookups, TCP/TLS handshakes, and browser rendering engines that make software possible.

Networking & IP#1

How the Internet Works

A global distributed mesh of interconnected autonomous systems communicating via the Internet Protocol (IPv4/IPv6) and Border Gateway Protocol (BGP).

Underlying Network Mechanics:

Data packets are fragmented at the source, tagged with source and destination IP addresses, routed across underwater fiber optic cables and ISP transit routers, and reassembled at the destination.

Network Hierarchy#2

DNS Resolution (Domain Name System)

The phonebook of the Internet converting human-readable hostnames (e.g. google.com) to machine-routable IP addresses (142.250.190.46).

Underlying Network Mechanics:

Recursive resolvers query Root Name Servers (.) -> TLD Name Servers (.com) -> Authoritative Name Servers for the target zone, caching results based on TTL (Time to Live).

Transport & Security#3

TCP Handshake & TLS 1.3 Encryption

Reliable packet delivery with cryptographic confidentiality and server authenticity verification.

Underlying Network Mechanics:

A 3-way SYN -> SYN-ACK -> ACK handshake establishes ordered TCP byte streams. TLS 1.3 completes Diffie-Hellman key exchange in a single round trip (1-RTT) to encrypt the channel.

Application Protocol#4

HTTP/1.1 to HTTP/2 and HTTP/3

The evolution of the web's primary data transfer protocol from synchronous text streams to multiplexed binary streams and QUIC over UDP.

Underlying Network Mechanics:

HTTP/2 introduces binary framing and single-connection multiplexing. HTTP/3 replaces TCP with QUIC over UDP to eliminate head-of-line packet loss blocking.

Browser Critical Rendering Pipeline

Under The Hood

How browsers convert HTML/CSS text into hardware-accelerated screen pixels.

1. DOM & CSSOM Parsing

Raw text bytes become in-memory tree nodes

The browser network engine receives raw HTML and CSS bytes over TCP/TLS, decodes UTF-8 characters, tokenizes tag pairs, and constructs two separate object trees: the Document Object Model (DOM) and CSS Object Model (CSSOM).

Engine Mechanics:

•HTML parser runs incrementally as chunks arrive over the network stream.

•Synchronous <script> tags block HTML parsing unless 'defer' or 'async' are used.

•CSS is render-blocking: the browser will not render pixels until CSSOM is ready.

Web Performance Rule:Always use <script defer> and inline critical CSS to avoid parser stalls.

Interactive Protocol EngineRESTful HTTP/1.1 & HTTP/2

REST API Request & Response Lifecycle

Safe & Idempotent: Retrieves the specified resource representation without modifying server state.

GEThttps://api.devatlas.io/api/v1/technologies/react

HTTP 200/201

Node A

Client / Browser

Initiates HTTP request with headers

Node B

API Gateway

Token auth, rate-limiting & routing

Node C

Application Server

Controller handles business logic

Node D

Database (PostgreSQL)

ACID transactional read / write

Step 1/7:1. Client Sends Request(Browser / Client)

Client Request WireGET /api/v1/technologies/react

Accept: application/json

Authorization: Bearer dev_sec_99a8

Database Operation:

SELECT * FROM technologies WHERE slug = 'react' LIMIT 1;

Server Response Wire

200 OK

content-type: application/json; charset=utf-8

x-ratelimit-remaining: 994

x-response-time: 14.8ms

JSON Body:

{
  "status": "success",
  "data": {
    "id": "react",
    "name": "React",
    "version": "19.0",
    "stars": "230k+",
    "cached": true
  }
}