CodeBlocks Element Test

We’ve added support for a new CodeBlocks element, designed to make technical content cleaner, easier to read, and more useful.

This post is a complete test of the element across different programming languages, including syntax highlighting, aliases, indentation, long lines, comments, strings, and common language constructs.

JavaScript

const greet = (name) => {
  return `Hello, ${name}!`;
};

console.log(greet("CodeBlocks"));

TypeScript

interface User {
  id: number;
  name: string;
  email: string;
}

const user: User = {
  id: 1,
  name: "Sakib",
  email: "sakib@sakibulislam.dev",
};

console.log(user);

Python

def calculate_total(items):
    return sum(item["price"] for item in items)

items = [
    {"name": "Keyboard", "price": 50},
    {"name": "Mouse", "price": 25},
]

print(calculate_total(items))

Java

public class Main {
    public static void main(String[] args) {
        String message = "Hello, CodeBlocks!";
        System.out.println(message);
    }
}

C

#include <stdio.h>

int main() {
    printf("Hello, CodeBlocks!\n");
    return 0;
}

C++

#include <iostream>
#include <vector>

int main() {
    std::vector<int> numbers = {1, 2, 3, 4, 5};

    for (int number : numbers) {
        std::cout << number << std::endl;
    }

    return 0;
}

C#

using System;

class Program
{
    static void Main()
    {
        string message = "Hello, CodeBlocks!";
        Console.WriteLine(message);
    }
}

Go

package main

import "fmt"

func main() {
    message := "Hello, CodeBlocks!"
    fmt.Println(message)
}

Rust

fn main() {
    let numbers = vec![1, 2, 3, 4, 5];

    for number in numbers {
        println!("{}", number);
    }
}

HTML

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>CodeBlocks Test</title>
  </head>

  <body>
    <main>
      <h1>Hello, CodeBlocks!</h1>
      <p>This is a test of the HTML syntax highlighting.</p>
    </main>
  </body>
</html>

CSS

.card {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.5rem;
  border-radius: 12px;
  background: #ffffff;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.card:hover {
  transform: translateY(-2px);
}

JSON

{
  "name": "CodeBlocks",
  "version": "1.0.0",
  "enabled": true,
  "languages": [
    "javascript",
    "python",
    "java",
    "c",
    "cpp",
    "csharp",
    "go",
    "rust",
    "html",
    "css",
    "sql",
  ]
}

Bash

#!/bin/bash

echo "Starting build..."

pnpm install
pnpm build

if [ $? -eq 0 ]; then
  echo "Build completed successfully!"
else
  echo "Build failed."
  exit 1
fi

SQL

SELECT
    id,
    name,
    email
FROM users
WHERE active = true
ORDER BY created_at DESC
LIMIT 10;

Markdown

# CodeBlocks

A simple example of **Markdown** syntax.

- JavaScript
- TypeScript
- Python

> Code should be easy to read.

[Visit our website](https://example.com)

What We're Testing

This test post helps us verify that CodeBlocks handles:

Multiple programming languages
Syntax highlighting
Language aliases such as js, ts, py, sh, and md
Comments and strings
Nested structures
Different indentation levels
Long lines and wrapping
Special characters
Multiple code blocks in a single post
Consistent spacing and typography

Added Language-wise CodeBlocks Support

Presentation