Code Box

Code Box is a JavaScript library developed in TypeScript, designed for showcasing code samples on the web. It serves as a container that allows users to select and display different code samples.

It doesn't include syntax highlighting itself, but you can easily integrate libraries such as highlight.js to add it.

<div id="MyCodeBox">

    <pre data-cb-name="addition" data-cb-active><code>let x = 1;
let y = 2;

console.log("result: " + (x + y));</code></pre>

    <pre data-cb-name="connecting-strings"><code>let string1 = "This is";
let string2 = " string.";

console.log(string1 + string2);</code></pre>

</div>

import { TabCodeBox } from "@jirkasa/code-box";

new TabCodeBox(document.getElementById("MyCodeBox"), {
    svgSpritePath: "./img/icon-sprite.svg",
    svgSpriteIcons: {
        codeFile: "file",
        file: "file-2",
        download: "download"
    }
});

You can either enable users to switch between different code samples with a few buttons or present the entire source code in a project-like format.

Code Box can be used to enhance your programming tutorials, making them more interactive and engaging by allowing users to see and switch between various code examples easily. It's also a great tool for documentation of libraries or frameworks, providing a great way to showcase different functions and features - even within a complete project example.

package io.github.jirkasa.model;

public class Human {
    private name;
    private surname;

    public String getName() {
        return name;
    }

    public void setName(String name) {
        this.name = name;
    }

    public String getSurname() {
        return surname;
    }

    public setSurname(String surname) {
        this.surname = surname;
    }
}

package io.github.jirkasa;

import io.github.jirkasa.Human;

public class MyApp {
    public static void main(String[] args) {
        const human = new Human();
        human.setName("Jiří");
        human.setSurname("Satora");

        String text = "Hello " + human.getName() + " " + human.getSurname();

        System.out.println(text);
    }
}

This is an example app.