Skip to content

Commit

Permalink
update writing styles on arbitrary notes
Browse files Browse the repository at this point in the history
  • Loading branch information
glennhenry committed Aug 12, 2024
1 parent ad0d790 commit f0b6d44
Show file tree
Hide file tree
Showing 343 changed files with 6,025 additions and 6,004 deletions.
14 changes: 7 additions & 7 deletions docs/backend-system/01-web-server/web-server.md
Original file line number Diff line number Diff line change
Expand Up @@ -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).

Expand All @@ -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.
44 changes: 22 additions & 22 deletions docs/backend-system/02-apis-server-logic/apis-server-logic.md
Original file line number Diff line number Diff line change
Expand Up @@ -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

Expand All @@ -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")
Expand All @@ -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")
}
```

Expand All @@ -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

Expand All @@ -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
18 changes: 9 additions & 9 deletions docs/backend-system/03-rest-api/rest-api.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
6 changes: 4 additions & 2 deletions docs/backend-system/04-soap/soap.md
Original file line number Diff line number Diff line change
Expand Up @@ -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
Expand Down
28 changes: 14 additions & 14 deletions docs/backend-system/05-graphql/graphql.md
Original file line number Diff line number Diff line change
Expand Up @@ -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.

Expand All @@ -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 {
Expand Down Expand Up @@ -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!) {
Expand Down
Loading

0 comments on commit f0b6d44

Please sign in to comment.