Welcome to the Markdown Feature Showcase. This post demonstrates the powerful rendering capabilities of our blog theme, perfect for technical documentation and tutorials.

1. Syntax Highlighting

We support beautiful code highlighting for almost any language.

1
2
3
4
5
6
7
8
def fibonacci(n):
    if n <= 1:
        return n
    else:
        return fibonacci(n-1) + fibonacci(n-2)

# Calculate first 10 numbers
print([fibonacci(i) for i in range(10)])
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
// Singleton Pattern Example
const Singleton = (function () {
    let instance;
 
    function createInstance() {
        return new Object("I am the instance");
    }
 
    return {
        getInstance: function () {
            if (!instance) {
                instance = createInstance();
            }
            return instance;
        }
    };
})();

2. Mermaid Diagrams

Visualize your flowcharts and sequences directly in Markdown.

Flowchart

1
2
3
4
5
6
7
graph TD;
    A[User Request] -->|PJAX| B(Router);
    B --> C{Is Movie Page?};
    C -->|Yes| D[Filter 'movies'];
    C -->|No| E[Filter 'source'];
    D --> F[Render Content];
    E --> F;

Sequence Diagram

1
2
3
4
5
6
7
8
9
10
11
sequenceDiagram
    participant U as User
    participant B as Browser
    participant S as Server
    
    U->>B: Click Link
    B->>S: PJAX Request
    S-->>B: HTML Fragment
    B->>B: Replace DOM
    B->>B: Update Body Class
    B-->>U: Show New Page

3. Admonitions (Notes)

Highlight important information with style.

Information: This is a useful piece of information for the reader.

Warning: Be careful when editing configuration files directly.

Critical: Always backup your data before running bulk commands.

4. Tabs

Organize content compactly.

1
2
sudo apt-get update
sudo apt-get install git
1
winget install git.git
1
brew install git

5. Mathematical Formulas

$$
E = mc^2
$$

$$
f(x) = \int_{-\infty}^\infty \hat f(\xi),e^{2\pi i \xi x} ,d\xi
$$

End of showcase.