update writing styles on arbitrary notes

Author: glennhenry

Diff for: docs/backend-system/01-web-server/web-server.md

@@ -5,10 +5,10 @@ title: Web Server
 description: Web Server
 ---
 
-**Main Source :**
+**Main Source:**
 
-- **[What is a web server? - MDN](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_web_server)**
-- **[Apache vs NGINX - IBM Technology](https://youtu.be/9nyiY-psbMs?si=awdYABj62-vySNKk)**
+- **[What is a web server? — MDN](https://developer.mozilla.org/en-US/docs/Learn/Common_questions/Web_mechanics/What_is_a_web_server)**
+- **[Apache vs NGINX — IBM Technology](https://youtu.be/9nyiY-psbMs?si=awdYABj62-vySNKk)**
 
 When we attempt to access a website using a [web browser](/internet-and-web/web-browser), the browser initiates communication by sending a message to a [server](/computer-networking/server) through an [HTTP request](/computer-networking/http-https).
 
@@ -25,13 +25,13 @@ A static web server will deliver static content, these are simple web pages whic
 Dynamic web server, on the other hand, will deliver dynamic content. These content can change based on user input, and the server will generate content on-the-fly.
 
 ![Comparison between static and dynamic web server](./static-dynamic-web-server.png)  
-Source : https://about.gitlab.com/blog/2016/06/03/ssg-overview-gitlab-pages-part-1-dynamic-x-static/
+Source: https://about.gitlab.com/blog/2016/06/03/ssg-overview-gitlab-pages-part-1-dynamic-x-static/
 
 #### Web Server Feature
 
-The previous explanation explain about a simple web server, in reality a web server is provided with much more complex feature. Some of them are :
+The previous explanation explain about a simple web server, in reality a web server is provided with much more complex feature. Some of them are:
 
-- **[Reverse Proxy](/computer-networking/proxy#reverse-proxy)** : A technique which forwards client requests to the appropriate backend servers on behalf of the clients. This is useful for [load balancing](/computer-networking/server#server-optimization) and improving security by hiding the server's IP address.
-- **[Other server optimization technique](/computer-networking/server#server-optimization)** : Other technique such as caching, CDN, and load balancing.
+- **[Reverse Proxy](/computer-networking/proxy#reverse-proxy)**: A technique which forwards client requests to the appropriate backend servers on behalf of the clients. This is useful for [load balancing](/computer-networking/server#server-optimization) and improving security by hiding the server's IP address.
+- **[Other server optimization technique](/computer-networking/server#server-optimization)**: Other technique such as caching, CDN, and load balancing.
 
 Most popular example of web server are Apache and NGINX. Apache follows a process-based model where each incoming request is handled by a separate process. Nginx uses an event-driven model, where a small number of processes can handle multiple connections simultaneously.

Diff for: docs/backend-system/02-apis-server-logic/apis-server-logic.md

@@ -5,11 +5,11 @@ title: APIs & Server Logic
 description: APIs & Server Logic
 ---
 
-**Main Source :**
+**Main Source:**
 
-- **[APIs for Beginners 2023 - How to use an API (Full Course / Tutorial) - freeCodeCamp](https://youtu.be/WXsD0ZgxjRw?si=IJAjV5WMFpiaT8n0)**
-- **[What Is Middleware? - AWS](https://aws.amazon.com/what-is/middleware/)**
-- **[What is API Gateway? - ByteByteGo](https://youtu.be/6ULyxuHKxg8?si=NejEaVJLUUz8jH0x)**
+- **[APIs for Beginners 2023 - How to use an API (Full Course / Tutorial) — freeCodeCamp](https://youtu.be/WXsD0ZgxjRw?si=IJAjV5WMFpiaT8n0)**
+- **[What Is Middleware? — AWS](https://aws.amazon.com/what-is/middleware/)**
+- **[What is API Gateway? — ByteByteGo](https://youtu.be/6ULyxuHKxg8?si=NejEaVJLUUz8jH0x)**
 
 ### What is API
 
@@ -19,15 +19,15 @@ While making a program, we often interact with other software component (functio
 
 #### APIs Types
 
-Some types of APIs are :
+Some types of APIs are:
 
-- **Library API** : Library is a collection of pre-written ready-to-use code, this includes function, classes, methods, constants, and other code components. Libraries are used to make programmers develop their application without needing to build everything from scratch. An example of library include graphics API like OpenGL that lets you render 2D or 3D computer graphics.
+- **Library API**: Library is a collection of pre-written ready-to-use code, this includes function, classes, methods, constants, and other code components. Libraries are used to make programmers develop their application without needing to build everything from scratch. An example of library include graphics API like OpenGL that lets you render 2D or 3D computer graphics.
 
-- **OS API** : Operating system APIs is considered as low-level API, this includes accessing necessary function or classes that interact directly with OS component such as file system, memory management, task manager, process management, and etc. Example of OS level API can be a class that access internal storage in Android OS.
+- **OS API**: Operating system APIs is considered as low-level API, this includes accessing necessary function or classes that interact directly with OS component such as file system, memory management, task manager, process management, and etc. Example of OS level API can be a class that access internal storage in Android OS.
 
-- **Web API** : Web API is an API accessed over the internet using protocols like [HTTP](/computer-networking/http-https#http). Web APIs can be used if the code we are interacting to is stored on the internet. Common Web APIs include Google Maps API that let you know about geolocation information, Spotify API that allows developers to search for songs, albums, and artists, retrieve user playlists.
+- **Web API**: Web API is an API accessed over the internet using protocols like [HTTP](/computer-networking/http-https#http). Web APIs can be used if the code we are interacting to is stored on the internet. Common Web APIs include Google Maps API that let you know about geolocation information, Spotify API that allows developers to search for songs, albums, and artists, retrieve user playlists.
 
-Here is an example of API in Kotlin :
+Here is an example of API in Kotlin:
 
 ```kotlin
 logOutput("Calling an API")
@@ -43,7 +43,7 @@ val logs = mutableListOf<String>()
 fun logOutput(out: String) {
     val currentTime = LocalTime.now()
     logs.add(out)
-    println("Log : $out - at $currentTime")
+    println("Log: $out - at $currentTime")
 }
 ```
 
@@ -66,7 +66,7 @@ The website provides some endpoint including `/posts`, `/comments`, `/albums`, a
 Overall, routing and endpoint determines how the server should respond to different requests by mapping them to specific endpoints or routes. The behavior of accessing specific endpoints will depend on the web API.
 
 ![Endpoint example](./endpoint.png)  
-Source : https://apipheny.io/api-endpoint/
+Source: https://apipheny.io/api-endpoint/
 
 ### Middleware
 
@@ -75,29 +75,29 @@ In backend, **Middleware** is a software that bridges between application and se
 The purpose of middleware is to pre-process incoming request before passing it into server to make the server can focus only on the actual logic. For example, middleware in the context of backend can be used check if user has logged in or not, checking for cookies (file that stores basic user information), add additional data or configuration, and handling request error.
 
 ![Middleware that acts as a bridge between application and server](./middleware.png)  
-Source : https://medium.com/@seymarslan/what-ismiddleware-fdb2ad163388
+Source: https://medium.com/@seymarslan/what-ismiddleware-fdb2ad163388
 
 ### API Gateway
 
 Middleware general definition is a software that bridges between one system to another, an **API gateway** is a type of middleware focused to bridges between the client and the backend system. It is a centralized entry point to access the server, a unified interface for APIs consumer.
 
-An API gateway may provide some functionality including :
+An API gateway may provide some functionality including:
 
-- **Routing & Endpoint Management** : API gateway handles the routing of requests to the appropriate backend services based on predefined rules. It manages the endpoints and exposes a unified interface for API consumers.
+- **Routing & Endpoint Management**: API gateway handles the routing of requests to the appropriate backend services based on predefined rules. It manages the endpoints and exposes a unified interface for API consumers.
 
-- **Protocol Translation** : API Gateways can translate between different protocols. For example, it can handle requests in [RESTful](/backend-system/rest-api) format from clients and convert it into another format such as [GraphQL](/backend-system/graphql), [WebSockets](/backend-system/websocket), or another API protocol.
+- **Protocol Translation**: API Gateways can translate between different protocols. For example, it can handle requests in [RESTful](/backend-system/rest-api) format from clients and convert it into another format such as [GraphQL](/backend-system/graphql), [WebSockets](/backend-system/websocket), or another API protocol.
 
-- **Security & Authentication** : API Gateways provide security mechanisms to protect APIs, they can handle [authentication](/backend-system/authentication) and [authorization](/backend-system/authorization).
+- **Security & Authentication**: API Gateways provide security mechanisms to protect APIs, they can handle [authentication](/backend-system/authentication) and [authorization](/backend-system/authorization).
 
-- **Request & Response Modifier** : API Gateways can modify, validate, or transform requests and responses as they pass through, this can include validating or filtering requests.
+- **Request & Response Modifier**: API Gateways can modify, validate, or transform requests and responses as they pass through, this can include validating or filtering requests.
 
-- **Rate Limiting** : API Gateways can limit the number of requests made by a client in a period of time.
+- **Rate Limiting**: API Gateways can limit the number of requests made by a client in a period of time.
 
-- **Caching** : API Gateways may store its previous response from previous API request, this is called **caching**. If the further request requested the same data, the API gateway doesn't need to forward it to the server, instead it responds with the data stored in the cache.
+- **Caching**: API Gateways may store its previous response from previous API request, this is called **caching**. If the further request requested the same data, the API gateway doesn't need to forward it to the server, instead it responds with the data stored in the cache.
 
-- **Monitoring & Analytics** : API Gateways may log or monitor incoming request, API usage and performance. This allows administrators to gain insights into the traffic patterns, identify potential issues, and make optimal decision for optimization problem.
+- **Monitoring & Analytics**: API Gateways may log or monitor incoming request, API usage and performance. This allows administrators to gain insights into the traffic patterns, identify potential issues, and make optimal decision for optimization problem.
 
-- **Load Balancing** : Load balancing is the technique to distribute incoming request across multiple backend server to balance the load.
+- **Load Balancing**: Load balancing is the technique to distribute incoming request across multiple backend server to balance the load.
 
 ![API Gateway illustration](./api-gateway.png)  
-Source : https://stackoverflow.com/questions/53477140/asp-net-core-api-gateway-middleware
+Source: https://stackoverflow.com/questions/53477140/asp-net-core-api-gateway-middleware

Diff for: docs/backend-system/03-rest-api/rest-api.md

@@ -5,25 +5,25 @@ title: REST API
 description: REST API
 ---
 
-**Main Source :**
+**Main Source:**
 
-- **[What Is A RESTful API? - AWS](https://aws.amazon.com/what-is/restful-api/)**
-- **[RESTful APIs in 100 Seconds - Fireship](https://youtu.be/-MTSQjw5DrM?si=mGOKWYNFT7H6yl_m)**
+- **[What Is A RESTful API? — AWS](https://aws.amazon.com/what-is/restful-api/)**
+- **[RESTful APIs in 100 Seconds — Fireship](https://youtu.be/-MTSQjw5DrM?si=mGOKWYNFT7H6yl_m)**
 
 **Representational State Transfer API (REST API)** is an architectural style for designing an API.
 Web services that implement REST architecture are called RESTful web services.
 
 REST works by leveraging or extending HTTP concepts. The underlying architecture of REST API follows the [HTTP protocol](/computer-networking/http-https#http) to perform specific types of operation such as accessing resource.
 
-Every resource in the server are uniquely identified by Uniform Resource Identifiers (URI), basically a unique address. An example of URI : `file:///C:/Users/username/Documents/file.txt`, `https://www.example.com/index.html`. In the case of REST API, the URI used typically uses the concept of [routing and endpoint](/backend-system/apis-server-logic#routing--endpoint).
+Every resource in the server are uniquely identified by Uniform Resource Identifiers (URI), basically a unique address. An example of URI: `file:///C:/Users/username/Documents/file.txt`, `https://www.example.com/index.html`. In the case of REST API, the URI used typically uses the concept of [routing and endpoint](/backend-system/apis-server-logic#routing--endpoint).
 
-REST includes another HTTP concepts like :
+REST includes another HTTP concepts like:
 
-- **[HTTP methods](/computer-networking/http-https#http-request--method)** : Such as GET, POST, DELETE, PUT followed with the endpoint (e.g. GET /books).
-- **[HTTP format and syntax](/computer-networking/http-https#http-format--syntax)** : Including header, request line, request body, response format, and version.
-- **[HTTP Responses](/computer-networking/http-https#http-response)** : Codes to indicate the result of the response, for example, 200 OK signifies a successful response, 404 Not Found denotes that the requested resource does not exist.
+- **[HTTP methods](/computer-networking/http-https#http-request--method)**: Such as GET, POST, DELETE, PUT followed with the endpoint (e.g. GET /books).
+- **[HTTP format and syntax](/computer-networking/http-https#http-format--syntax)**: Including header, request line, request body, response format, and version.
+- **[HTTP Responses](/computer-networking/http-https#http-response)**: Codes to indicate the result of the response, for example, 200 OK signifies a successful response, 404 Not Found denotes that the requested resource does not exist.
 
-Example of REST API GET request :
+Example of REST API GET request:
 
 ```
 GET /books HTTP/1.1

Diff for: docs/backend-system/04-soap/soap.md

@@ -5,13 +5,15 @@ title: SOAP
 description: SOAP
 ---
 
-**Main Source : [Wikipedia SOAP](https://en.wikipedia.org/wiki/SOAP)**
+**Main Source:**
+
+- **[SOAP — Wikipedia](https://en.wikipedia.org/wiki/SOAP)**
 
 **Simple Object Access Protocol (SOAP)** is a protocol to exchange information or message using [XML](/digital-media-processing/xml). It follows XML standard such as schema to define message in a structured way. Specifically, XML uses the WSDL (Web Services Description Language), a standard used for XML-based services on the web.
 
 It still uses [HTTP](/computer-networking/http-https#http) as the transport protocol over the network. When SOAP messages are transmitted over HTTP, they are typically encapsulated within the payload of an HTTP request (POST) or response. The HTTP headers and body are used to transport the SOAP message between the client and the server.
 
-Here is an example of SOAP request encapsulated in HTTP POST method :
+Here is an example of SOAP request encapsulated in HTTP POST method:
 
 ```xml
 POST /exampleWebService HTTP/1.1

Diff for: docs/backend-system/05-graphql/graphql.md

@@ -5,10 +5,10 @@ title: GraphQL
 description: GraphQL
 ---
 
-**Main Source :**
+**Main Source:**
 
-- **[GraphQL Explained in 100 Seconds - Fireship](https://youtu.be/eIQh02xuVw4?si=NZATScKXA3s8jYv9)**
-- **[What is GraphQL? GraphQL introduction - Apollo Blog](https://www.apollographql.com/blog/graphql/basics/what-is-graphql-introduction/)**
+- **[GraphQL Explained in 100 Seconds — Fireship](https://youtu.be/eIQh02xuVw4?si=NZATScKXA3s8jYv9)**
+- **[What is GraphQL? GraphQL introduction — Apollo Blog](https://www.apollographql.com/blog/graphql/basics/what-is-graphql-introduction/)**
 
 **GraphQL** is a query language specifically designed for querying APIs data, GraphQL accesses resource on server in a similar way we query a database. Compared to [REST API](/backend-system/rest-api) that accesses resource in a fixed way (e.g., GET /books endpoint), GraphQL allows clients to request specific data from the server in a flexible way by defining the structure of the response they need.
 
@@ -18,7 +18,7 @@ GraphQL typically uses [HTTP](/computer-networking/http-https#http) as the trans
 
 We need to define schema, it serves as contract for the client and the server for querying and manipulating data.
 
-Here is an example of schema in GraphQL :
+Here is an example of schema in GraphQL:
 
 ```graphql
 type User {
@@ -56,24 +56,24 @@ The type name and its field has no actual meaning, they are just random word. Th
 
 ### GraphQL Request
 
-GraphQL consist of the following structure :
+GraphQL consist of the following structure:
 
-1. **Operation Type** : GraphQL has 2 type of operation :
+1. **Operation Type**: GraphQL has 2 type of operation:
 
-   - **Query** : Request data from a server (read operation)
-   - **Mutation** : Modify data on the server such as create, update, or delete (write operation)
+   - **Query**: Request data from a server (read operation)
+   - **Mutation**: Modify data on the server such as create, update, or delete (write operation)
 
-2. **Operation Name (optional)** : Text specified to describe the action.
+2. **Operation Name (optional)**: Text specified to describe the action.
 
-3. **Variables (optional)** : We can include our variable and it will be defined with `$`
+3. **Variables (optional)**: We can include our variable and it will be defined with `$`
 
-4. **Query Fields** : The main part of a GraphQL request, these fields represent the data that the client wants to retrieve from the server. The client can specify the fields it needs, including nested fields and relationships which mean the data are related.
+4. **Query Fields**: The main part of a GraphQL request, these fields represent the data that the client wants to retrieve from the server. The client can specify the fields it needs, including nested fields and relationships which mean the data are related.
 
-5. **Arguments (optional)** : Arguments are used to filter or provide additional information to the server to customize the response. Arguments are passed using the variable we defined before.
+5. **Arguments (optional)**: Arguments are used to filter or provide additional information to the server to customize the response. Arguments are passed using the variable we defined before.
 
-6. **Directive (optional)** : Directives enable clients to modify the execution behavior of a GraphQL query. They provide additional instructions to the server about how to handle certain parts of the query. Directive can only modify functionality of an operation compared to argument that capable of modifying the data received.
+6. **Directive (optional)**: Directives enable clients to modify the execution behavior of a GraphQL query. They provide additional instructions to the server about how to handle certain parts of the query. Directive can only modify functionality of an operation compared to argument that capable of modifying the data received.
 
-Here is an example of a GraphQL query (different from the schema above) :
+Here is an example of a GraphQL query (different from the schema above):
 
 ```graphql
 query ($userId: ID!, $withPosts: Boolean!) {