# GitBook


## GitBook 생성 스타일

여러가지 스타일로 생성할 수 있습니다. 

- BOOK & MANUAL 
- API DOCUMENTATION
- KNOWLEDGE BASE 

각 스타일은 `book.json`에 의해 설정됩니다. 설정부분에 스타일 변경사항은 없고, book.json 파일을 수정해야 합니다. 각 스타일은 `read` 모드일 경우에 스타일이 서로 다르게 적용됩니다. 

## BOOK & MANUAL

기본적인 스타일로 생성합니다. 

좌측에 챕터 목록이 보이고 우측에 내용이 보이는 형태로 생성됩니다. 

![](https://goo.gl/dp04ZY)

상단 메뉴바는 `theme-api` 플러그인을 적용하여 `dark`로 나오고 있습니다. 

## API DOCUMENTATION

API 설명을 위한 스타일로 생성합니다. 

![](https://goo.gl/69taJP)

2단 배열을 통해, 설명과 예제 코드를 나눠서 보여줍니다. 

상단에 지정한 언어인 Javascript 와 Go 를 확인할 수 있습니다.

book.json 파일을 보면, `theme-api` 플러그인이 적용된 것을 확인할 수 있습니다. 

```javascript
{
    "plugins": [ "theme-api"],
    "pluginsConfig": {
        "theme-api": {
            "languages": [
                {
                    "lang": "js",
                    "name": "JavaScript",
                    "default": true
                },
                {
                    "lang": "go",
                    "name": "Go"
                }
            ]
        }
    }
}
```

## KNOWLEDGE BASE

용어 및 FAQ를 정리할 때 사용합니다.

![](https://goo.gl/ahxdct)

book.json 파일을 살펴보면 `theme-faq` 플러그인이 적용된 것을 확인 할 수 있습니다. 

```javascript
{
    "plugins": [ "theme-faq" ]
}
```

# GitBook Plugin

[GitBook Plugins](https://plugins.gitbook.com/)를 사용할 수 있습니다. 해당 플러그인을 `book.json`에 입력하면 적용됩니다. 

만약 book.json 파일이 보이지 않는다면 화면 우측 상단에 있는 `Edit Book Configuration` 메뉴를 실행합니다. 

![](https://goo.gl/ROXRlJ)

`adsense`, `disqus`, `theme-api` 플러그인을 적용하면 아래와 같습니다. 

```javascript
{
    "plugins": ["adsense", "disqus", "theme-api"],
    "pluginsConfig": {
        "adsense": {
          "client": "ca-pub-[YOUR_CODE]",
          "slot": "[YOUR_CODE]",
          "format": "auto",
          "element": ".page-inner h1"
        }
        , "disqus": {
            "shortName": "[YOUR_NAME]"
        }
        , "theme-api": {
            "theme": "dark"
        }
    }
}
```


# GitBook Editor

[GitBook Editor](https://www.gitbook.com/editor)를 다운로드 하여 설치합니다. 

![](https://goo.gl/dlme1h)

desktop 용 프로그램을 실행하고 로그인 하면 내가 생성한 Book 목록을 확인 할 수 있습니다. 

Book 을 선택하고 clone 을 하면 로컬에서 수정 할 수 있습니다. 

![](https://goo.gl/azFdQ7)

웹에서와 다르게 ``` 만 입력하면 코드입력 부분이 생성됩니다. 

![](https://goo.gl/6Ojfr5)

우측 상단에 언어를 선택하는 부분도 생성이 되어 좋아 보이지만, 이곳에 코드를 붙여넣기 하면 코드 블럭이 사라지게 되어 문서 작성에 혼란을 주게 됩니다. 

> 웹에서 편집하는 것이 더 좋습니다. 


# 참고

- https://bluekms21.gitbooks.io/gitbookhelp_kr/content/