System Architecture

Tutorial
November 7th, 2021 Rev 2

09/09/2025 06:18 PM 1
 SERVER-SIDE DEVELOPMENT

Monolithic Architect MicroServices Architect Serverless Architect

Cloud Server App

• Amazon
• Google
• Microsoft

CLIENT-SIDE DEVELOPMENT

Single Page App

Progressive (SPA) Multi Page App
Web App Google Map, (MPA)
(PWA) Goole Drive, eBAY, Magento
Twitter
09/09/2025 06:18 PM 2
09/09/2025 06:18 PM 3
System Design …

09/09/2025 06:18 PM 4
09/09/2025 06:18 PM 5
System Design … load balancer

Web
App

Load Balancer
Load Balancer

Load Balancer
Server # 1

(Internal)
(External)
Server # 1

(Internal)
Internet

users Web App

Server # 2 Server # 2

CPU = 80%
1.2.3.4
st # 1
Reque Web
Internet Server
Load Balancer

Cloud Request # 2 #1
Req
ues Private
t#
3 network
Web
Server
user #2

6.7.8.9 5.6.7.8
CPU = 30%
public network

09/09/2025 06:18 PM 6
System Design … Cache
Write-around cache
• Put most requested data onto memory instead of storage
3. request 4. cache miss media
Application Cache
6. response 5. cache update
• To improve performance & save cost in the long run
• Caching at multiple different layers DNS, CDN (Content
1. write
Delivery Network), Application, Database
2. response • Distributed Cache … had built-in functionality to replicate
Write-through cache data, shard data across server & locate server for each key
• Cache Eviction … prevent stale data with TTL & only cache
1. write 2. write
Application 4. response Cache most valuable data to save resources
3. response

Write-back cache

1. write 3. write
Cache “dirty bit”
Application
2. ACK 4. cache update

Cache miss
1. Data request 3. Read original

Application Cache
2. Data response 4. cache update

09/09/2025 06:18 PM 7
 NoSQL Usage
System Design … Database Graph Neo4J social network analytics
CosmoDB
Document MongoDB
Couchbase
Firebase
Apache CouchDB
DynamoDB serverless database for mobile apps
Key-Value Redis – (OS) distributed cache & message broker
DynamoDB serverless database for mobile apps
CosmoDB

Rank SQL DB NoSQL DB MemCached

Riak tracking user data, copy & store global
1 MySQL MongoDB
2 PostgreSQL Redis Column- Apache Cassandra decentralized database
Family automatic multi-data replication
3 MSFT SQL MariaDB Apache HBase Hadoop read/write to the big data
4 SQL Lite Elastic Search CosmoDB
5 AWS Aurora DynamoDB Search Engine Elasticsearch analyze Logging or Monitoring data
6 Oracle Cassandra Splunk
Solr
09/09/2025 06:18 PM 8
DATABASE SCALING

• Most web apps are majority reads, around 95%+

• Basic scaling techniques: Indexes, Denormalization, Connection Pooling, Caching, Vertical Scaling
• Vertical Scaling
• Indexes:
• Index based on column … Speeds up read performance
• Writes and updates become slightly slower … More storage required for index
• Denormalization:
• Add redundant data to tables for reduce joins … Boosts read performance … slows down writes
• Risk inconsistent data across tables … code is harder to write
• Connection Pooling:
• Allow multiple application threads to use the same DB connection
• Saves on overhead of independent DB connections
• Caching:
• Sits in front of DB to handle serving content … can’t cache everything (dynamic data)
• Popular brands: MemCached, Redis
• Replication
• Partitioning

09/09/2025 06:18 PM 9
DATABASE SCALING

• Replication • Horizontal Partitioning … Sharding • Vertical Partitioning … Instagram

Relational Dbase: SQL Non-Relational Dbase: NoSQL

• Oracle • Cassandra
• MySQL • MongoDB
• Microsoft SOL Server • Couchbase
• PostgreSQL (open sources) • CouchDB
• IBM DB2 • Azure Cosmos
• SQLite (open sources) • Redis (open sources)
• MS Access • Hadoop
• MS Azure SQL DB
09/09/2025 06:18 PM • Ingres 10
 WEB SERVER

App Router
Service

UserMgmnt RBD
CLIENT & Security Service

Web Service API

SMS Texting
Service
UX & UI (MySQL)
Customers … App Code Email
(Typescript) Service

Logging
SnapMaster - WaitList Ionic v3 Service
Architecture Design Framework
Payment
Client Side: PWA Service
Cordova
Server: Monolithic Metrics & Analysis
Native Services Service

Push Service
(Apple Web Socket)
09/09/2025 06:18 PM 11
 YouTube system design … 1

Requirements

Capacity Estimates
• Storage:
• 500 hrs of video uploaded per minute
• Bandwidth
• 1 Billion hrs of video watched per day

09/09/2025 06:18 PM 12
 YouTube system design … 2

09/09/2025 06:18 PM 13
System Design … Tweeter Architecture 1
1. Requirements & Goals 2. Storage & Network Capacity
• Functional: • ====== TRAFFIC ======
• Post tweets • 1 billion users
• Follow users • 200 millions DAU (daily active users)
• Favorite tweets • 100 million tweets/day
• Timeline • Average 200 follows/person
• Non-Functional:
• High Availability • ======= STORAGE ======
• Low Latency • 100 million tweets * ((each tweet 140 char * 2
• Consistency (don’t care) bytes/char) + 30 bytes overhead) ~ 30 gigabytes/day
• 30 gigabyte/day * 365 days ~ 11 terabytes/year
• 11 terabytes/year * 5 years ~ 55 terabytes over 5 years

• ======== BANDWIDTH =====

• 10 billions tweet views per day -> (10 billions * 280
bytes) / 86,400 seconds/day ~ 32 megabytes/second

09/09/2025 06:18 PM 14
System Design … Tweeter Architecture 2
3. System APIs 5. Database Schema
• POST: tweet (key, tweet_data, location)
returns URL of new tweet Tweet User
• GET: tweet (key, tweet_ID) returns information • Id • Id
about tweet in JSON • UserID • Name
• Latitude • Email
4. High Level Design • Longitude • DOB
• Create Date • Last Login
• # of favorite

User follow Favorite

• User 1 • Tweeter Id
• User 2 • User Id

09/09/2025 06:18 PM 15
System Design … Tweeter Architecture 3
5. Data Sharding 6. Complete System Design
• Bases on User ID (load balancer)

• Bases on Tweet ID (hash function)

https://www.geeksforgeeks.org/design-twitter-a-system-design-interview-question/

6. Caching

09/09/2025 06:18 PM 16
System Design … Amazon Architecture 1
Design e-Commerce website Business Requirements
• Uses Cases • Who are your app audience (age, interests, languages they speak,
• Create user profile etc.)? Are they your customers or your employees? Or both?
• List products
• Will your app be specific to a certain location/country?
• Add products to Cart
• Purchase • What problem or business goal will your app solve? Why would
• Track Orders people love to use your app?
• System Design • How will it work? What users can do in your app and what
• MicroServices behavior would you like to see? Are there any unique features or
• Database Model functions?
• SQL
• What kind of products/services are you going to sell through the
• Non-SQL
app? Is there any specifics?
• Concurrency
• How do your customers prefer to pay for purchases?
Currently Available • Do you need an app management or moderation system, where
• Product Finder: Asos App you can add new products, manage users, view stats and
• QR Code Reader: Getsocio QR analytics?
• Push Notification • Should your app work without an internet connection?
• Mobile Payment: PayPal, Apple & Android Pay, Square
• Location-based Service: iBeacons • Is there any similar applications? What benefits will your app offer
compared to analogs?
• Which mobile platform — iOS, Android or both?
09/09/2025 06:18 PM • What is the expected timeframe? 17
System Design … Amazon Architecture 2

Design e-Commerce website

09/09/2025 06:18 PM 18
 SERVER-SIDE DEVELOPMENT

09/09/2025 06:18 PM 19