/plugin-codetabs

Multiple languages code blocks for GitBook

Primary LanguageJavaScript

codetabs

Include multiple languages code block to your GitBook (for example when documenting an API).

Preview

Installation

Adds the plugin to your book.json, then run gitbook install if you are building your book locally.

{
    "plugins": ["codetabs"]
}

Usage

This is a code block with tabs for each languages:

{% codetabs name="Python", type="py" -%}
msg = "Hello World"
print msg
{%- language name="JavaScript", type="js" -%}
var msg = "Hello World";
console.log(msg);
{%- language name="HTML", type="html" -%}
<b>Hello World</b>
{%- endcodetabs %}

Escaping templating syntax

For languages using syntax like {{, {%; we have to escape these content:

Here is some angular and react code

{% codetabs name="Python", type="py" -%}
    {% raw %}
    <h1>Hello {{yourName}}!</h1>
    {% endraw %}
{%- language name="React", type="js" -%}
var React = require('react')
{%- endcodetabs %}

Show Path Parameter

Path Parameter를 표현하려면 {% codetabs %} 를 {% pathCodetabs %} 로 변경하고 parameter를 {} 안에 넣어주면 됩니다.

{% pathCodetabs name="CURL", type="bash" -%}
curl -X POST http://genius.genie.ggg/abc/{userId}/{HelloCount}/hey
{% endcodetabs %}

test test