Deploy website

Deploy website version based on fa1d681abc
This commit is contained in:
Website Deployment Script 2021-03-12 10:56:53 +00:00
parent ec5c6e3b09
commit 95a600b18e
96 changed files with 23444 additions and 0 deletions

218
docs/ko/adding-blog.html Normal file
View file

@ -0,0 +1,218 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Adding a Blog · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="## 초기 설정"/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Adding a Blog · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="## 초기 설정"/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/adding-blog">English</a></li><li><a href="/docs/fr/adding-blog">Français</a></li><li><a href="/docs/pt-BR/adding-blog">Português (Brasil)</a></li><li><a href="/docs/ro/adding-blog">Română</a></li><li><a href="/docs/ru/adding-blog">Русский</a></li><li><a href="/docs/zh-CN/adding-blog">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>가이드</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Adding a Blog</h1></header><article><div><span><h2><a class="anchor" aria-hidden="true" id="초기-설정"></a><a href="#초기-설정" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>초기 설정</h2>
<p>사이트의 블로그를 설정하기 위해서는 저장소의 <code>website</code> 디렉토리 아래에 <code>blog</code> 디렉토리를 만들어야 합니다.</p>
<p>그리고 <code>siteConfig.js</code> 파일에 블로그를 위한 헤더 링크를 추가해줍니다.</p>
<pre><code class="hljs css language-js">headerLinks: [
...
{ <span class="hljs-attr">blog</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Blog'</span> },
...
]
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="포스트-추가하기"></a><a href="#포스트-추가하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>포스트 추가하기</h2>
<p>To publish in the blog, create a file within the blog directory with a formatted name of <code>YYYY-MM-DD-my-blog-post-title.md</code>. 포스트의 날짜는 파일명에 지정된 날짜로 처리합니다.</p>
<p>For example, at <code>website/blog/2017-12-14-introducing-docusaurus.md</code>:</p>
<pre><code class="hljs css language-yml"><span class="hljs-meta">---</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Introducing</span> <span class="hljs-string">Docusaurus</span>
<span class="hljs-attr">author:</span> <span class="hljs-string">Joel</span> <span class="hljs-string">Marcey</span>
<span class="hljs-attr">authorURL:</span> <span class="hljs-string">http://twitter.com/JoelMarcey</span>
<span class="hljs-attr">authorFBID:</span> <span class="hljs-number">611217057</span>
<span class="hljs-attr">authorTwitter:</span> <span class="hljs-string">JoelMarcey</span>
<span class="hljs-meta">---</span>
<span class="hljs-string">Lorem</span> <span class="hljs-string">Ipsum...</span>
</code></pre>
<p>Adding slug will override the url of the blog post.</p>
<p>예를 들면 아래와 같습니다.</p>
<pre><code class="hljs css language-yml"><span class="hljs-meta">---</span>
<span class="hljs-attr">slug:</span> <span class="hljs-string">introducing-docusaurus</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Introducing</span> <span class="hljs-string">Docusaurus</span>
<span class="hljs-attr">author:</span> <span class="hljs-string">Joel</span> <span class="hljs-string">Marcey</span>
<span class="hljs-attr">authorURL:</span> <span class="hljs-string">http://twitter.com/JoelMarcey</span>
<span class="hljs-attr">authorFBID:</span> <span class="hljs-number">611217057</span>
<span class="hljs-attr">authorTwitter:</span> <span class="hljs-string">JoelMarcey</span>
<span class="hljs-meta">---</span>
<span class="hljs-string">Lorem</span> <span class="hljs-string">Ipsum...</span>
</code></pre>
<p>Will be available at <code>https://website/blog/introducing-docusaurus</code></p>
<h2><a class="anchor" aria-hidden="true" id="헤더-옵션"></a><a href="#헤더-옵션" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>헤더 옵션</h2>
<p>The only required field is <code>title</code>; however, we provide options to add author information to your blog post as well along with other options.</p>
<ul>
<li><code>author</code> - 작성자의 이름을 설정합니다.</li>
<li><code>authorURL</code> - 작성자와 관련된 URL을 설정합니다. 트위터나 깃허브, 페이스북 주소 등이 될 수 있습니다.</li>
<li><code>authorFBID</code> - 프로필 사진으로 사용할 페이스북 프로필 아이디를 설정합니다.</li>
<li><code>authorImageURL</code> - 작성자 프로필 사진 이미지 URL을 설정합니다. (참고: <code>authorFBID</code><code>authorImageURL</code>를 둘 다 설정한 경우에는 <code>authorFBID</code> 설정이 먼저 적용됩니다. <code>authorImageURL</code> 설정이 적용되기 원한다면 <code>authorFBID</code> 설정은 하지 말아야 합니다.)</li>
<li><code>title</code> - 블로그 포스트 제목을 설정합니다.</li>
<li><code>slug</code> - The blog post url slug. Example: <code>/blog/my-test-slug</code>. When not specified, the blog url slug will be extracted from the file name.</li>
<li><code>unlisted</code> - The post will be accessible by directly visiting the URL but will not show up in the sidebar in the final build; during local development, the post will still be listed. Useful in situations where you want to share a WIP post with others for feedback.</li>
<li><code>draft</code> - The post will not appear if set to <code>true</code>. Useful in situations where WIP but don't want to share the post.</li>
</ul>
<h2><a class="anchor" aria-hidden="true" id="요약-보기"></a><a href="#요약-보기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>요약 보기</h2>
<p>블로그 포스트에서 <code>&lt;!--truncate--&gt;</code> 마커를 사용하면 공개된 블로그 포스트의 요약 보기를 제공할 수 있습니다. <code>&lt;!--truncate--&gt;</code> 위에 작성한 내용이 요약 보기로 보여집니다. 예를 들면 아래와 같습니다.</p>
<pre><code class="hljs css language-yaml"><span class="hljs-meta">---</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Truncation</span> <span class="hljs-string">Example</span>
<span class="hljs-meta">---</span>
<span class="hljs-string">All</span> <span class="hljs-string">this</span> <span class="hljs-string">will</span> <span class="hljs-string">be</span> <span class="hljs-string">part</span> <span class="hljs-string">of</span> <span class="hljs-string">the</span> <span class="hljs-string">blog</span> <span class="hljs-string">post</span> <span class="hljs-string">summary.</span>
<span class="hljs-string">여기도</span> <span class="hljs-string">마찬가지구요.</span>
<span class="hljs-string">&lt;!--truncate--&gt;</span>
<span class="hljs-string"></span> <span class="hljs-string">부분부터는</span> <span class="hljs-string">요약</span> <span class="hljs-string">보기에서</span> <span class="hljs-string">표시되지</span> <span class="hljs-string">않습니다.</span>
<span class="hljs-string">여기도</span> <span class="hljs-string">표시되지</span> <span class="hljs-string">않구요.</span>
<span class="hljs-string">여기도</span> <span class="hljs-string">마찬가지</span>
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="사이드바에-표시되는-블로그-포스트-숫자-변경하기"></a><a href="#사이드바에-표시되는-블로그-포스트-숫자-변경하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>사이드바에 표시되는 블로그 포스트 숫자 변경하기</h2>
<p>사이드바에 보여지는 블로그 포스트는 최근 작성된 5개가 기본입니다.</p>
<p><code>siteConfig.js</code> 파일에서 <code>blogSidebarCount</code> 설정을 추가해서 사이드바에 표시될 블로그 숫자를 변경할 수 있습니다.</p>
<p>숫자로 포스트의 갯수를 지정하거나 <code>'ALL'</code>이라는 값을 지정할 수 있습니다.</p>
<p>예제:</p>
<pre><code class="hljs css language-js">blogSidebarCount: <span class="hljs-string">'ALL'</span>,
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="사이드바-타이틀-변경하기"></a><a href="#사이드바-타이틀-변경하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>사이드바 타이틀 변경하기</h2>
<p><code>siteConfig.js</code> 파일에서 <code>blogSidebarTitle</code> 설정을 추가해서 사이드바에 표시되는 타이틀을 변경할 수 있습니다.</p>
<p>사용할 수 있는 옵션은 <code>default</code><code>all</code>입니다. <code>default</code> 옵션에 값을 설정하면 사이드바 기본 타이틀을 변경할 수 있습니다. <code>all</code> 옵션에 값을 설정하면 <code>blogSidebarCount</code> 옵션값이 <code>'ALL'</code>인 경우에 사이드바 타이틀이 변경됩니다.</p>
<p>예제:</p>
<pre><code class="hljs css language-js">blogSidebarTitle: { <span class="hljs-attr">default</span>: <span class="hljs-string">'최근 포스트'</span>, <span class="hljs-attr">all</span>: <span class="hljs-string">'모든 블로그 포스트'</span> },
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="rss-feed"></a><a href="#rss-feed" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>RSS Feed</h2>
<p>Docusaurus provides an RSS feed for your blog posts. Both RSS and Atom feed formats are supported. This data is automatically added to your website page's HTML <code>&lt;HEAD&gt;</code> tag.</p>
<p>A summary of the post's text is provided in the RSS feed up to the <code>&lt;!--truncate--&gt;</code>. If no <code>&lt;!--truncate--&gt;</code> tag is found, then all text up to 250 characters are used.</p>
<h2><a class="anchor" aria-hidden="true" id="social-buttons"></a><a href="#social-buttons" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Social Buttons</h2>
<p>If you want Facebook and/or Twitter social buttons at the bottom of your blog posts, set the <code>facebookAppId</code> and/or <code>twitter</code> <a href="/docs/ko/site-config">site configuration</a> options in <code>siteConfig.js</code>.</p>
<h2><a class="anchor" aria-hidden="true" id="advanced-topics"></a><a href="#advanced-topics" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Advanced Topics</h2>
<h3><a class="anchor" aria-hidden="true" id="블로그-전용으로-사용할-경우"></a><a href="#블로그-전용으로-사용할-경우" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>블로그 전용으로 사용할 경우</h3>
<p>You can run your Docusaurus site without a landing page and instead have your blog load first.</p>
<p>To do this:</p>
<ol>
<li><code>website/static/</code> 디렉토리에 <code>index.html</code> 파일을 생성합니다.</li>
<li><code>website/static/index.html</code> 파일에 템플릿으로 제공되는 콘텐츠를 추가합니다.</li>
<li><code>website/static/index.html</code> 파일에서 <code>&lt;title&gt;</code> 태그 내용을 수정합니다.</li>
<li>동적인 랜딩 페이지로 만든 <code>website/pages/en/index.js</code> 파일을 삭제합니다.</li>
</ol>
<blockquote>
<p>이제 도큐사우르스를 빌드하게 되면 <code>static/index.html</code> 파일을 복사해서 사이트의 메인 디렉토리에 가져다놓게 됩니다. 방문자가 여러분의 페이지를 찾아오게 되면 정적인 파일을 제공하게 됩니다. When the page loads, it will redirect the visitor to <code>/blog</code>.</p>
</blockquote>
<p>You can use this template:</p>
<pre><code class="hljs css language-html"><span class="hljs-meta">&lt;!DOCTYPE <span class="hljs-meta-keyword">html</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">html</span> <span class="hljs-attr">lang</span>=<span class="hljs-string">"en-US"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">head</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">charset</span>=<span class="hljs-string">"UTF-8"</span> /&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">http-equiv</span>=<span class="hljs-string">"refresh"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"0; url=blog/"</span> /&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">script</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"text/javascript"</span>&gt;</span><span class="javascript">
<span class="hljs-built_in">window</span>.location.href = <span class="hljs-string">'blog/'</span>;
</span><span class="hljs-tag">&lt;/<span class="hljs-name">script</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">title</span>&gt;</span>Title of Your Blog<span class="hljs-tag">&lt;/<span class="hljs-name">title</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">head</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">body</span>&gt;</span>
If you are not redirected automatically, follow this
<span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"blog/"</span>&gt;</span>link<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span>.
<span class="hljs-tag">&lt;/<span class="hljs-name">body</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">html</span>&gt;</span>
</code></pre>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/docker"><span class="arrow-prev"></span><span>도커</span></a><a class="docs-next button" href="/docs/ko/custom-pages"><span>사용자 지정 페이지</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#초기-설정">초기 설정</a></li><li><a href="#포스트-추가하기">포스트 추가하기</a></li><li><a href="#헤더-옵션">헤더 옵션</a></li><li><a href="#요약-보기">요약 보기</a></li><li><a href="#사이드바에-표시되는-블로그-포스트-숫자-변경하기">사이드바에 표시되는 블로그 포스트 숫자 변경하기</a></li><li><a href="#사이드바-타이틀-변경하기">사이드바 타이틀 변경하기</a></li><li><a href="#rss-feed">RSS Feed</a></li><li><a href="#social-buttons">Social Buttons</a></li><li><a href="#advanced-topics">Advanced Topics</a><ul class="toc-headings"><li><a href="#블로그-전용으로-사용할-경우">블로그 전용으로 사용할 경우</a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,218 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Adding a Blog · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="## 초기 설정"/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Adding a Blog · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="## 초기 설정"/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/adding-blog">English</a></li><li><a href="/docs/fr/adding-blog">Français</a></li><li><a href="/docs/pt-BR/adding-blog">Português (Brasil)</a></li><li><a href="/docs/ro/adding-blog">Română</a></li><li><a href="/docs/ru/adding-blog">Русский</a></li><li><a href="/docs/zh-CN/adding-blog">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>가이드</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Adding a Blog</h1></header><article><div><span><h2><a class="anchor" aria-hidden="true" id="초기-설정"></a><a href="#초기-설정" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>초기 설정</h2>
<p>사이트의 블로그를 설정하기 위해서는 저장소의 <code>website</code> 디렉토리 아래에 <code>blog</code> 디렉토리를 만들어야 합니다.</p>
<p>그리고 <code>siteConfig.js</code> 파일에 블로그를 위한 헤더 링크를 추가해줍니다.</p>
<pre><code class="hljs css language-js">headerLinks: [
...
{ <span class="hljs-attr">blog</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Blog'</span> },
...
]
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="포스트-추가하기"></a><a href="#포스트-추가하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>포스트 추가하기</h2>
<p>To publish in the blog, create a file within the blog directory with a formatted name of <code>YYYY-MM-DD-my-blog-post-title.md</code>. 포스트의 날짜는 파일명에 지정된 날짜로 처리합니다.</p>
<p>For example, at <code>website/blog/2017-12-14-introducing-docusaurus.md</code>:</p>
<pre><code class="hljs css language-yml"><span class="hljs-meta">---</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Introducing</span> <span class="hljs-string">Docusaurus</span>
<span class="hljs-attr">author:</span> <span class="hljs-string">Joel</span> <span class="hljs-string">Marcey</span>
<span class="hljs-attr">authorURL:</span> <span class="hljs-string">http://twitter.com/JoelMarcey</span>
<span class="hljs-attr">authorFBID:</span> <span class="hljs-number">611217057</span>
<span class="hljs-attr">authorTwitter:</span> <span class="hljs-string">JoelMarcey</span>
<span class="hljs-meta">---</span>
<span class="hljs-string">Lorem</span> <span class="hljs-string">Ipsum...</span>
</code></pre>
<p>Adding slug will override the url of the blog post.</p>
<p>예를 들면 아래와 같습니다.</p>
<pre><code class="hljs css language-yml"><span class="hljs-meta">---</span>
<span class="hljs-attr">slug:</span> <span class="hljs-string">introducing-docusaurus</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Introducing</span> <span class="hljs-string">Docusaurus</span>
<span class="hljs-attr">author:</span> <span class="hljs-string">Joel</span> <span class="hljs-string">Marcey</span>
<span class="hljs-attr">authorURL:</span> <span class="hljs-string">http://twitter.com/JoelMarcey</span>
<span class="hljs-attr">authorFBID:</span> <span class="hljs-number">611217057</span>
<span class="hljs-attr">authorTwitter:</span> <span class="hljs-string">JoelMarcey</span>
<span class="hljs-meta">---</span>
<span class="hljs-string">Lorem</span> <span class="hljs-string">Ipsum...</span>
</code></pre>
<p>Will be available at <code>https://website/blog/introducing-docusaurus</code></p>
<h2><a class="anchor" aria-hidden="true" id="헤더-옵션"></a><a href="#헤더-옵션" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>헤더 옵션</h2>
<p>The only required field is <code>title</code>; however, we provide options to add author information to your blog post as well along with other options.</p>
<ul>
<li><code>author</code> - 작성자의 이름을 설정합니다.</li>
<li><code>authorURL</code> - 작성자와 관련된 URL을 설정합니다. 트위터나 깃허브, 페이스북 주소 등이 될 수 있습니다.</li>
<li><code>authorFBID</code> - 프로필 사진으로 사용할 페이스북 프로필 아이디를 설정합니다.</li>
<li><code>authorImageURL</code> - 작성자 프로필 사진 이미지 URL을 설정합니다. (참고: <code>authorFBID</code><code>authorImageURL</code>를 둘 다 설정한 경우에는 <code>authorFBID</code> 설정이 먼저 적용됩니다. <code>authorImageURL</code> 설정이 적용되기 원한다면 <code>authorFBID</code> 설정은 하지 말아야 합니다.)</li>
<li><code>title</code> - 블로그 포스트 제목을 설정합니다.</li>
<li><code>slug</code> - The blog post url slug. Example: <code>/blog/my-test-slug</code>. When not specified, the blog url slug will be extracted from the file name.</li>
<li><code>unlisted</code> - The post will be accessible by directly visiting the URL but will not show up in the sidebar in the final build; during local development, the post will still be listed. Useful in situations where you want to share a WIP post with others for feedback.</li>
<li><code>draft</code> - The post will not appear if set to <code>true</code>. Useful in situations where WIP but don't want to share the post.</li>
</ul>
<h2><a class="anchor" aria-hidden="true" id="요약-보기"></a><a href="#요약-보기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>요약 보기</h2>
<p>블로그 포스트에서 <code>&lt;!--truncate--&gt;</code> 마커를 사용하면 공개된 블로그 포스트의 요약 보기를 제공할 수 있습니다. <code>&lt;!--truncate--&gt;</code> 위에 작성한 내용이 요약 보기로 보여집니다. 예를 들면 아래와 같습니다.</p>
<pre><code class="hljs css language-yaml"><span class="hljs-meta">---</span>
<span class="hljs-attr">title:</span> <span class="hljs-string">Truncation</span> <span class="hljs-string">Example</span>
<span class="hljs-meta">---</span>
<span class="hljs-string">All</span> <span class="hljs-string">this</span> <span class="hljs-string">will</span> <span class="hljs-string">be</span> <span class="hljs-string">part</span> <span class="hljs-string">of</span> <span class="hljs-string">the</span> <span class="hljs-string">blog</span> <span class="hljs-string">post</span> <span class="hljs-string">summary.</span>
<span class="hljs-string">여기도</span> <span class="hljs-string">마찬가지구요.</span>
<span class="hljs-string">&lt;!--truncate--&gt;</span>
<span class="hljs-string"></span> <span class="hljs-string">부분부터는</span> <span class="hljs-string">요약</span> <span class="hljs-string">보기에서</span> <span class="hljs-string">표시되지</span> <span class="hljs-string">않습니다.</span>
<span class="hljs-string">여기도</span> <span class="hljs-string">표시되지</span> <span class="hljs-string">않구요.</span>
<span class="hljs-string">여기도</span> <span class="hljs-string">마찬가지</span>
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="사이드바에-표시되는-블로그-포스트-숫자-변경하기"></a><a href="#사이드바에-표시되는-블로그-포스트-숫자-변경하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>사이드바에 표시되는 블로그 포스트 숫자 변경하기</h2>
<p>사이드바에 보여지는 블로그 포스트는 최근 작성된 5개가 기본입니다.</p>
<p><code>siteConfig.js</code> 파일에서 <code>blogSidebarCount</code> 설정을 추가해서 사이드바에 표시될 블로그 숫자를 변경할 수 있습니다.</p>
<p>숫자로 포스트의 갯수를 지정하거나 <code>'ALL'</code>이라는 값을 지정할 수 있습니다.</p>
<p>예제:</p>
<pre><code class="hljs css language-js">blogSidebarCount: <span class="hljs-string">'ALL'</span>,
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="사이드바-타이틀-변경하기"></a><a href="#사이드바-타이틀-변경하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>사이드바 타이틀 변경하기</h2>
<p><code>siteConfig.js</code> 파일에서 <code>blogSidebarTitle</code> 설정을 추가해서 사이드바에 표시되는 타이틀을 변경할 수 있습니다.</p>
<p>사용할 수 있는 옵션은 <code>default</code><code>all</code>입니다. <code>default</code> 옵션에 값을 설정하면 사이드바 기본 타이틀을 변경할 수 있습니다. <code>all</code> 옵션에 값을 설정하면 <code>blogSidebarCount</code> 옵션값이 <code>'ALL'</code>인 경우에 사이드바 타이틀이 변경됩니다.</p>
<p>예제:</p>
<pre><code class="hljs css language-js">blogSidebarTitle: { <span class="hljs-attr">default</span>: <span class="hljs-string">'최근 포스트'</span>, <span class="hljs-attr">all</span>: <span class="hljs-string">'모든 블로그 포스트'</span> },
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="rss-feed"></a><a href="#rss-feed" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>RSS Feed</h2>
<p>Docusaurus provides an RSS feed for your blog posts. Both RSS and Atom feed formats are supported. This data is automatically added to your website page's HTML <code>&lt;HEAD&gt;</code> tag.</p>
<p>A summary of the post's text is provided in the RSS feed up to the <code>&lt;!--truncate--&gt;</code>. If no <code>&lt;!--truncate--&gt;</code> tag is found, then all text up to 250 characters are used.</p>
<h2><a class="anchor" aria-hidden="true" id="social-buttons"></a><a href="#social-buttons" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Social Buttons</h2>
<p>If you want Facebook and/or Twitter social buttons at the bottom of your blog posts, set the <code>facebookAppId</code> and/or <code>twitter</code> <a href="/docs/ko/site-config">site configuration</a> options in <code>siteConfig.js</code>.</p>
<h2><a class="anchor" aria-hidden="true" id="advanced-topics"></a><a href="#advanced-topics" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Advanced Topics</h2>
<h3><a class="anchor" aria-hidden="true" id="블로그-전용으로-사용할-경우"></a><a href="#블로그-전용으로-사용할-경우" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>블로그 전용으로 사용할 경우</h3>
<p>You can run your Docusaurus site without a landing page and instead have your blog load first.</p>
<p>To do this:</p>
<ol>
<li><code>website/static/</code> 디렉토리에 <code>index.html</code> 파일을 생성합니다.</li>
<li><code>website/static/index.html</code> 파일에 템플릿으로 제공되는 콘텐츠를 추가합니다.</li>
<li><code>website/static/index.html</code> 파일에서 <code>&lt;title&gt;</code> 태그 내용을 수정합니다.</li>
<li>동적인 랜딩 페이지로 만든 <code>website/pages/en/index.js</code> 파일을 삭제합니다.</li>
</ol>
<blockquote>
<p>이제 도큐사우르스를 빌드하게 되면 <code>static/index.html</code> 파일을 복사해서 사이트의 메인 디렉토리에 가져다놓게 됩니다. 방문자가 여러분의 페이지를 찾아오게 되면 정적인 파일을 제공하게 됩니다. When the page loads, it will redirect the visitor to <code>/blog</code>.</p>
</blockquote>
<p>You can use this template:</p>
<pre><code class="hljs css language-html"><span class="hljs-meta">&lt;!DOCTYPE <span class="hljs-meta-keyword">html</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">html</span> <span class="hljs-attr">lang</span>=<span class="hljs-string">"en-US"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">head</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">charset</span>=<span class="hljs-string">"UTF-8"</span> /&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">meta</span> <span class="hljs-attr">http-equiv</span>=<span class="hljs-string">"refresh"</span> <span class="hljs-attr">content</span>=<span class="hljs-string">"0; url=blog/"</span> /&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">script</span> <span class="hljs-attr">type</span>=<span class="hljs-string">"text/javascript"</span>&gt;</span><span class="javascript">
<span class="hljs-built_in">window</span>.location.href = <span class="hljs-string">'blog/'</span>;
</span><span class="hljs-tag">&lt;/<span class="hljs-name">script</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">title</span>&gt;</span>Title of Your Blog<span class="hljs-tag">&lt;/<span class="hljs-name">title</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">head</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">body</span>&gt;</span>
If you are not redirected automatically, follow this
<span class="hljs-tag">&lt;<span class="hljs-name">a</span> <span class="hljs-attr">href</span>=<span class="hljs-string">"blog/"</span>&gt;</span>link<span class="hljs-tag">&lt;/<span class="hljs-name">a</span>&gt;</span>.
<span class="hljs-tag">&lt;/<span class="hljs-name">body</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">html</span>&gt;</span>
</code></pre>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/docker"><span class="arrow-prev"></span><span>도커</span></a><a class="docs-next button" href="/docs/ko/custom-pages"><span>사용자 지정 페이지</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#초기-설정">초기 설정</a></li><li><a href="#포스트-추가하기">포스트 추가하기</a></li><li><a href="#헤더-옵션">헤더 옵션</a></li><li><a href="#요약-보기">요약 보기</a></li><li><a href="#사이드바에-표시되는-블로그-포스트-숫자-변경하기">사이드바에 표시되는 블로그 포스트 숫자 변경하기</a></li><li><a href="#사이드바-타이틀-변경하기">사이드바 타이틀 변경하기</a></li><li><a href="#rss-feed">RSS Feed</a></li><li><a href="#social-buttons">Social Buttons</a></li><li><a href="#advanced-topics">Advanced Topics</a><ul class="toc-headings"><li><a href="#블로그-전용으로-사용할-경우">블로그 전용으로 사용할 경우</a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

154
docs/ko/docker.html Normal file
View file

@ -0,0 +1,154 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Docker · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="[Docker](https://www.docker.com/)는 애플리케이션을 실행하는데 필요한 모든 것을 포함한 경량의 독립 실행형 패키지를 만들고, 배포하고, 관리할 수 있도록 만드는 도구입니다. 그것은 Docusaurus를 실행할 때 의존성으로 인한 충돌 &amp; 원하지 않는 동작을 예방할 수 있게 합니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Docker · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="[Docker](https://www.docker.com/)는 애플리케이션을 실행하는데 필요한 모든 것을 포함한 경량의 독립 실행형 패키지를 만들고, 배포하고, 관리할 수 있도록 만드는 도구입니다. 그것은 Docusaurus를 실행할 때 의존성으로 인한 충돌 &amp; 원하지 않는 동작을 예방할 수 있게 합니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/docker">English</a></li><li><a href="/docs/fr/docker">Français</a></li><li><a href="/docs/pt-BR/docker">Português (Brasil)</a></li><li><a href="/docs/ro/docker">Română</a></li><li><a href="/docs/ru/docker">Русский</a></li><li><a href="/docs/zh-CN/docker">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>시작하기</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Docker</h1></header><article><div><span><p><a href="https://www.docker.com/">Docker</a>는 애플리케이션을 실행하는데 필요한 모든 것을 포함한 경량의 독립 실행형 패키지를 만들고, 배포하고, 관리할 수 있도록 만드는 도구입니다. 그것은 Docusaurus를 실행할 때 의존성으로 인한 충돌 &amp; 원하지 않는 동작을 예방할 수 있게 합니다.</p>
<h2><a class="anchor" aria-hidden="true" id="docker로-로컬-웹서버-실행하기"></a><a href="#docker로-로컬-웹서버-실행하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Docker로 로컬 웹서버 실행하기</h2>
<p><a href="https://www.docker.com/get-started">docker</a>가 사전에 설치되어 있어야 합니다.</p>
<p>로컬 웹서버 실행하기</p>
<ol>
<li><p><strong>Build the docker image</strong> -- Enter the folder where you have Docusaurus installed. <code>docker build -t docusaurus-doc .</code></p>
<p>빌드가 완료되면, 당신은 <code>docker images</code>를 실행하여 이미지가 존재하는지 확인할 수 있습니다.</p>
<blockquote>
<p>이제 Docusaurus를 설치할 때 <code>Dockerfile</code>이 포함됩니다.</p>
</blockquote></li>
<li><p><strong>Run the Docusaurus container</strong> -- To start docker run <code>docker run --rm -p 3000:3000 docusaurus-doc</code></p>
<p><code>docusaurus-doc</code> 이미지 docker 컨테이너가 시작될 것입니다. 컨테이너에 대한 자세한 정보를 확인하려면 다음 명령을 입력 하세요: <code>docker ps</code></p></li>
</ol>
<p>To access Docusaurus from outside the docker container you must add the <code>--host</code> flag to the <code>docusaurus-start</code> command as described in: <a href="/docs/ko/commands#docusaurus-start">API Commands</a></p>
<h2><a class="anchor" aria-hidden="true" id="docker-compose-사용하기"></a><a href="#docker-compose-사용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Docker-compose 사용하기</h2>
<p><code>docker-compose</code>를 사용하여 애플리케이션을 설정할 수도 있습니다. 이 기능은 한 번의 명령으로 웹서버와 다른 부가 서비스들을 시작할 수 있게 합니다.</p>
<blockquote>
<p>Compose는 다중-컨테이너 Docker 애플리케이션을 정의하고 실행하기 위한 도구입니다. Compose는 YAML 파일을 사용하여 애플리케이션의 서비스를 구성합니다. 그렇게 하면 한번의 명령으로 당신은 모든 서비스들을 만들고 시작할 수 있습니다.</p>
</blockquote>
<p>Compose를 사용하기 위한 세 단계:</p>
<ol>
<li><p>Define your apps environment with a Dockerfile so it can be reproduced anywhere.</p></li>
<li><p>Define the services that make up your app in <code>docker-compose.yml</code> so they can be run together in an isolated environment.</p></li>
<li><p>Run <code>docker-compose up</code> and Compose starts and runs your entire app.</p></li>
</ol>
<p>프로젝트에는 기본적인 <code>docker-compose.yml</code> 파일이 포함되어 있습니다:</p>
<pre><code class="hljs css language-yml"><span class="hljs-attr">version:</span> <span class="hljs-string">'3'</span>
<span class="hljs-attr">services:</span>
<span class="hljs-attr">docusaurus:</span>
<span class="hljs-attr">build:</span> <span class="hljs-string">.</span>
<span class="hljs-attr">ports:</span>
<span class="hljs-bullet">-</span> <span class="hljs-number">3000</span><span class="hljs-string">:3000</span>
<span class="hljs-bullet">-</span> <span class="hljs-number">35729</span><span class="hljs-string">:35729</span>
<span class="hljs-attr">volumes:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./docs:/app/docs</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/blog:/app/website/blog</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/core:/app/website/core</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/i18n:/app/website/i18n</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/pages:/app/website/pages</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/static:/app/website/static</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/sidebars.json:/app/website/sidebars.json</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/siteConfig.js:/app/website/siteConfig.js</span>
<span class="hljs-attr">working_dir:</span> <span class="hljs-string">/app/website</span>
</code></pre>
<p>To run a local web server with <code>docker-compose</code> run <code>docker-compose up</code>.</p>
<p>To build static HTML pages for publishing run <code>docker-compose run docusaurus bash -c 'yarn publish-gh-pages'</code></p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/publishing"><span class="arrow-prev"></span><span>당신이 만든 사이트 배포</span></a><a class="docs-next button" href="/docs/ko/adding-blog"><span>블로그 추가</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#docker로-로컬-웹서버-실행하기">Docker로 로컬 웹서버 실행하기</a></li><li><a href="#docker-compose-사용하기">Docker-compose 사용하기</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

154
docs/ko/docker/index.html Normal file
View file

@ -0,0 +1,154 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Docker · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="[Docker](https://www.docker.com/)는 애플리케이션을 실행하는데 필요한 모든 것을 포함한 경량의 독립 실행형 패키지를 만들고, 배포하고, 관리할 수 있도록 만드는 도구입니다. 그것은 Docusaurus를 실행할 때 의존성으로 인한 충돌 &amp; 원하지 않는 동작을 예방할 수 있게 합니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Docker · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="[Docker](https://www.docker.com/)는 애플리케이션을 실행하는데 필요한 모든 것을 포함한 경량의 독립 실행형 패키지를 만들고, 배포하고, 관리할 수 있도록 만드는 도구입니다. 그것은 Docusaurus를 실행할 때 의존성으로 인한 충돌 &amp; 원하지 않는 동작을 예방할 수 있게 합니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/docker">English</a></li><li><a href="/docs/fr/docker">Français</a></li><li><a href="/docs/pt-BR/docker">Português (Brasil)</a></li><li><a href="/docs/ro/docker">Română</a></li><li><a href="/docs/ru/docker">Русский</a></li><li><a href="/docs/zh-CN/docker">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>시작하기</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Docker</h1></header><article><div><span><p><a href="https://www.docker.com/">Docker</a>는 애플리케이션을 실행하는데 필요한 모든 것을 포함한 경량의 독립 실행형 패키지를 만들고, 배포하고, 관리할 수 있도록 만드는 도구입니다. 그것은 Docusaurus를 실행할 때 의존성으로 인한 충돌 &amp; 원하지 않는 동작을 예방할 수 있게 합니다.</p>
<h2><a class="anchor" aria-hidden="true" id="docker로-로컬-웹서버-실행하기"></a><a href="#docker로-로컬-웹서버-실행하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Docker로 로컬 웹서버 실행하기</h2>
<p><a href="https://www.docker.com/get-started">docker</a>가 사전에 설치되어 있어야 합니다.</p>
<p>로컬 웹서버 실행하기</p>
<ol>
<li><p><strong>Build the docker image</strong> -- Enter the folder where you have Docusaurus installed. <code>docker build -t docusaurus-doc .</code></p>
<p>빌드가 완료되면, 당신은 <code>docker images</code>를 실행하여 이미지가 존재하는지 확인할 수 있습니다.</p>
<blockquote>
<p>이제 Docusaurus를 설치할 때 <code>Dockerfile</code>이 포함됩니다.</p>
</blockquote></li>
<li><p><strong>Run the Docusaurus container</strong> -- To start docker run <code>docker run --rm -p 3000:3000 docusaurus-doc</code></p>
<p><code>docusaurus-doc</code> 이미지 docker 컨테이너가 시작될 것입니다. 컨테이너에 대한 자세한 정보를 확인하려면 다음 명령을 입력 하세요: <code>docker ps</code></p></li>
</ol>
<p>To access Docusaurus from outside the docker container you must add the <code>--host</code> flag to the <code>docusaurus-start</code> command as described in: <a href="/docs/ko/commands#docusaurus-start">API Commands</a></p>
<h2><a class="anchor" aria-hidden="true" id="docker-compose-사용하기"></a><a href="#docker-compose-사용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Docker-compose 사용하기</h2>
<p><code>docker-compose</code>를 사용하여 애플리케이션을 설정할 수도 있습니다. 이 기능은 한 번의 명령으로 웹서버와 다른 부가 서비스들을 시작할 수 있게 합니다.</p>
<blockquote>
<p>Compose는 다중-컨테이너 Docker 애플리케이션을 정의하고 실행하기 위한 도구입니다. Compose는 YAML 파일을 사용하여 애플리케이션의 서비스를 구성합니다. 그렇게 하면 한번의 명령으로 당신은 모든 서비스들을 만들고 시작할 수 있습니다.</p>
</blockquote>
<p>Compose를 사용하기 위한 세 단계:</p>
<ol>
<li><p>Define your apps environment with a Dockerfile so it can be reproduced anywhere.</p></li>
<li><p>Define the services that make up your app in <code>docker-compose.yml</code> so they can be run together in an isolated environment.</p></li>
<li><p>Run <code>docker-compose up</code> and Compose starts and runs your entire app.</p></li>
</ol>
<p>프로젝트에는 기본적인 <code>docker-compose.yml</code> 파일이 포함되어 있습니다:</p>
<pre><code class="hljs css language-yml"><span class="hljs-attr">version:</span> <span class="hljs-string">'3'</span>
<span class="hljs-attr">services:</span>
<span class="hljs-attr">docusaurus:</span>
<span class="hljs-attr">build:</span> <span class="hljs-string">.</span>
<span class="hljs-attr">ports:</span>
<span class="hljs-bullet">-</span> <span class="hljs-number">3000</span><span class="hljs-string">:3000</span>
<span class="hljs-bullet">-</span> <span class="hljs-number">35729</span><span class="hljs-string">:35729</span>
<span class="hljs-attr">volumes:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./docs:/app/docs</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/blog:/app/website/blog</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/core:/app/website/core</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/i18n:/app/website/i18n</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/pages:/app/website/pages</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/static:/app/website/static</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/sidebars.json:/app/website/sidebars.json</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">./website/siteConfig.js:/app/website/siteConfig.js</span>
<span class="hljs-attr">working_dir:</span> <span class="hljs-string">/app/website</span>
</code></pre>
<p>To run a local web server with <code>docker-compose</code> run <code>docker-compose up</code>.</p>
<p>To build static HTML pages for publishing run <code>docker-compose run docusaurus bash -c 'yarn publish-gh-pages'</code></p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/publishing"><span class="arrow-prev"></span><span>당신이 만든 사이트 배포</span></a><a class="docs-next button" href="/docs/ko/adding-blog"><span>블로그 추가</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#docker로-로컬-웹서버-실행하기">Docker로 로컬 웹서버 실행하기</a></li><li><a href="#docker-compose-사용하기">Docker-compose 사용하기</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

200
docs/ko/installation.html Normal file
View file

@ -0,0 +1,200 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Installation · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="Docusaurus was designed from the ground up to be easily installed and used to get your website up and running quickly!"/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Installation · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="Docusaurus was designed from the ground up to be easily installed and used to get your website up and running quickly!"/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive siteNavItemActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/installation">English</a></li><li><a href="/docs/fr/installation">Français</a></li><li><a href="/docs/pt-BR/installation">Português (Brasil)</a></li><li><a href="/docs/ro/installation">Română</a></li><li><a href="/docs/ru/installation">Русский</a></li><li><a href="/docs/zh-CN/installation">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>시작하기</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Installation</h1></header><article><div><span><p>Docusaurus was designed from the ground up to be easily installed and used to get your website up and running quickly.</p>
<blockquote>
<p><strong>Important Note:</strong> we highly encourage you to use <a href="https://v2.docusaurus.io">Docusaurus 2</a> instead.</p>
</blockquote>
<h2><a class="anchor" aria-hidden="true" id="도큐사우루스-설치하기"></a><a href="#도큐사우루스-설치하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>도큐사우루스 설치하기</h2>
<p>We have created a helpful script that will get all of the infrastructure set up for you:</p>
<ol>
<li><p>먼저 <a href="https://nodejs.org/en/download/">Node</a> 최신 버전이 설치되어 있어야 합니다. 그리고 <a href="https://yarnpkg.com/en/docs/install">Yarn</a>을 미리 설치해놓는 것을 권장합니다.</p>
<blockquote>
<p>You have to be on Node &gt;= 10.9.0 and Yarn &gt;= 1.5.</p>
</blockquote></li>
<li><p>Create a project, if none exists, and change your directory to this project's root.</p>
<p>이 디렉토리에 문서를 만들겁니다. The root directory may contain other files. The Docusaurus installation script will create two new directories: <code>docs</code> and <code>website</code>.</p>
<blockquote>
<p>일반적인 경우 기존에 만들었거나 새로 만든 깃허브 프로젝트를 도큐사우르스 사이트 경로로 사용하곤 합니다. 하지만 무조건 그래야 하는 것은 아닙니다.</p>
</blockquote></li>
<li><p><code>npx docusaurus-init</code>을 입력해 도큐사우르스 설치 스크립트를 실행합니다.</p>
<blockquote>
<p>사용하는 Node 버전이 8.2 미만인 경우에는 도큐사우르스를 글로벌로 설치하는 것이 좋습니다. <code>yarn global add docusaurus-init</code> 또는 <code>npm install --global docusaurus-init</code> 명령어를 먼저 실행합니다. 그리고 나서 <code>docusaurus-init</code> 명령어를 사용해 도큐사우르스 설치 스크립트를 실행합니다.</p>
</blockquote></li>
</ol>
<h2><a class="anchor" aria-hidden="true" id="verifying-installation"></a><a href="#verifying-installation" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Verifying Installation</h2>
<p>Along with previously existing files and directories, your root directory will now contain a structure similar to:</p>
<pre><code class="hljs css language-bash">root-directory
├── Dockerfile
├── README.md
├── docker-compose.yml
├── docs
│ ├── doc1.md
│ ├── doc2.md
│ ├── doc3.md
│ ├── exampledoc4.md
│ └── exampledoc5.md
└── website
├── blog
│ ├── 2016-03-11-blog-post.md
│ ├── 2017-04-10-blog-post-two.md
│ ├── 2017-09-25-testing-rss.md
│ ├── 2017-09-26-adding-rss.md
│ └── 2017-10-24-new-version-1.0.0.md
├── core
│ └── Footer.js
├── package.json
├── pages
├── sidebars.json
├── siteConfig.js
└── static
</code></pre>
<blockquote>
<p>This installation creates some Docker files that are not necessary to run docusaurus. They may be deleted without issue in the interest of saving space. For more information on Docker, please see the <a href="https://docs.docker.com/">Docker documentation</a>.</p>
</blockquote>
<h2><a class="anchor" aria-hidden="true" id="예제-웹사이트-실행하기"></a><a href="#예제-웹사이트-실행하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>예제 웹사이트 실행하기</h2>
<p>After running the Docusaurus initialization script, <code>docusaurus-init</code> as described in the <a href="#installing-docusaurus">Installation</a> section, you will have a runnable, example website to use as your site's base. 아래와 같이 예제 웹사이트를 실행할 수 있습니다.</p>
<ol>
<li><p><code>cd website</code></p></li>
<li><p>From within the <code>website</code> directory, run the local web server using <code>yarn start</code> or <code>npm start</code>.</p></li>
<li><p>Load the example site at <a href="http://localhost:3000">http://localhost:3000</a> if it did not already open automatically. 만일 3000 포트가 이미 사용중이라면, 다른 포트가 사용될 것입니다. 콘솔 메시지를 통해 사용되는 포트를 확인 할 수 있습니다.</p>
<p>You should see the example site loaded in your web browser. There's also a LiveReload server running and any changes made to the docs and files in the <code>website</code> directory will cause the page to refresh. 웹사이트 테마에 사용되는 주색상과 보조색상은 랜덤으로 생성됩니다.</p></li>
</ol>
<p><img src="/img/getting-started-preparation-verify.png" alt=""></p>
<h3><a class="anchor" aria-hidden="true" id="프록시-설정을-무시하고-서버-실행하기"></a><a href="#프록시-설정을-무시하고-서버-실행하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>프록시 설정을 무시하고 서버 실행하기</h3>
<p>If you are behind a corporate proxy, you need to disable it for the development server requests. It can be done using the <code>NO_PROXY</code> environment variable.</p>
<pre><code class="hljs css language-sh">SET NO_PROXY=localhost
yarn start (또는 npm run start)
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="updating-your-docusaurus-version"></a><a href="#updating-your-docusaurus-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Updating Your Docusaurus Version</h2>
<p>도큐사우르스를 설치한 후에 <code>website</code> 디렉토리 위치에서 <code>yarn outdated docusaurus</code> 또는 <code>npm outdated docusaurus</code> 명령어를 실행하면 최신 버전의 도큐사우르스를 확인할 수 있습니다.</p>
<p>You will see something like this:</p>
<pre><code class="hljs">$ yarn outdated
<span class="hljs-keyword">Using</span> globally installed <span class="hljs-keyword">version</span> <span class="hljs-keyword">of</span> Yarn
yarn outdated v1<span class="hljs-number">.5</span><span class="hljs-number">.1</span>
<span class="hljs-built_in">warning</span> package.json: <span class="hljs-keyword">No</span> license field
<span class="hljs-built_in">warning</span> <span class="hljs-keyword">No</span> license field
<span class="hljs-keyword">info</span> Color legend :
"&lt;red&gt;" : Major <span class="hljs-keyword">Update</span> backward-incompatible updates
"&lt;yellow&gt;" : Minor <span class="hljs-keyword">Update</span> backward-compatible features
"&lt;green&gt;" : Patch <span class="hljs-keyword">Update</span> backward-compatible bug fixes
Package <span class="hljs-keyword">Current</span> Wanted Latest Package <span class="hljs-keyword">Type</span> URL
docusaurus <span class="hljs-number">1.0</span><span class="hljs-number">.9</span> <span class="hljs-number">1.2</span><span class="hljs-number">.0</span> <span class="hljs-number">1.2</span><span class="hljs-number">.0</span> devDependencies https://github.com/facebook/docusaurus#readme
✨ Done <span class="hljs-keyword">in</span> <span class="hljs-number">0.41</span>s.
</code></pre>
<blockquote>
<p><code>outdated</code> 명령어를 실행했을때 설치할 버전 안내가 없다면 최신 버전이 설치된 상태입니다.</p>
</blockquote>
<p>You can update to the <a href="https://www.npmjs.com/package/docusaurus">latest version</a> of Docusaurus by:</p>
<pre><code class="hljs">yarn<span class="hljs-built_in"> upgrade </span>docusaurus --latest
</code></pre>
<p>또는</p>
<pre><code class="hljs"><span class="hljs-built_in">npm</span> update docusaurus
</code></pre>
<blockquote>
<p>업그레이드 후에 에러가 발생한다면 바벨 캐시(일반적으로 <a href="https://babeljs.io/docs/en/babel-register/#environment-variables">temporary directory</a>에 쌓여있습니다)를 삭제해보거나 도큐사우르스 서버(<code>yarn start</code> 명령어로 실행하는) 설정 중에서 <code>BABEL_DISABLE_CACHE=1</code> 값을 변경해봅니다.</p>
</blockquote>
</span></div></article></div><div class="docs-prevnext"><a class="docs-next button" href="/docs/ko/site-preparation"><span>사이트 준비</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#도큐사우루스-설치하기">도큐사우루스 설치하기</a></li><li><a href="#verifying-installation">Verifying Installation</a></li><li><a href="#예제-웹사이트-실행하기">예제 웹사이트 실행하기</a><ul class="toc-headings"><li><a href="#프록시-설정을-무시하고-서버-실행하기">프록시 설정을 무시하고 서버 실행하기</a></li></ul></li><li><a href="#updating-your-docusaurus-version">Updating Your Docusaurus Version</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,200 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Installation · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="Docusaurus was designed from the ground up to be easily installed and used to get your website up and running quickly!"/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Installation · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="Docusaurus was designed from the ground up to be easily installed and used to get your website up and running quickly!"/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive siteNavItemActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/installation">English</a></li><li><a href="/docs/fr/installation">Français</a></li><li><a href="/docs/pt-BR/installation">Português (Brasil)</a></li><li><a href="/docs/ro/installation">Română</a></li><li><a href="/docs/ru/installation">Русский</a></li><li><a href="/docs/zh-CN/installation">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>시작하기</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Installation</h1></header><article><div><span><p>Docusaurus was designed from the ground up to be easily installed and used to get your website up and running quickly.</p>
<blockquote>
<p><strong>Important Note:</strong> we highly encourage you to use <a href="https://v2.docusaurus.io">Docusaurus 2</a> instead.</p>
</blockquote>
<h2><a class="anchor" aria-hidden="true" id="도큐사우루스-설치하기"></a><a href="#도큐사우루스-설치하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>도큐사우루스 설치하기</h2>
<p>We have created a helpful script that will get all of the infrastructure set up for you:</p>
<ol>
<li><p>먼저 <a href="https://nodejs.org/en/download/">Node</a> 최신 버전이 설치되어 있어야 합니다. 그리고 <a href="https://yarnpkg.com/en/docs/install">Yarn</a>을 미리 설치해놓는 것을 권장합니다.</p>
<blockquote>
<p>You have to be on Node &gt;= 10.9.0 and Yarn &gt;= 1.5.</p>
</blockquote></li>
<li><p>Create a project, if none exists, and change your directory to this project's root.</p>
<p>이 디렉토리에 문서를 만들겁니다. The root directory may contain other files. The Docusaurus installation script will create two new directories: <code>docs</code> and <code>website</code>.</p>
<blockquote>
<p>일반적인 경우 기존에 만들었거나 새로 만든 깃허브 프로젝트를 도큐사우르스 사이트 경로로 사용하곤 합니다. 하지만 무조건 그래야 하는 것은 아닙니다.</p>
</blockquote></li>
<li><p><code>npx docusaurus-init</code>을 입력해 도큐사우르스 설치 스크립트를 실행합니다.</p>
<blockquote>
<p>사용하는 Node 버전이 8.2 미만인 경우에는 도큐사우르스를 글로벌로 설치하는 것이 좋습니다. <code>yarn global add docusaurus-init</code> 또는 <code>npm install --global docusaurus-init</code> 명령어를 먼저 실행합니다. 그리고 나서 <code>docusaurus-init</code> 명령어를 사용해 도큐사우르스 설치 스크립트를 실행합니다.</p>
</blockquote></li>
</ol>
<h2><a class="anchor" aria-hidden="true" id="verifying-installation"></a><a href="#verifying-installation" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Verifying Installation</h2>
<p>Along with previously existing files and directories, your root directory will now contain a structure similar to:</p>
<pre><code class="hljs css language-bash">root-directory
├── Dockerfile
├── README.md
├── docker-compose.yml
├── docs
│ ├── doc1.md
│ ├── doc2.md
│ ├── doc3.md
│ ├── exampledoc4.md
│ └── exampledoc5.md
└── website
├── blog
│ ├── 2016-03-11-blog-post.md
│ ├── 2017-04-10-blog-post-two.md
│ ├── 2017-09-25-testing-rss.md
│ ├── 2017-09-26-adding-rss.md
│ └── 2017-10-24-new-version-1.0.0.md
├── core
│ └── Footer.js
├── package.json
├── pages
├── sidebars.json
├── siteConfig.js
└── static
</code></pre>
<blockquote>
<p>This installation creates some Docker files that are not necessary to run docusaurus. They may be deleted without issue in the interest of saving space. For more information on Docker, please see the <a href="https://docs.docker.com/">Docker documentation</a>.</p>
</blockquote>
<h2><a class="anchor" aria-hidden="true" id="예제-웹사이트-실행하기"></a><a href="#예제-웹사이트-실행하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>예제 웹사이트 실행하기</h2>
<p>After running the Docusaurus initialization script, <code>docusaurus-init</code> as described in the <a href="#installing-docusaurus">Installation</a> section, you will have a runnable, example website to use as your site's base. 아래와 같이 예제 웹사이트를 실행할 수 있습니다.</p>
<ol>
<li><p><code>cd website</code></p></li>
<li><p>From within the <code>website</code> directory, run the local web server using <code>yarn start</code> or <code>npm start</code>.</p></li>
<li><p>Load the example site at <a href="http://localhost:3000">http://localhost:3000</a> if it did not already open automatically. 만일 3000 포트가 이미 사용중이라면, 다른 포트가 사용될 것입니다. 콘솔 메시지를 통해 사용되는 포트를 확인 할 수 있습니다.</p>
<p>You should see the example site loaded in your web browser. There's also a LiveReload server running and any changes made to the docs and files in the <code>website</code> directory will cause the page to refresh. 웹사이트 테마에 사용되는 주색상과 보조색상은 랜덤으로 생성됩니다.</p></li>
</ol>
<p><img src="/img/getting-started-preparation-verify.png" alt=""></p>
<h3><a class="anchor" aria-hidden="true" id="프록시-설정을-무시하고-서버-실행하기"></a><a href="#프록시-설정을-무시하고-서버-실행하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>프록시 설정을 무시하고 서버 실행하기</h3>
<p>If you are behind a corporate proxy, you need to disable it for the development server requests. It can be done using the <code>NO_PROXY</code> environment variable.</p>
<pre><code class="hljs css language-sh">SET NO_PROXY=localhost
yarn start (또는 npm run start)
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="updating-your-docusaurus-version"></a><a href="#updating-your-docusaurus-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Updating Your Docusaurus Version</h2>
<p>도큐사우르스를 설치한 후에 <code>website</code> 디렉토리 위치에서 <code>yarn outdated docusaurus</code> 또는 <code>npm outdated docusaurus</code> 명령어를 실행하면 최신 버전의 도큐사우르스를 확인할 수 있습니다.</p>
<p>You will see something like this:</p>
<pre><code class="hljs">$ yarn outdated
<span class="hljs-keyword">Using</span> globally installed <span class="hljs-keyword">version</span> <span class="hljs-keyword">of</span> Yarn
yarn outdated v1<span class="hljs-number">.5</span><span class="hljs-number">.1</span>
<span class="hljs-built_in">warning</span> package.json: <span class="hljs-keyword">No</span> license field
<span class="hljs-built_in">warning</span> <span class="hljs-keyword">No</span> license field
<span class="hljs-keyword">info</span> Color legend :
"&lt;red&gt;" : Major <span class="hljs-keyword">Update</span> backward-incompatible updates
"&lt;yellow&gt;" : Minor <span class="hljs-keyword">Update</span> backward-compatible features
"&lt;green&gt;" : Patch <span class="hljs-keyword">Update</span> backward-compatible bug fixes
Package <span class="hljs-keyword">Current</span> Wanted Latest Package <span class="hljs-keyword">Type</span> URL
docusaurus <span class="hljs-number">1.0</span><span class="hljs-number">.9</span> <span class="hljs-number">1.2</span><span class="hljs-number">.0</span> <span class="hljs-number">1.2</span><span class="hljs-number">.0</span> devDependencies https://github.com/facebook/docusaurus#readme
✨ Done <span class="hljs-keyword">in</span> <span class="hljs-number">0.41</span>s.
</code></pre>
<blockquote>
<p><code>outdated</code> 명령어를 실행했을때 설치할 버전 안내가 없다면 최신 버전이 설치된 상태입니다.</p>
</blockquote>
<p>You can update to the <a href="https://www.npmjs.com/package/docusaurus">latest version</a> of Docusaurus by:</p>
<pre><code class="hljs">yarn<span class="hljs-built_in"> upgrade </span>docusaurus --latest
</code></pre>
<p>또는</p>
<pre><code class="hljs"><span class="hljs-built_in">npm</span> update docusaurus
</code></pre>
<blockquote>
<p>업그레이드 후에 에러가 발생한다면 바벨 캐시(일반적으로 <a href="https://babeljs.io/docs/en/babel-register/#environment-variables">temporary directory</a>에 쌓여있습니다)를 삭제해보거나 도큐사우르스 서버(<code>yarn start</code> 명령어로 실행하는) 설정 중에서 <code>BABEL_DISABLE_CACHE=1</code> 값을 변경해봅니다.</p>
</blockquote>
</span></div></article></div><div class="docs-prevnext"><a class="docs-next button" href="/docs/ko/site-preparation"><span>사이트 준비</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#도큐사우루스-설치하기">도큐사우루스 설치하기</a></li><li><a href="#verifying-installation">Verifying Installation</a></li><li><a href="#예제-웹사이트-실행하기">예제 웹사이트 실행하기</a><ul class="toc-headings"><li><a href="#프록시-설정을-무시하고-서버-실행하기">프록시 설정을 무시하고 서버 실행하기</a></li></ul></li><li><a href="#updating-your-docusaurus-version">Updating Your Docusaurus Version</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

447
docs/ko/publishing.html Normal file
View file

@ -0,0 +1,447 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Publishing your site · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="여러분은 이제 [기본 사이트 구조 만들기와 로컬에서 실행하기](/docs/ko/site-creation)를 성공적으로 수행했습니다. 이번에는 [원하는 형태로 수정하기](/docs/ko/site-config) 과정을 통해 링크를 생성하고 다른 사용자에게 공개하는 방법을 살펴봅니다. 도큐사우르스는 정적인 HTML로 만들어진 웹사이트를 생성합니다. 생성된 HTML 파일을 여러분의 웹서버나 호스팅 업체에서 제공하는 공간에 옮기기만 하면 됩니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Publishing your site · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="여러분은 이제 [기본 사이트 구조 만들기와 로컬에서 실행하기](/docs/ko/site-creation)를 성공적으로 수행했습니다. 이번에는 [원하는 형태로 수정하기](/docs/ko/site-config) 과정을 통해 링크를 생성하고 다른 사용자에게 공개하는 방법을 살펴봅니다. 도큐사우르스는 정적인 HTML로 만들어진 웹사이트를 생성합니다. 생성된 HTML 파일을 여러분의 웹서버나 호스팅 업체에서 제공하는 공간에 옮기기만 하면 됩니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/publishing">English</a></li><li><a href="/docs/fr/publishing">Français</a></li><li><a href="/docs/pt-BR/publishing">Português (Brasil)</a></li><li><a href="/docs/ro/publishing">Română</a></li><li><a href="/docs/ru/publishing">Русский</a></li><li><a href="/docs/zh-CN/publishing">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>시작하기</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Publishing your site</h1></header><article><div><span><p>여러분은 이제 <a href="/docs/ko/site-creation">기본 사이트 구조 만들기와 로컬에서 실행하기</a>를 성공적으로 수행했습니다. 이번에는 <a href="/docs/ko/site-config">원하는 형태로 수정하기</a> 과정을 통해 링크를 생성하고 다른 사용자에게 공개하는 방법을 살펴봅니다. 도큐사우르스는 정적인 HTML로 만들어진 웹사이트를 생성합니다. 생성된 HTML 파일을 여러분의 웹서버나 호스팅 업체에서 제공하는 공간에 옮기기만 하면 됩니다.</p>
<h2><a class="anchor" aria-hidden="true" id="정적-html-페이지-만들기"></a><a href="#정적-html-페이지-만들기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>정적 HTML 페이지 만들기</h2>
<p>여러분의 웹사이트 정적 빌드를 실행하기 위해서는 <code>website</code> 디렉토리 위치에서 아래 명령어를 실행합니다.</p>
<pre><code class="hljs css language-bash">yarn run build <span class="hljs-comment"># 또는 `npm run build`</span>
</code></pre>
<p>명령어가 실행되면 <code>build</code> 디렉토리가 <code>website</code> 디렉토리 아래 생성됩니다. 생성된 디렉토리에는 작성한 문서가 <code>.html</code> 파일로 생성되며 <code>pages</code> 디렉토리 안에 있던 콘텐츠도 같이 생성됩니다.</p>
<h2><a class="anchor" aria-hidden="true" id="정적-html-페이지-호스팅하기"></a><a href="#정적-html-페이지-호스팅하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>정적 HTML 페이지 호스팅하기</h2>
<p>이제 <code>website/build</code> 디렉토리에 생성된 모든 파일을 여러분이 선택한 웹서버 <code>html</code> 디렉토리 아래로 복사합니다.</p>
<blockquote>
<p>예를 들어, Apache와 Nginx 모두 <code>/var/www/html</code> 기본 컨텐츠 제공 경로 입니다. 어떤 웹서버나 호스팅 업체를 사용할지는 도큐사우르스에서 권할 문제는 아니라 여기서 언급하지는 않겠습니다.</p>
</blockquote>
<blockquote>
<p>여러분의 웹서버에서 사이트를 서비스하는 경우에는 웹서버에서 적절한 HTTP 헤더값을 가지고 리소스 파일을 제공해주어야 합니다. CSS 파일은 헤더 <code>content-type</code> 값을 <code>text/css</code>으로 설정해야 합니다. Nginx의 경우는 <code>nginx.conf</code> 파일에 <code>include /etc/nginx/mime.types;</code> 을 설정하는 것을 의미합니다. See <a href="https://github.com/facebook/docusaurus/issues/602">this issue</a> for more info.</p>
</blockquote>
<h3><a class="anchor" aria-hidden="true" id="호스팅-서비스-활용하기"></a><a href="#호스팅-서비스-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>호스팅 서비스 활용하기</h3>
<ul>
<li><a href="#using-vercel">Vercel</a></li>
<li><a href="#using-github-pages">GitHub 페이지</a></li>
<li><a href="#hosting-on-netlify">Netlify</a></li>
<li><a href="#hosting-on-render">Render</a></li>
</ul>
<h3><a class="anchor" aria-hidden="true" id="using-vercel"></a><a href="#using-vercel" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using Vercel</h3>
<p>Deploying your Docusaurus project to <a href="https://vercel.com">Vercel</a> will provide you with various benefits in the areas of performance and ease of use.</p>
<p>Most importantly, however, deploying a Docusaurus project only takes a couple of seconds:</p>
<ol>
<li>First, install their <a href="https://vercel.com/download">command-line interface</a>:</li>
</ol>
<pre><code class="hljs css language-bash">npm i -g vercel
</code></pre>
<ol start="2">
<li>다음 명령어를 프로젝트 루트 디렉토리에서 실행하세요:</li>
</ol>
<pre><code class="hljs css language-bash">vercel
</code></pre>
<p><strong>That's all.</strong> Your docs will automatically be deployed.</p>
<blockquote>
<p>Note that the directory structure Now supports is slightly different from the default directory structure of a Docusaurus project - The <code>docs</code> directory has to be within the <code>website</code> directory, ideally following the directory structure in this example. You will also have to specify a <code>customDocsPath</code> value in <code>siteConfig.js</code>. Take a look at the <a href="https://github.com/vercel/vercel/tree/master/examples/docusaurus">now-examples repository for a Docusaurus project</a>.</p>
</blockquote>
<h3><a class="anchor" aria-hidden="true" id="github-페이지-활용하기"></a><a href="#github-페이지-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>GitHub 페이지 활용하기</h3>
<p>Docusaurus was designed to work well with one of the most popular hosting solutions for open source projects: <a href="https://pages.github.com/">GitHub Pages</a>.</p>
<h4><a class="anchor" aria-hidden="true" id="deploying-to-github-pages"></a><a href="#deploying-to-github-pages" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Deploying to GitHub Pages</h4>
<ol>
<li>Docusaurus supports deploying as <a href="https://help.github.com/articles/user-organization-and-project-pages">project pages or user/organization pages</a>, your code repository does not even need to be public.</li>
</ol>
<blockquote>
<p>코드 저장소가 프라이빗 상태라고 하더라도 <code>gh-pages</code> 브랜치에 배포되는 내용은 <a href="https://help.github.com/articles/user-organization-and-project-pages/">퍼블릭</a> 상태가 됩니다.</p>
</blockquote>
<p><strong>Note:</strong> When you deploy as user/organization page, the publish script will deploy these sites to the root of the <strong><code>master</code></strong> branch of the <em>username</em>.github.io repo. In this case, note that you will want to have the Docusaurus infra, your docs, etc. either in <strong>another branch of the <em>username</em>.github.io repo</strong> (e.g., maybe call it <code>source</code>), or in another, separate repo (e.g. in the same as the documented source code).</p>
<ol start="2">
<li>You will need to modify the file <code>website/siteConfig.js</code> and add the required parameters.</li>
</ol>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>organizationName</code></td><td>코드 저장소를 소유하고 있는 GitHub 사용자 또는 그룹 계정입니다. If you are the owner, then it is your GitHub username. In the case of Docusaurus, that would be the &quot;<em>facebook</em>&quot; GitHub organization.</td></tr>
<tr><td><code>projectName</code></td><td>프로젝트에서 사용하고 있는 GitHub 저장소의 이름입니다. For example, the source code for Docusaurus is hosted at <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a>, so our project name, in this case, would be &quot;docusaurus&quot;.</td></tr>
<tr><td><code>url</code></td><td>Your website's URL. For projects hosted on GitHub pages, this will be &quot;https://<em>username</em>.github.io&quot;</td></tr>
<tr><td><code>baseUrl</code></td><td>Base URL for your project. For projects hosted on GitHub pages, it follows the format &quot;/<em>projectName</em>/&quot;. For <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a>, <code>baseUrl</code> is <code>/docusaurus/</code>.</td></tr>
</tbody>
</table>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
url: <span class="hljs-string">'https://__userName__.github.io'</span>, <span class="hljs-comment">// Your website URL</span>
<span class="hljs-attr">baseUrl</span>: <span class="hljs-string">'/testProject/'</span>,
<span class="hljs-attr">projectName</span>: <span class="hljs-string">'testProject'</span>,
<span class="hljs-attr">organizationName</span>: <span class="hljs-string">'userName'</span>
...
}
</code></pre>
<p>In case you want to deploy as a user or organization site, specify the project name as <code>&lt;username&gt;.github.io</code> or <code>&lt;orgname&gt;.github.io</code>. E.g. If your GitHub username is &quot;user42&quot; then <em>user42.github.io</em>, or in the case of an organization name of &quot;org123&quot;, it will be <em>org123.github.io</em>.</p>
<p><strong>Note:</strong> Not setting the <code>url</code> and <code>baseUrl</code> of your project might result in incorrect file paths generated which can cause broken links to assets paths like stylesheets and images.</p>
<blockquote>
<p><code>projectName</code><code>organizationName</code> 설정은 <code>siteConfig.js</code> 파일에서 관리하는 것을 권장합니다. 물론, 환경 변수에서 <code>ORGANIZATION_NAME</code>, <code>PROJECT_NAME</code> 값을 지정하는 방법도 사용할 수 있습니다.</p>
</blockquote>
<ol start="3">
<li>Now you have to specify the git user as an environment variable, and run the script <a href="/docs/ko/commands#docusaurus-publish"><code>publish-gh-pages</code></a></li>
</ol>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>GIT_USER</code></td><td>The username for a GitHub account that has to commit access to this repo. For your repositories, this will usually be your own GitHub username. <code>GIT_USER</code><code>organizationName</code><code>projectName</code>의 조합으로 지정된 저장소에 푸시 권한을 가지고 있어야 합니다.</td></tr>
</tbody>
</table>
<p>명령행에서 스크립트를 바로 실행하기 위해서는 적절하게 파라미터 값을 채워주어야 합니다.</p>
<p><strong>Bash</strong></p>
<pre><code class="hljs css language-bash">GIT_USER=&lt;GIT_USER&gt; \
CURRENT_BRANCH=master \
USE_SSH=<span class="hljs-literal">true</span> \
yarn run publish-gh-pages <span class="hljs-comment"># 또는 `npm run publish-gh-pages`</span>
</code></pre>
<p><strong>Windows</strong></p>
<pre><code class="hljs css language-batch">cmd /C <span class="hljs-string">"set "</span><span class="hljs-attribute">GIT_USER</span>=&lt;GIT_USER&gt;"&amp;&amp; <span class="hljs-builtin-name">set</span> <span class="hljs-attribute">CURRENT_BRANCH</span>=master &amp;&amp; <span class="hljs-builtin-name">set</span> <span class="hljs-attribute">USE_SSH</span>=<span class="hljs-literal">true</span> &amp;&amp; yarn <span class="hljs-builtin-name">run</span> publish-gh-pages<span class="hljs-string">"
</span></code></pre>
<p>환경 변수로 설정할 수 있는 추가적인 2가지 파라미터는 아래와 같습니다.</p>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>USE_SSH</code></td><td><code>true</code>로 값을 설정하면 GitHub 저장소 연결 시 HTTPS 대신 SSH를 사용합니다. 변수값을 설정하지 않으면 HTTPS가 기본으로 설정됩니다.</td></tr>
<tr><td><code>CURRENT_BRANCH</code></td><td>배포될 최신 문서를 포함하고 있는 브랜치를 지정합니다. 일반적인 경우는 <code>master</code> 브랜치가 되겠지만, <code>gh-pages</code>를 제외한 어떤 브랜치(기본값 또는 다른)를 사용해도 괜찮습니다. 변수값을 설정하지 않으면 현재 브랜치를 사용합니다.</td></tr>
</tbody>
</table>
<p>SSH 키 관련 문제가 발생한다면 <a href="https://help.github.com/articles/connecting-to-github-with-ssh/">GitHub's authentication documentation</a> 페이지 정보를 참고하세요.</p>
<p>You should now be able to load your website by visiting its GitHub Pages URL, which could be something along the lines of https://<em>username</em>.github.io/<em>projectName</em>, or a custom domain if you have set that up. For example, Docusaurus' own GitHub Pages URL is <a href="https://facebook.github.io/Docusaurus">https://facebook.github.io/Docusaurus</a> because it is served from the <code>gh-pages</code> branch of the <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a> GitHub repository. However, it can also be accessed via <a href="https://docusaurus.io/">https://docusaurus.io/</a>, via a generated <code>CNAME</code> file which can be configured via the <code>cname</code> <a href="/docs/ko/site-config#cname-string">siteConfig option</a>.</p>
<p>서비스가 어떻게 동작하는지 궁금하다면 <a href="https://pages.github.com">GitHub Pages documentation</a> 페이지 정보를 참고하세요.</p>
<p>문서를 수정해서 변경된 내용을 사이트에 배포하고자 한다면 위에 있는 명령어를 실행하기만 하면 됩니다. 문서의 변경이 거의 발생하지 않는다면 스크립트를 수동으로 실행하는 방식이 더 좋은 선택입니다. 수동으로 변경된 항목을 배포하는 것은 그리 귀찮은 일은 아닙니다.</p>
<p>하지만, 지속적인 통합(CI) 프로세스를 만들고자 한다면 자동으로 배포되는 작업을 구성할 수도 있습니다.</p>
<h2><a class="anchor" aria-hidden="true" id="지속적인-통합-환경에서-자동으로-배포하기"></a><a href="#지속적인-통합-환경에서-자동으로-배포하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>지속적인 통합 환경에서 자동으로 배포하기</h2>
<p>지속적인 통합 (CI) 서비스는 소스 콘트롤에 새로운 커밋이 발생할때마다 반복적으로 발생하는 작업을 처리하기 위해 사용합니다. 지속적인 통합 환경에서는 단위 테스트, 통합 테스트, 자동 빌드, NPM 배포 그리고 변경된 내용을 웹사이트에 배포하기 같은 복합적인 작업을 처리할 수 있습니다. All you need to do to automate the deployment of your website is to invoke the <code>publish-gh-pages</code> script whenever your docs get updated. In the following section, we'll be covering how to do just that using <a href="https://circleci.com/">CircleCI</a>, a popular continuous integration service provider.</p>
<h3><a class="anchor" aria-hidden="true" id="using-circleci-20"></a><a href="#using-circleci-20" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using CircleCI 2.0</h3>
<p>Circle Ci에 대한 정보가 필요하다면 <a href="https://circleci.com/signup/">setup CircleCI</a> 페이지 정보를 참고하세요. 여러분의 사이트와 문서를 CircleCI를 통해 자동으로 배포하고자 한다면 <code>publish-gh-pages</code> 스크립트가 배포 단계에서 실행될 수 있도록 Circle 설정을 변경해주기만 하면 됩니다. 아래와 같은 단계로 설정을 변경할 수 있습니다.</p>
<ol>
<li><code>GIT_USER</code>에 설정한 GitHub 사용자 계정은 문서가 있는 저장소 <code>쓰기</code> 권한을 가지고 있어야 합니다. 저장소에서 <code>Settings | Collaborators &amp; teams</code> 메뉴에서 설정을 변경할 수 있습니다.</li>
<li><code>GIT_USER</code>에 지정한 사용자로 GitHub 사이트에 로그인합니다.</li>
<li><a href="Https://github.com/settings/tokens">Https://github.com/settings/tokens</a> URL로 접근해서 <code>GIT_USER</code>를 위한 <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">personal access token</a>을 생성합니다. 접근 범위 설정 시 <code>repository</code>를 선택하면 프라이빗 저장소에 대한 모든 권한을 부여할 수 있습니다. 생성한 토큰은 안전한 곳에 보관하고 외부에 노출되지 않도록 합니다. 토큰은 GitHub 비밀번호를 대신해 GitHub에서 처리하고자하는 모든 작업에 대한 인증 작업을 수행합니다.</li>
<li>Open your CircleCI dashboard, and navigate to the Settings page for your repository, then select &quot;Environment variables&quot;. URL은 <a href="https://circleci.com/gh/ORG/REPO/edit#env-vars와">https://circleci.com/gh/ORG/REPO/edit#env-vars와</a> 같은 형식인데, &quot;ORG/REPO&quot; 부분은 여러분의 GitHub 그룹 계정/저장소로 변경합니다.</li>
<li><code>GITHUB_TOKEN</code>라는 이름으로 새로운 환경 변수를 생성하고 앞에서 생성된 액세스 토큰을 값으로 지정합니다.</li>
<li><code>.circleci</code> 이라는 이름으로 디렉토리를 생성하고 <code>config.yml</code> 파일을 만들어서 넣어줍니다.</li>
<li>아래에 있는 내용을 <code>.circleci/config.yml</code> 파일에 채워줍니다.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># If you only want the circle to run on direct commits to master, you can uncomment this out</span>
<span class="hljs-comment"># and uncomment the filters: *filter-only-master down below too</span>
<span class="hljs-comment">#</span>
<span class="hljs-comment"># aliases:</span>
<span class="hljs-comment"># - &amp;filter-only-master</span>
<span class="hljs-comment"># branches:</span>
<span class="hljs-comment"># only:</span>
<span class="hljs-comment"># - master</span>
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
<span class="hljs-attr">jobs:</span>
<span class="hljs-attr">deploy-website:</span>
<span class="hljs-attr">docker:</span>
<span class="hljs-comment"># specify the version you desire here</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">image:</span> <span class="hljs-string">circleci/node:8.11.1</span>
<span class="hljs-attr">steps:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">checkout</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">run:</span>
<span class="hljs-attr">name:</span> <span class="hljs-string">Deploying</span> <span class="hljs-string">to</span> <span class="hljs-string">GitHub</span> <span class="hljs-string">Pages</span>
<span class="hljs-attr">command:</span> <span class="hljs-string">|
git config --global user.email "&lt;GITHUB_USERNAME&gt;@users.noreply.github.com"
git config --global user.name "&lt;YOUR_NAME&gt;"
echo "machine github.com login &lt;GITHUB_USERNAME&gt; password $GITHUB_TOKEN" &gt; ~/.netrc
cd website &amp;&amp; yarn install &amp;&amp; GIT_USER=&lt;GIT_USER&gt; yarn run publish-gh-pages
</span>
<span class="hljs-attr">workflows:</span>
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
<span class="hljs-attr">build_and_deploy:</span>
<span class="hljs-attr">jobs:</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">deploy-website:</span>
<span class="hljs-comment"># filters: *filter-only-master</span>
</code></pre>
<p><code>command:</code> 항목에서 <code>&lt;....&gt;</code>로 표시된 부분은 적절한 값으로 변경해주어야 합니다. <code>&lt;GIT_USER&gt;</code> 항목은 GitHub 저장소에 문서를 집어넣기 위한 권한을 가지고 있는 GitHub 사용자 계정을 지정해줍니다. 대부분의 경우 <code>&lt;GIT_USER&gt;</code><code>&lt;GITHUB_USERNAME&gt;</code>은 같은 값을 사용합니다.</p>
<p><strong>DO NOT</strong> place the actual value of <code>$GITHUB_TOKEN</code> in <code>circle.yml</code>. We already configured that as an environment variable back in Step 5.</p>
<blockquote>
<p>GitHub 저장소 접근 시 SSH를 사용하고자 한다면 <code>USE_SSH=true</code>을 설정하면 됩니다. SSH 설정을 적용하면 설정된 값은 다음과 같은 형식이 됩니다. <code>cd website &amp;&amp; npm install &amp;&amp; GIT_USER=&lt;GIT_USER&gt; USE_SSH=true npm run publish-gh-pages</code>.</p>
</blockquote>
<blockquote>
<p>Unlike when you run the <code>publish-gh-pages</code> script manually when the script runs within the Circle environment, the value of <code>CURRENT_BRANCH</code> is already defined as an <a href="https://circleci.com/docs/1.0/environment-variables/">environment variable within CircleCI</a> and will be picked up by the script automatically.</p>
</blockquote>
<p>이제 <code>master</code> 브랜치에 새로운 커밋이 발생하게 되면 CircleCI는 여러분의 테스트 스위트가 실행되고 모든 테스트가 통과되면 <code>publish-gh-pages</code> 스크립트가 실행되어 여러분의 웹사이트를 배포하게 됩니다.</p>
<blockquote>
<p>If you would rather use a deploy key instead of a personal access token, you can by starting with the CircleCI <a href="https://circleci.com/docs/1.0/adding-read-write-deployment-key/">instructions</a> for adding a read/write deploy key.</p>
</blockquote>
<h3><a class="anchor" aria-hidden="true" id="팁--트릭"></a><a href="#팁--트릭" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>&amp; 트릭</h3>
<p>When initially deploying to a <code>gh-pages</code> branch using CircleCI, you may notice that some jobs triggered by commits to the <code>gh-pages</code> branch fail to run successfully due to a lack of tests (This can also result in chat/slack build failure notifications).</p>
<p>You can work around this by:</p>
<ul>
<li>Setting the environment variable <code>CUSTOM_COMMIT_MESSAGE</code> flag to the <code>publish-gh-pages</code> command with the contents of <code>[skip ci]</code>. e.g.</li>
</ul>
<pre><code class="hljs css language-bash">CUSTOM_COMMIT_MESSAGE=<span class="hljs-string">"[skip ci]"</span> \
yarn run publish-gh-pages <span class="hljs-comment"># or `npm run publish-gh-pages`</span>
</code></pre>
<ul>
<li>Alternatively, you can work around this by creating a basic CircleCI config with the following contents:</li>
</ul>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># CircleCI 2.0 Config File</span>
<span class="hljs-comment"># This config file will prevent tests from being run on the gh-pages branch.</span>
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
<span class="hljs-attr">jobs:</span>
<span class="hljs-attr">build:</span>
<span class="hljs-attr">machine:</span> <span class="hljs-literal">true</span>
<span class="hljs-attr">branches:</span>
<span class="hljs-attr">ignore:</span> <span class="hljs-string">gh-pages</span>
<span class="hljs-attr">steps:</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">run:</span> <span class="hljs-string">echo</span> <span class="hljs-string">"Skipping tests on gh-pages branch"</span>
</code></pre>
<p><code>config.yml</code> 파일로 만들고 <code>website/static</code> 디렉토리 밑에 있는 <code>.circleci</code> 디렉토리 아래에 저장합니다.</p>
<h3><a class="anchor" aria-hidden="true" id="travis-ci-사용하기"></a><a href="#travis-ci-사용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Travis CI 사용하기</h3>
<ol>
<li><a href="Https://github.com/settings/tokens">Https://github.com/settings/tokens</a> 에 접속해서 새로운 <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">personal access token</a>을 생성합니다.</li>
<li>GitHub 사용자 계정을 사용해 활성화하고자 하는 저장소에 <a href="https://github.com/marketplace/travis-ci">Travis CI 앱을 추가합니다</a>.</li>
<li>Travis CI 대시보드를 실행합니다. The URL looks like <a href="https://travis-ci.com/USERNAME/REPO">https://travis-ci.com/USERNAME/REPO</a>, and navigate to the <code>More options</code> &gt; <code>Setting</code> &gt; <code>Environment Variables</code> section of your repository.</li>
<li><code>GH_TOKEN</code>라는 이름으로 새로운 환경 변수를 만들고 이전 단계에서 생성한 토큰을 값으로 지정합니다. 그리고 <code>GH_EMAIL</code> (이메일 주소), <code>GH_NAME</code> (GitHub 사용자 계정) 환경 변수값도 설정합니다.</li>
<li>저장소 루트에 아래 내용을 참고해 <code>.travis.yml</code> 파일을 생성합니다.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># .travis.yml</span>
<span class="hljs-attr">language:</span> <span class="hljs-string">node_js</span>
<span class="hljs-attr">node_js:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">'8'</span>
<span class="hljs-attr">branches:</span>
<span class="hljs-attr">only:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">master</span>
<span class="hljs-attr">cache:</span>
<span class="hljs-attr">yarn:</span> <span class="hljs-literal">true</span>
<span class="hljs-attr">script:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">git</span> <span class="hljs-string">config</span> <span class="hljs-string">--global</span> <span class="hljs-string">user.name</span> <span class="hljs-string">"${GH_NAME}"</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">git</span> <span class="hljs-string">config</span> <span class="hljs-string">--global</span> <span class="hljs-string">user.email</span> <span class="hljs-string">"${GH_EMAIL}"</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">echo</span> <span class="hljs-string">"machine github.com login ${GH_NAME} password ${GH_TOKEN}"</span> <span class="hljs-string">&gt;</span> <span class="hljs-string">~/.netrc</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">cd</span> <span class="hljs-string">website</span> <span class="hljs-string">&amp;&amp;</span> <span class="hljs-string">yarn</span> <span class="hljs-string">install</span> <span class="hljs-string">&amp;&amp;</span> <span class="hljs-string">GIT_USER="${GH_NAME}"</span> <span class="hljs-string">yarn</span> <span class="hljs-string">run</span> <span class="hljs-string">publish-gh-pages</span>
</code></pre>
<p>이제 <code>master</code> 브랜치에 새로운 커밋이 발생하게 되면 Travis CI는 여러분의 테스트 스위트가 실행되고 모든 테스트가 통과되면 <code>publish-gh-pages</code> 스크립트가 실행되어 여러분의 웹사이트를 배포하게 됩니다.</p>
<h3><a class="anchor" aria-hidden="true" id="using-azure-pipelines"></a><a href="#using-azure-pipelines" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using Azure Pipelines</h3>
<ol>
<li>Sign Up at <a href="https://azure.microsoft.com/en-us/services/devops/pipelines/">Azure Pipelines</a> if you haven't already.</li>
<li>Create an organization and within the organization create a project and connect your repository from GitHub.</li>
<li>Go to <a href="https://github.com/settings/tokens">https://github.com/settings/tokens</a> and generate a new <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">personal access token</a> with repository scope.</li>
<li>In the project page (which looks like <a href="https://dev.azure.com/ORG_NAME/REPO_NAME/_build">https://dev.azure.com/ORG_NAME/REPO_NAME/_build</a>) create a new pipeline with the following text. Also, click on edit and add a new environment variable named <code>GH_TOKEN</code> with your newly generated token as its value, then <code>GH_EMAIL</code> (your email address) and <code>GH_NAME</code> (your GitHub username). Make sure to mark them as secret. Alternatively, you can also add a file named <code>azure-pipelines.yml</code> at yout repository root.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># azure-pipelines.yml</span>
<span class="hljs-attr">trigger:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">master</span>
<span class="hljs-attr">pool:</span>
<span class="hljs-attr">vmImage:</span> <span class="hljs-string">'ubuntu-latest'</span>
<span class="hljs-attr">steps:</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">checkout:</span> <span class="hljs-string">self</span>
<span class="hljs-attr">persistCredentials:</span> <span class="hljs-literal">true</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">task:</span> <span class="hljs-string">NodeTool@0</span>
<span class="hljs-attr">inputs:</span>
<span class="hljs-attr">versionSpec:</span> <span class="hljs-string">'10.x'</span>
<span class="hljs-attr">displayName:</span> <span class="hljs-string">'Install Node.js'</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">script:</span> <span class="hljs-string">|
git config --global user.name "${GH_NAME}"
git config --global user.email "${GH_EMAIL}"
git checkout -b master
echo "machine github.com login ${GH_NAME} password ${GH_TOKEN}" &gt; ~/.netrc
cd website
yarn install
GIT_USER="${GH_NAME}" CURRENT_BRANCH=master yarn run publish-gh-pages
</span> <span class="hljs-attr">env:</span>
<span class="hljs-attr">GH_NAME:</span> <span class="hljs-string">$(GH_NAME)</span>
<span class="hljs-attr">GH_EMAIL:</span> <span class="hljs-string">$(GH_EMAIL)</span>
<span class="hljs-attr">GH_TOKEN:</span> <span class="hljs-string">$(GH_TOKEN)</span>
<span class="hljs-attr">displayName:</span> <span class="hljs-string">'yarn install and build'</span>
</code></pre>
<h3><a class="anchor" aria-hidden="true" id="using-drone"></a><a href="#using-drone" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using Drone</h3>
<ol>
<li>Create a new ssh key that will be the <a href="https://docs.github.com/en/free-pro-team@latest/developers/overview/managing-deploy-keys#deploy-keys">deploy key</a> for your project.</li>
<li>Name your private and public keys to be specific and so that it does not overwrite your other <a href="https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent">ssh keys</a>.</li>
<li>Go to <a href="https://github.com/USERNAME/REPO/settings/keys">https://github.com/USERNAME/REPO/settings/keys</a> and add a new deploy key by pasting in our public key you just generated.</li>
<li>Open your <a href="http://Drone.io">Drone.io</a> dashboard and login. The URL looks like <a href="https://cloud.drone.io/USERNAME/REPO">https://cloud.drone.io/USERNAME/REPO</a>.</li>
<li>Click on the repository, click on activate repository, and add a secret called <code>git_deploy_private_key</code> with your private key value that you just generated.</li>
<li>Create a <code>.drone.yml</code> on the root of your repository with below text.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># .drone.yml</span>
<span class="hljs-attr">kind:</span> <span class="hljs-string">pipeline</span>
<span class="hljs-attr">type:</span> <span class="hljs-string">docker</span>
<span class="hljs-attr">trigger:</span>
<span class="hljs-attr">event:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">tag</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Website</span>
<span class="hljs-attr">image:</span> <span class="hljs-string">node</span>
<span class="hljs-attr">commands:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">mkdir</span> <span class="hljs-string">-p</span> <span class="hljs-string">$HOME/.ssh</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">ssh-keyscan</span> <span class="hljs-string">-t</span> <span class="hljs-string">rsa</span> <span class="hljs-string">github.com</span> <span class="hljs-string">&gt;&gt;</span> <span class="hljs-string">$HOME/.ssh/known_hosts</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">echo</span> <span class="hljs-string">"$GITHUB_PRIVATE_KEY &gt; $HOME/.ssh/id_rsa"</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">chmod</span> <span class="hljs-number">0600</span> <span class="hljs-string">$HOME/.ssh/id_rsa</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">cd</span> <span class="hljs-string">website</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">npm</span> <span class="hljs-string">i</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">npm</span> <span class="hljs-string">run</span> <span class="hljs-string">publish-gh-pages</span>
<span class="hljs-attr">environment:</span>
<span class="hljs-attr">USE_SSH:</span> <span class="hljs-literal">true</span>
<span class="hljs-attr">GIT_USER:</span> <span class="hljs-string">$DRONE_COMMIT_AUTHOR</span>
<span class="hljs-attr">GITHUB_PRIVATE_KEY:</span> <span class="hljs-string">git_deploy_private_key</span>
</code></pre>
<p>Now, whenever you push a new tag to github, this trigger will start the drone ci job to publish your website.</p>
<h3><a class="anchor" aria-hidden="true" id="hosting-on-vercel"></a><a href="#hosting-on-vercel" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hosting on Vercel</h3>
<p>Deploying your Docusaurus project to <a href="https://vercel.com/">Vercel</a> will provide you with <a href="https://vercel.com/">various benefits</a> in the areas of performance and ease of use.</p>
<p>To deploy your Docusaurus project with a <a href="https://vercel.com/docs/git-integrations">Vercel for Git Integration</a>, make sure it has been pushed to a Git repository.</p>
<p>Import the project into Vercel using the <a href="https://vercel.com/import/git">Import Flow</a>. During the import, you will find all relevant options preconfigured for you; however, you can choose to change any of these options, a list of which can be found <a href="https://vercel.com/docs/build-step#build-&amp;-development-settings">here</a>.</p>
<p>After your project has been imported, all subsequent pushes to branches will generate <a href="https://vercel.com/docs/platform/deployments#preview">Preview Deployments</a>, and all changes made to the <a href="https://vercel.com/docs/git-integrations#production-branch">Production Branch</a> (commonly &quot;main&quot;) will result in a <a href="https://vercel.com/docs/platform/deployments#production">Production Deployment</a>.</p>
<h3><a class="anchor" aria-hidden="true" id="netlify-활용하기"></a><a href="#netlify-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Netlify 활용하기</h3>
<p>아래 단계를 따라 도큐사우르스로 만든 사이트를 Netlify에서 운영할 수 있습니다.</p>
<ol>
<li><p>Select <strong>New site from Git</strong></p></li>
<li><p>사용하고 있는 Git 서비스 공급자에 연결합니다.</p></li>
<li><p>배포할 브랜치를 선택합니다. 기본값은 <code>master</code>입니다.</p></li>
<li><p>빌드 단계의 세부 항목을 설정합니다.</p>
<ul>
<li>빌드 명령어를 다음과 같이 입력합니다. <code>cd website; npm install; npm run build;</code></li>
<li>배포할 디렉토리는 다음과 같습니다. <code>website/build/&lt;projectName&gt;</code> (<code>projectName</code><code>siteConfig</code>에서 설정합니다).</li>
</ul></li>
<li><p>Click <strong>Deploy site</strong></p></li>
</ol>
<p>Netlify 설정을 통해 저장소에 커밋이 발생할때마다 빌드를 처리할 수도 있고 <code>master</code> 브랜치에 커밋이 발생할때만 빌드가 실행될 수 있습니다.</p>
<h3><a class="anchor" aria-hidden="true" id="hosting-on-render"></a><a href="#hosting-on-render" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hosting on Render</h3>
<p>Render offers free <a href="https://render.com/docs/static-sites">static site</a> hosting with fully managed SSL, custom domains, a global CDN and continuous auto deploy from your Git repo. Deploy your app in just a few minutes by following these steps.</p>
<ol>
<li><p>Create a new <strong>Web Service</strong> on Render, and give Render's GitHub app permission to access your Docusaurus repo.</p></li>
<li><p>배포할 브랜치를 선택합니다. The default is <code>master</code>.</p></li>
<li><p>Enter the following values during creation.</p>
<table>
<thead>
<tr><th>Field</th><th>Value</th></tr>
</thead>
<tbody>
<tr><td><strong>Environment</strong></td><td><code>Static Site</code></td></tr>
<tr><td><strong>Build Command</strong></td><td><code>cd website; yarn install; yarn build</code></td></tr>
<tr><td><strong>Publish Directory</strong></td><td><code>website/build/&lt;projectName&gt;</code></td></tr>
</tbody>
</table>
<p><code>projectName</code> is the value you defined in your <code>siteConfig.js</code>.</p>
<pre><code class="hljs css language-javascript{7}"><span class="hljs-keyword">const</span> siteConfig = {
<span class="hljs-comment">// ...</span>
projectName: <span class="hljs-string">'your-project-name'</span>,
<span class="hljs-comment">// ...</span>
</code></pre></li>
</ol>
<p>That's it! Your app will be live on your Render URL as soon as the build finishes.</p>
<h3><a class="anchor" aria-hidden="true" id="github-enterprise-활용하기"></a><a href="#github-enterprise-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>GitHub Enterprise 활용하기</h3>
<p>GitHub Enterprise의 설치방법은 github.com에서 했던 방법과 같습니다. 그룹 계정에서 사용할 GitHub Enterprise 호스트를 처리해주기만 하면 됩니다.</p>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>GITHUB_HOST</code></td><td>GitHub enterprise 서버에서 사용하는 호스트이름을 설정합니다.</td></tr>
</tbody>
</table>
<p><code>siteConfig.js</code> 파일에 GitHub Enterprise 호스트이름을 설정하는 <code>'githubHost'</code> 속성을 추가합니다. 아니면, 환경 변수로 명령어 실행 시 <code>GITHUB_HOST</code>를 설정할 수 있습니다.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/site-creation"><span class="arrow-prev"></span><span>당신만의 사이트 만들기</span></a><a class="docs-next button" href="/docs/ko/docker"><span>도커</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#정적-html-페이지-만들기">정적 HTML 페이지 만들기</a></li><li><a href="#정적-html-페이지-호스팅하기">정적 HTML 페이지 호스팅하기</a><ul class="toc-headings"><li><a href="#호스팅-서비스-활용하기">호스팅 서비스 활용하기</a></li><li><a href="#using-vercel">Using Vercel</a></li><li><a href="#github-페이지-활용하기">GitHub 페이지 활용하기</a></li></ul></li><li><a href="#지속적인-통합-환경에서-자동으로-배포하기">지속적인 통합 환경에서 자동으로 배포하기</a><ul class="toc-headings"><li><a href="#using-circleci-20">Using CircleCI 2.0</a></li><li><a href="#팁--트릭">&amp; 트릭</a></li><li><a href="#travis-ci-사용하기">Travis CI 사용하기</a></li><li><a href="#using-azure-pipelines">Using Azure Pipelines</a></li><li><a href="#using-drone">Using Drone</a></li><li><a href="#hosting-on-vercel">Hosting on Vercel</a></li><li><a href="#netlify-활용하기">Netlify 활용하기</a></li><li><a href="#hosting-on-render">Hosting on Render</a></li><li><a href="#github-enterprise-활용하기">GitHub Enterprise 활용하기</a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,447 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Publishing your site · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="여러분은 이제 [기본 사이트 구조 만들기와 로컬에서 실행하기](/docs/ko/site-creation)를 성공적으로 수행했습니다. 이번에는 [원하는 형태로 수정하기](/docs/ko/site-config) 과정을 통해 링크를 생성하고 다른 사용자에게 공개하는 방법을 살펴봅니다. 도큐사우르스는 정적인 HTML로 만들어진 웹사이트를 생성합니다. 생성된 HTML 파일을 여러분의 웹서버나 호스팅 업체에서 제공하는 공간에 옮기기만 하면 됩니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Publishing your site · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="여러분은 이제 [기본 사이트 구조 만들기와 로컬에서 실행하기](/docs/ko/site-creation)를 성공적으로 수행했습니다. 이번에는 [원하는 형태로 수정하기](/docs/ko/site-config) 과정을 통해 링크를 생성하고 다른 사용자에게 공개하는 방법을 살펴봅니다. 도큐사우르스는 정적인 HTML로 만들어진 웹사이트를 생성합니다. 생성된 HTML 파일을 여러분의 웹서버나 호스팅 업체에서 제공하는 공간에 옮기기만 하면 됩니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/publishing">English</a></li><li><a href="/docs/fr/publishing">Français</a></li><li><a href="/docs/pt-BR/publishing">Português (Brasil)</a></li><li><a href="/docs/ro/publishing">Română</a></li><li><a href="/docs/ru/publishing">Русский</a></li><li><a href="/docs/zh-CN/publishing">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>시작하기</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Publishing your site</h1></header><article><div><span><p>여러분은 이제 <a href="/docs/ko/site-creation">기본 사이트 구조 만들기와 로컬에서 실행하기</a>를 성공적으로 수행했습니다. 이번에는 <a href="/docs/ko/site-config">원하는 형태로 수정하기</a> 과정을 통해 링크를 생성하고 다른 사용자에게 공개하는 방법을 살펴봅니다. 도큐사우르스는 정적인 HTML로 만들어진 웹사이트를 생성합니다. 생성된 HTML 파일을 여러분의 웹서버나 호스팅 업체에서 제공하는 공간에 옮기기만 하면 됩니다.</p>
<h2><a class="anchor" aria-hidden="true" id="정적-html-페이지-만들기"></a><a href="#정적-html-페이지-만들기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>정적 HTML 페이지 만들기</h2>
<p>여러분의 웹사이트 정적 빌드를 실행하기 위해서는 <code>website</code> 디렉토리 위치에서 아래 명령어를 실행합니다.</p>
<pre><code class="hljs css language-bash">yarn run build <span class="hljs-comment"># 또는 `npm run build`</span>
</code></pre>
<p>명령어가 실행되면 <code>build</code> 디렉토리가 <code>website</code> 디렉토리 아래 생성됩니다. 생성된 디렉토리에는 작성한 문서가 <code>.html</code> 파일로 생성되며 <code>pages</code> 디렉토리 안에 있던 콘텐츠도 같이 생성됩니다.</p>
<h2><a class="anchor" aria-hidden="true" id="정적-html-페이지-호스팅하기"></a><a href="#정적-html-페이지-호스팅하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>정적 HTML 페이지 호스팅하기</h2>
<p>이제 <code>website/build</code> 디렉토리에 생성된 모든 파일을 여러분이 선택한 웹서버 <code>html</code> 디렉토리 아래로 복사합니다.</p>
<blockquote>
<p>예를 들어, Apache와 Nginx 모두 <code>/var/www/html</code> 기본 컨텐츠 제공 경로 입니다. 어떤 웹서버나 호스팅 업체를 사용할지는 도큐사우르스에서 권할 문제는 아니라 여기서 언급하지는 않겠습니다.</p>
</blockquote>
<blockquote>
<p>여러분의 웹서버에서 사이트를 서비스하는 경우에는 웹서버에서 적절한 HTTP 헤더값을 가지고 리소스 파일을 제공해주어야 합니다. CSS 파일은 헤더 <code>content-type</code> 값을 <code>text/css</code>으로 설정해야 합니다. Nginx의 경우는 <code>nginx.conf</code> 파일에 <code>include /etc/nginx/mime.types;</code> 을 설정하는 것을 의미합니다. See <a href="https://github.com/facebook/docusaurus/issues/602">this issue</a> for more info.</p>
</blockquote>
<h3><a class="anchor" aria-hidden="true" id="호스팅-서비스-활용하기"></a><a href="#호스팅-서비스-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>호스팅 서비스 활용하기</h3>
<ul>
<li><a href="#using-vercel">Vercel</a></li>
<li><a href="#using-github-pages">GitHub 페이지</a></li>
<li><a href="#hosting-on-netlify">Netlify</a></li>
<li><a href="#hosting-on-render">Render</a></li>
</ul>
<h3><a class="anchor" aria-hidden="true" id="using-vercel"></a><a href="#using-vercel" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using Vercel</h3>
<p>Deploying your Docusaurus project to <a href="https://vercel.com">Vercel</a> will provide you with various benefits in the areas of performance and ease of use.</p>
<p>Most importantly, however, deploying a Docusaurus project only takes a couple of seconds:</p>
<ol>
<li>First, install their <a href="https://vercel.com/download">command-line interface</a>:</li>
</ol>
<pre><code class="hljs css language-bash">npm i -g vercel
</code></pre>
<ol start="2">
<li>다음 명령어를 프로젝트 루트 디렉토리에서 실행하세요:</li>
</ol>
<pre><code class="hljs css language-bash">vercel
</code></pre>
<p><strong>That's all.</strong> Your docs will automatically be deployed.</p>
<blockquote>
<p>Note that the directory structure Now supports is slightly different from the default directory structure of a Docusaurus project - The <code>docs</code> directory has to be within the <code>website</code> directory, ideally following the directory structure in this example. You will also have to specify a <code>customDocsPath</code> value in <code>siteConfig.js</code>. Take a look at the <a href="https://github.com/vercel/vercel/tree/master/examples/docusaurus">now-examples repository for a Docusaurus project</a>.</p>
</blockquote>
<h3><a class="anchor" aria-hidden="true" id="github-페이지-활용하기"></a><a href="#github-페이지-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>GitHub 페이지 활용하기</h3>
<p>Docusaurus was designed to work well with one of the most popular hosting solutions for open source projects: <a href="https://pages.github.com/">GitHub Pages</a>.</p>
<h4><a class="anchor" aria-hidden="true" id="deploying-to-github-pages"></a><a href="#deploying-to-github-pages" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Deploying to GitHub Pages</h4>
<ol>
<li>Docusaurus supports deploying as <a href="https://help.github.com/articles/user-organization-and-project-pages">project pages or user/organization pages</a>, your code repository does not even need to be public.</li>
</ol>
<blockquote>
<p>코드 저장소가 프라이빗 상태라고 하더라도 <code>gh-pages</code> 브랜치에 배포되는 내용은 <a href="https://help.github.com/articles/user-organization-and-project-pages/">퍼블릭</a> 상태가 됩니다.</p>
</blockquote>
<p><strong>Note:</strong> When you deploy as user/organization page, the publish script will deploy these sites to the root of the <strong><code>master</code></strong> branch of the <em>username</em>.github.io repo. In this case, note that you will want to have the Docusaurus infra, your docs, etc. either in <strong>another branch of the <em>username</em>.github.io repo</strong> (e.g., maybe call it <code>source</code>), or in another, separate repo (e.g. in the same as the documented source code).</p>
<ol start="2">
<li>You will need to modify the file <code>website/siteConfig.js</code> and add the required parameters.</li>
</ol>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>organizationName</code></td><td>코드 저장소를 소유하고 있는 GitHub 사용자 또는 그룹 계정입니다. If you are the owner, then it is your GitHub username. In the case of Docusaurus, that would be the &quot;<em>facebook</em>&quot; GitHub organization.</td></tr>
<tr><td><code>projectName</code></td><td>프로젝트에서 사용하고 있는 GitHub 저장소의 이름입니다. For example, the source code for Docusaurus is hosted at <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a>, so our project name, in this case, would be &quot;docusaurus&quot;.</td></tr>
<tr><td><code>url</code></td><td>Your website's URL. For projects hosted on GitHub pages, this will be &quot;https://<em>username</em>.github.io&quot;</td></tr>
<tr><td><code>baseUrl</code></td><td>Base URL for your project. For projects hosted on GitHub pages, it follows the format &quot;/<em>projectName</em>/&quot;. For <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a>, <code>baseUrl</code> is <code>/docusaurus/</code>.</td></tr>
</tbody>
</table>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
url: <span class="hljs-string">'https://__userName__.github.io'</span>, <span class="hljs-comment">// Your website URL</span>
<span class="hljs-attr">baseUrl</span>: <span class="hljs-string">'/testProject/'</span>,
<span class="hljs-attr">projectName</span>: <span class="hljs-string">'testProject'</span>,
<span class="hljs-attr">organizationName</span>: <span class="hljs-string">'userName'</span>
...
}
</code></pre>
<p>In case you want to deploy as a user or organization site, specify the project name as <code>&lt;username&gt;.github.io</code> or <code>&lt;orgname&gt;.github.io</code>. E.g. If your GitHub username is &quot;user42&quot; then <em>user42.github.io</em>, or in the case of an organization name of &quot;org123&quot;, it will be <em>org123.github.io</em>.</p>
<p><strong>Note:</strong> Not setting the <code>url</code> and <code>baseUrl</code> of your project might result in incorrect file paths generated which can cause broken links to assets paths like stylesheets and images.</p>
<blockquote>
<p><code>projectName</code><code>organizationName</code> 설정은 <code>siteConfig.js</code> 파일에서 관리하는 것을 권장합니다. 물론, 환경 변수에서 <code>ORGANIZATION_NAME</code>, <code>PROJECT_NAME</code> 값을 지정하는 방법도 사용할 수 있습니다.</p>
</blockquote>
<ol start="3">
<li>Now you have to specify the git user as an environment variable, and run the script <a href="/docs/ko/commands#docusaurus-publish"><code>publish-gh-pages</code></a></li>
</ol>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>GIT_USER</code></td><td>The username for a GitHub account that has to commit access to this repo. For your repositories, this will usually be your own GitHub username. <code>GIT_USER</code><code>organizationName</code><code>projectName</code>의 조합으로 지정된 저장소에 푸시 권한을 가지고 있어야 합니다.</td></tr>
</tbody>
</table>
<p>명령행에서 스크립트를 바로 실행하기 위해서는 적절하게 파라미터 값을 채워주어야 합니다.</p>
<p><strong>Bash</strong></p>
<pre><code class="hljs css language-bash">GIT_USER=&lt;GIT_USER&gt; \
CURRENT_BRANCH=master \
USE_SSH=<span class="hljs-literal">true</span> \
yarn run publish-gh-pages <span class="hljs-comment"># 또는 `npm run publish-gh-pages`</span>
</code></pre>
<p><strong>Windows</strong></p>
<pre><code class="hljs css language-batch">cmd /C <span class="hljs-string">"set "</span><span class="hljs-attribute">GIT_USER</span>=&lt;GIT_USER&gt;"&amp;&amp; <span class="hljs-builtin-name">set</span> <span class="hljs-attribute">CURRENT_BRANCH</span>=master &amp;&amp; <span class="hljs-builtin-name">set</span> <span class="hljs-attribute">USE_SSH</span>=<span class="hljs-literal">true</span> &amp;&amp; yarn <span class="hljs-builtin-name">run</span> publish-gh-pages<span class="hljs-string">"
</span></code></pre>
<p>환경 변수로 설정할 수 있는 추가적인 2가지 파라미터는 아래와 같습니다.</p>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>USE_SSH</code></td><td><code>true</code>로 값을 설정하면 GitHub 저장소 연결 시 HTTPS 대신 SSH를 사용합니다. 변수값을 설정하지 않으면 HTTPS가 기본으로 설정됩니다.</td></tr>
<tr><td><code>CURRENT_BRANCH</code></td><td>배포될 최신 문서를 포함하고 있는 브랜치를 지정합니다. 일반적인 경우는 <code>master</code> 브랜치가 되겠지만, <code>gh-pages</code>를 제외한 어떤 브랜치(기본값 또는 다른)를 사용해도 괜찮습니다. 변수값을 설정하지 않으면 현재 브랜치를 사용합니다.</td></tr>
</tbody>
</table>
<p>SSH 키 관련 문제가 발생한다면 <a href="https://help.github.com/articles/connecting-to-github-with-ssh/">GitHub's authentication documentation</a> 페이지 정보를 참고하세요.</p>
<p>You should now be able to load your website by visiting its GitHub Pages URL, which could be something along the lines of https://<em>username</em>.github.io/<em>projectName</em>, or a custom domain if you have set that up. For example, Docusaurus' own GitHub Pages URL is <a href="https://facebook.github.io/Docusaurus">https://facebook.github.io/Docusaurus</a> because it is served from the <code>gh-pages</code> branch of the <a href="https://github.com/facebook/docusaurus">https://github.com/facebook/docusaurus</a> GitHub repository. However, it can also be accessed via <a href="https://docusaurus.io/">https://docusaurus.io/</a>, via a generated <code>CNAME</code> file which can be configured via the <code>cname</code> <a href="/docs/ko/site-config#cname-string">siteConfig option</a>.</p>
<p>서비스가 어떻게 동작하는지 궁금하다면 <a href="https://pages.github.com">GitHub Pages documentation</a> 페이지 정보를 참고하세요.</p>
<p>문서를 수정해서 변경된 내용을 사이트에 배포하고자 한다면 위에 있는 명령어를 실행하기만 하면 됩니다. 문서의 변경이 거의 발생하지 않는다면 스크립트를 수동으로 실행하는 방식이 더 좋은 선택입니다. 수동으로 변경된 항목을 배포하는 것은 그리 귀찮은 일은 아닙니다.</p>
<p>하지만, 지속적인 통합(CI) 프로세스를 만들고자 한다면 자동으로 배포되는 작업을 구성할 수도 있습니다.</p>
<h2><a class="anchor" aria-hidden="true" id="지속적인-통합-환경에서-자동으로-배포하기"></a><a href="#지속적인-통합-환경에서-자동으로-배포하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>지속적인 통합 환경에서 자동으로 배포하기</h2>
<p>지속적인 통합 (CI) 서비스는 소스 콘트롤에 새로운 커밋이 발생할때마다 반복적으로 발생하는 작업을 처리하기 위해 사용합니다. 지속적인 통합 환경에서는 단위 테스트, 통합 테스트, 자동 빌드, NPM 배포 그리고 변경된 내용을 웹사이트에 배포하기 같은 복합적인 작업을 처리할 수 있습니다. All you need to do to automate the deployment of your website is to invoke the <code>publish-gh-pages</code> script whenever your docs get updated. In the following section, we'll be covering how to do just that using <a href="https://circleci.com/">CircleCI</a>, a popular continuous integration service provider.</p>
<h3><a class="anchor" aria-hidden="true" id="using-circleci-20"></a><a href="#using-circleci-20" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using CircleCI 2.0</h3>
<p>Circle Ci에 대한 정보가 필요하다면 <a href="https://circleci.com/signup/">setup CircleCI</a> 페이지 정보를 참고하세요. 여러분의 사이트와 문서를 CircleCI를 통해 자동으로 배포하고자 한다면 <code>publish-gh-pages</code> 스크립트가 배포 단계에서 실행될 수 있도록 Circle 설정을 변경해주기만 하면 됩니다. 아래와 같은 단계로 설정을 변경할 수 있습니다.</p>
<ol>
<li><code>GIT_USER</code>에 설정한 GitHub 사용자 계정은 문서가 있는 저장소 <code>쓰기</code> 권한을 가지고 있어야 합니다. 저장소에서 <code>Settings | Collaborators &amp; teams</code> 메뉴에서 설정을 변경할 수 있습니다.</li>
<li><code>GIT_USER</code>에 지정한 사용자로 GitHub 사이트에 로그인합니다.</li>
<li><a href="Https://github.com/settings/tokens">Https://github.com/settings/tokens</a> URL로 접근해서 <code>GIT_USER</code>를 위한 <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">personal access token</a>을 생성합니다. 접근 범위 설정 시 <code>repository</code>를 선택하면 프라이빗 저장소에 대한 모든 권한을 부여할 수 있습니다. 생성한 토큰은 안전한 곳에 보관하고 외부에 노출되지 않도록 합니다. 토큰은 GitHub 비밀번호를 대신해 GitHub에서 처리하고자하는 모든 작업에 대한 인증 작업을 수행합니다.</li>
<li>Open your CircleCI dashboard, and navigate to the Settings page for your repository, then select &quot;Environment variables&quot;. URL은 <a href="https://circleci.com/gh/ORG/REPO/edit#env-vars와">https://circleci.com/gh/ORG/REPO/edit#env-vars와</a> 같은 형식인데, &quot;ORG/REPO&quot; 부분은 여러분의 GitHub 그룹 계정/저장소로 변경합니다.</li>
<li><code>GITHUB_TOKEN</code>라는 이름으로 새로운 환경 변수를 생성하고 앞에서 생성된 액세스 토큰을 값으로 지정합니다.</li>
<li><code>.circleci</code> 이라는 이름으로 디렉토리를 생성하고 <code>config.yml</code> 파일을 만들어서 넣어줍니다.</li>
<li>아래에 있는 내용을 <code>.circleci/config.yml</code> 파일에 채워줍니다.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># If you only want the circle to run on direct commits to master, you can uncomment this out</span>
<span class="hljs-comment"># and uncomment the filters: *filter-only-master down below too</span>
<span class="hljs-comment">#</span>
<span class="hljs-comment"># aliases:</span>
<span class="hljs-comment"># - &amp;filter-only-master</span>
<span class="hljs-comment"># branches:</span>
<span class="hljs-comment"># only:</span>
<span class="hljs-comment"># - master</span>
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
<span class="hljs-attr">jobs:</span>
<span class="hljs-attr">deploy-website:</span>
<span class="hljs-attr">docker:</span>
<span class="hljs-comment"># specify the version you desire here</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">image:</span> <span class="hljs-string">circleci/node:8.11.1</span>
<span class="hljs-attr">steps:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">checkout</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">run:</span>
<span class="hljs-attr">name:</span> <span class="hljs-string">Deploying</span> <span class="hljs-string">to</span> <span class="hljs-string">GitHub</span> <span class="hljs-string">Pages</span>
<span class="hljs-attr">command:</span> <span class="hljs-string">|
git config --global user.email "&lt;GITHUB_USERNAME&gt;@users.noreply.github.com"
git config --global user.name "&lt;YOUR_NAME&gt;"
echo "machine github.com login &lt;GITHUB_USERNAME&gt; password $GITHUB_TOKEN" &gt; ~/.netrc
cd website &amp;&amp; yarn install &amp;&amp; GIT_USER=&lt;GIT_USER&gt; yarn run publish-gh-pages
</span>
<span class="hljs-attr">workflows:</span>
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
<span class="hljs-attr">build_and_deploy:</span>
<span class="hljs-attr">jobs:</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">deploy-website:</span>
<span class="hljs-comment"># filters: *filter-only-master</span>
</code></pre>
<p><code>command:</code> 항목에서 <code>&lt;....&gt;</code>로 표시된 부분은 적절한 값으로 변경해주어야 합니다. <code>&lt;GIT_USER&gt;</code> 항목은 GitHub 저장소에 문서를 집어넣기 위한 권한을 가지고 있는 GitHub 사용자 계정을 지정해줍니다. 대부분의 경우 <code>&lt;GIT_USER&gt;</code><code>&lt;GITHUB_USERNAME&gt;</code>은 같은 값을 사용합니다.</p>
<p><strong>DO NOT</strong> place the actual value of <code>$GITHUB_TOKEN</code> in <code>circle.yml</code>. We already configured that as an environment variable back in Step 5.</p>
<blockquote>
<p>GitHub 저장소 접근 시 SSH를 사용하고자 한다면 <code>USE_SSH=true</code>을 설정하면 됩니다. SSH 설정을 적용하면 설정된 값은 다음과 같은 형식이 됩니다. <code>cd website &amp;&amp; npm install &amp;&amp; GIT_USER=&lt;GIT_USER&gt; USE_SSH=true npm run publish-gh-pages</code>.</p>
</blockquote>
<blockquote>
<p>Unlike when you run the <code>publish-gh-pages</code> script manually when the script runs within the Circle environment, the value of <code>CURRENT_BRANCH</code> is already defined as an <a href="https://circleci.com/docs/1.0/environment-variables/">environment variable within CircleCI</a> and will be picked up by the script automatically.</p>
</blockquote>
<p>이제 <code>master</code> 브랜치에 새로운 커밋이 발생하게 되면 CircleCI는 여러분의 테스트 스위트가 실행되고 모든 테스트가 통과되면 <code>publish-gh-pages</code> 스크립트가 실행되어 여러분의 웹사이트를 배포하게 됩니다.</p>
<blockquote>
<p>If you would rather use a deploy key instead of a personal access token, you can by starting with the CircleCI <a href="https://circleci.com/docs/1.0/adding-read-write-deployment-key/">instructions</a> for adding a read/write deploy key.</p>
</blockquote>
<h3><a class="anchor" aria-hidden="true" id="팁--트릭"></a><a href="#팁--트릭" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>&amp; 트릭</h3>
<p>When initially deploying to a <code>gh-pages</code> branch using CircleCI, you may notice that some jobs triggered by commits to the <code>gh-pages</code> branch fail to run successfully due to a lack of tests (This can also result in chat/slack build failure notifications).</p>
<p>You can work around this by:</p>
<ul>
<li>Setting the environment variable <code>CUSTOM_COMMIT_MESSAGE</code> flag to the <code>publish-gh-pages</code> command with the contents of <code>[skip ci]</code>. e.g.</li>
</ul>
<pre><code class="hljs css language-bash">CUSTOM_COMMIT_MESSAGE=<span class="hljs-string">"[skip ci]"</span> \
yarn run publish-gh-pages <span class="hljs-comment"># or `npm run publish-gh-pages`</span>
</code></pre>
<ul>
<li>Alternatively, you can work around this by creating a basic CircleCI config with the following contents:</li>
</ul>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># CircleCI 2.0 Config File</span>
<span class="hljs-comment"># This config file will prevent tests from being run on the gh-pages branch.</span>
<span class="hljs-attr">version:</span> <span class="hljs-number">2</span>
<span class="hljs-attr">jobs:</span>
<span class="hljs-attr">build:</span>
<span class="hljs-attr">machine:</span> <span class="hljs-literal">true</span>
<span class="hljs-attr">branches:</span>
<span class="hljs-attr">ignore:</span> <span class="hljs-string">gh-pages</span>
<span class="hljs-attr">steps:</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">run:</span> <span class="hljs-string">echo</span> <span class="hljs-string">"Skipping tests on gh-pages branch"</span>
</code></pre>
<p><code>config.yml</code> 파일로 만들고 <code>website/static</code> 디렉토리 밑에 있는 <code>.circleci</code> 디렉토리 아래에 저장합니다.</p>
<h3><a class="anchor" aria-hidden="true" id="travis-ci-사용하기"></a><a href="#travis-ci-사용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Travis CI 사용하기</h3>
<ol>
<li><a href="Https://github.com/settings/tokens">Https://github.com/settings/tokens</a> 에 접속해서 새로운 <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">personal access token</a>을 생성합니다.</li>
<li>GitHub 사용자 계정을 사용해 활성화하고자 하는 저장소에 <a href="https://github.com/marketplace/travis-ci">Travis CI 앱을 추가합니다</a>.</li>
<li>Travis CI 대시보드를 실행합니다. The URL looks like <a href="https://travis-ci.com/USERNAME/REPO">https://travis-ci.com/USERNAME/REPO</a>, and navigate to the <code>More options</code> &gt; <code>Setting</code> &gt; <code>Environment Variables</code> section of your repository.</li>
<li><code>GH_TOKEN</code>라는 이름으로 새로운 환경 변수를 만들고 이전 단계에서 생성한 토큰을 값으로 지정합니다. 그리고 <code>GH_EMAIL</code> (이메일 주소), <code>GH_NAME</code> (GitHub 사용자 계정) 환경 변수값도 설정합니다.</li>
<li>저장소 루트에 아래 내용을 참고해 <code>.travis.yml</code> 파일을 생성합니다.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># .travis.yml</span>
<span class="hljs-attr">language:</span> <span class="hljs-string">node_js</span>
<span class="hljs-attr">node_js:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">'8'</span>
<span class="hljs-attr">branches:</span>
<span class="hljs-attr">only:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">master</span>
<span class="hljs-attr">cache:</span>
<span class="hljs-attr">yarn:</span> <span class="hljs-literal">true</span>
<span class="hljs-attr">script:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">git</span> <span class="hljs-string">config</span> <span class="hljs-string">--global</span> <span class="hljs-string">user.name</span> <span class="hljs-string">"${GH_NAME}"</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">git</span> <span class="hljs-string">config</span> <span class="hljs-string">--global</span> <span class="hljs-string">user.email</span> <span class="hljs-string">"${GH_EMAIL}"</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">echo</span> <span class="hljs-string">"machine github.com login ${GH_NAME} password ${GH_TOKEN}"</span> <span class="hljs-string">&gt;</span> <span class="hljs-string">~/.netrc</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">cd</span> <span class="hljs-string">website</span> <span class="hljs-string">&amp;&amp;</span> <span class="hljs-string">yarn</span> <span class="hljs-string">install</span> <span class="hljs-string">&amp;&amp;</span> <span class="hljs-string">GIT_USER="${GH_NAME}"</span> <span class="hljs-string">yarn</span> <span class="hljs-string">run</span> <span class="hljs-string">publish-gh-pages</span>
</code></pre>
<p>이제 <code>master</code> 브랜치에 새로운 커밋이 발생하게 되면 Travis CI는 여러분의 테스트 스위트가 실행되고 모든 테스트가 통과되면 <code>publish-gh-pages</code> 스크립트가 실행되어 여러분의 웹사이트를 배포하게 됩니다.</p>
<h3><a class="anchor" aria-hidden="true" id="using-azure-pipelines"></a><a href="#using-azure-pipelines" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using Azure Pipelines</h3>
<ol>
<li>Sign Up at <a href="https://azure.microsoft.com/en-us/services/devops/pipelines/">Azure Pipelines</a> if you haven't already.</li>
<li>Create an organization and within the organization create a project and connect your repository from GitHub.</li>
<li>Go to <a href="https://github.com/settings/tokens">https://github.com/settings/tokens</a> and generate a new <a href="https://help.github.com/articles/creating-a-personal-access-token-for-the-command-line/">personal access token</a> with repository scope.</li>
<li>In the project page (which looks like <a href="https://dev.azure.com/ORG_NAME/REPO_NAME/_build">https://dev.azure.com/ORG_NAME/REPO_NAME/_build</a>) create a new pipeline with the following text. Also, click on edit and add a new environment variable named <code>GH_TOKEN</code> with your newly generated token as its value, then <code>GH_EMAIL</code> (your email address) and <code>GH_NAME</code> (your GitHub username). Make sure to mark them as secret. Alternatively, you can also add a file named <code>azure-pipelines.yml</code> at yout repository root.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># azure-pipelines.yml</span>
<span class="hljs-attr">trigger:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">master</span>
<span class="hljs-attr">pool:</span>
<span class="hljs-attr">vmImage:</span> <span class="hljs-string">'ubuntu-latest'</span>
<span class="hljs-attr">steps:</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">checkout:</span> <span class="hljs-string">self</span>
<span class="hljs-attr">persistCredentials:</span> <span class="hljs-literal">true</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">task:</span> <span class="hljs-string">NodeTool@0</span>
<span class="hljs-attr">inputs:</span>
<span class="hljs-attr">versionSpec:</span> <span class="hljs-string">'10.x'</span>
<span class="hljs-attr">displayName:</span> <span class="hljs-string">'Install Node.js'</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">script:</span> <span class="hljs-string">|
git config --global user.name "${GH_NAME}"
git config --global user.email "${GH_EMAIL}"
git checkout -b master
echo "machine github.com login ${GH_NAME} password ${GH_TOKEN}" &gt; ~/.netrc
cd website
yarn install
GIT_USER="${GH_NAME}" CURRENT_BRANCH=master yarn run publish-gh-pages
</span> <span class="hljs-attr">env:</span>
<span class="hljs-attr">GH_NAME:</span> <span class="hljs-string">$(GH_NAME)</span>
<span class="hljs-attr">GH_EMAIL:</span> <span class="hljs-string">$(GH_EMAIL)</span>
<span class="hljs-attr">GH_TOKEN:</span> <span class="hljs-string">$(GH_TOKEN)</span>
<span class="hljs-attr">displayName:</span> <span class="hljs-string">'yarn install and build'</span>
</code></pre>
<h3><a class="anchor" aria-hidden="true" id="using-drone"></a><a href="#using-drone" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Using Drone</h3>
<ol>
<li>Create a new ssh key that will be the <a href="https://docs.github.com/en/free-pro-team@latest/developers/overview/managing-deploy-keys#deploy-keys">deploy key</a> for your project.</li>
<li>Name your private and public keys to be specific and so that it does not overwrite your other <a href="https://docs.github.com/en/free-pro-team@latest/github/authenticating-to-github/generating-a-new-ssh-key-and-adding-it-to-the-ssh-agent">ssh keys</a>.</li>
<li>Go to <a href="https://github.com/USERNAME/REPO/settings/keys">https://github.com/USERNAME/REPO/settings/keys</a> and add a new deploy key by pasting in our public key you just generated.</li>
<li>Open your <a href="http://Drone.io">Drone.io</a> dashboard and login. The URL looks like <a href="https://cloud.drone.io/USERNAME/REPO">https://cloud.drone.io/USERNAME/REPO</a>.</li>
<li>Click on the repository, click on activate repository, and add a secret called <code>git_deploy_private_key</code> with your private key value that you just generated.</li>
<li>Create a <code>.drone.yml</code> on the root of your repository with below text.</li>
</ol>
<pre><code class="hljs css language-yaml"><span class="hljs-comment"># .drone.yml</span>
<span class="hljs-attr">kind:</span> <span class="hljs-string">pipeline</span>
<span class="hljs-attr">type:</span> <span class="hljs-string">docker</span>
<span class="hljs-attr">trigger:</span>
<span class="hljs-attr">event:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">tag</span>
<span class="hljs-bullet">-</span> <span class="hljs-attr">name:</span> <span class="hljs-string">Website</span>
<span class="hljs-attr">image:</span> <span class="hljs-string">node</span>
<span class="hljs-attr">commands:</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">mkdir</span> <span class="hljs-string">-p</span> <span class="hljs-string">$HOME/.ssh</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">ssh-keyscan</span> <span class="hljs-string">-t</span> <span class="hljs-string">rsa</span> <span class="hljs-string">github.com</span> <span class="hljs-string">&gt;&gt;</span> <span class="hljs-string">$HOME/.ssh/known_hosts</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">echo</span> <span class="hljs-string">"$GITHUB_PRIVATE_KEY &gt; $HOME/.ssh/id_rsa"</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">chmod</span> <span class="hljs-number">0600</span> <span class="hljs-string">$HOME/.ssh/id_rsa</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">cd</span> <span class="hljs-string">website</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">npm</span> <span class="hljs-string">i</span>
<span class="hljs-bullet">-</span> <span class="hljs-string">npm</span> <span class="hljs-string">run</span> <span class="hljs-string">publish-gh-pages</span>
<span class="hljs-attr">environment:</span>
<span class="hljs-attr">USE_SSH:</span> <span class="hljs-literal">true</span>
<span class="hljs-attr">GIT_USER:</span> <span class="hljs-string">$DRONE_COMMIT_AUTHOR</span>
<span class="hljs-attr">GITHUB_PRIVATE_KEY:</span> <span class="hljs-string">git_deploy_private_key</span>
</code></pre>
<p>Now, whenever you push a new tag to github, this trigger will start the drone ci job to publish your website.</p>
<h3><a class="anchor" aria-hidden="true" id="hosting-on-vercel"></a><a href="#hosting-on-vercel" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hosting on Vercel</h3>
<p>Deploying your Docusaurus project to <a href="https://vercel.com/">Vercel</a> will provide you with <a href="https://vercel.com/">various benefits</a> in the areas of performance and ease of use.</p>
<p>To deploy your Docusaurus project with a <a href="https://vercel.com/docs/git-integrations">Vercel for Git Integration</a>, make sure it has been pushed to a Git repository.</p>
<p>Import the project into Vercel using the <a href="https://vercel.com/import/git">Import Flow</a>. During the import, you will find all relevant options preconfigured for you; however, you can choose to change any of these options, a list of which can be found <a href="https://vercel.com/docs/build-step#build-&amp;-development-settings">here</a>.</p>
<p>After your project has been imported, all subsequent pushes to branches will generate <a href="https://vercel.com/docs/platform/deployments#preview">Preview Deployments</a>, and all changes made to the <a href="https://vercel.com/docs/git-integrations#production-branch">Production Branch</a> (commonly &quot;main&quot;) will result in a <a href="https://vercel.com/docs/platform/deployments#production">Production Deployment</a>.</p>
<h3><a class="anchor" aria-hidden="true" id="netlify-활용하기"></a><a href="#netlify-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Netlify 활용하기</h3>
<p>아래 단계를 따라 도큐사우르스로 만든 사이트를 Netlify에서 운영할 수 있습니다.</p>
<ol>
<li><p>Select <strong>New site from Git</strong></p></li>
<li><p>사용하고 있는 Git 서비스 공급자에 연결합니다.</p></li>
<li><p>배포할 브랜치를 선택합니다. 기본값은 <code>master</code>입니다.</p></li>
<li><p>빌드 단계의 세부 항목을 설정합니다.</p>
<ul>
<li>빌드 명령어를 다음과 같이 입력합니다. <code>cd website; npm install; npm run build;</code></li>
<li>배포할 디렉토리는 다음과 같습니다. <code>website/build/&lt;projectName&gt;</code> (<code>projectName</code><code>siteConfig</code>에서 설정합니다).</li>
</ul></li>
<li><p>Click <strong>Deploy site</strong></p></li>
</ol>
<p>Netlify 설정을 통해 저장소에 커밋이 발생할때마다 빌드를 처리할 수도 있고 <code>master</code> 브랜치에 커밋이 발생할때만 빌드가 실행될 수 있습니다.</p>
<h3><a class="anchor" aria-hidden="true" id="hosting-on-render"></a><a href="#hosting-on-render" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Hosting on Render</h3>
<p>Render offers free <a href="https://render.com/docs/static-sites">static site</a> hosting with fully managed SSL, custom domains, a global CDN and continuous auto deploy from your Git repo. Deploy your app in just a few minutes by following these steps.</p>
<ol>
<li><p>Create a new <strong>Web Service</strong> on Render, and give Render's GitHub app permission to access your Docusaurus repo.</p></li>
<li><p>배포할 브랜치를 선택합니다. The default is <code>master</code>.</p></li>
<li><p>Enter the following values during creation.</p>
<table>
<thead>
<tr><th>Field</th><th>Value</th></tr>
</thead>
<tbody>
<tr><td><strong>Environment</strong></td><td><code>Static Site</code></td></tr>
<tr><td><strong>Build Command</strong></td><td><code>cd website; yarn install; yarn build</code></td></tr>
<tr><td><strong>Publish Directory</strong></td><td><code>website/build/&lt;projectName&gt;</code></td></tr>
</tbody>
</table>
<p><code>projectName</code> is the value you defined in your <code>siteConfig.js</code>.</p>
<pre><code class="hljs css language-javascript{7}"><span class="hljs-keyword">const</span> siteConfig = {
<span class="hljs-comment">// ...</span>
projectName: <span class="hljs-string">'your-project-name'</span>,
<span class="hljs-comment">// ...</span>
</code></pre></li>
</ol>
<p>That's it! Your app will be live on your Render URL as soon as the build finishes.</p>
<h3><a class="anchor" aria-hidden="true" id="github-enterprise-활용하기"></a><a href="#github-enterprise-활용하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>GitHub Enterprise 활용하기</h3>
<p>GitHub Enterprise의 설치방법은 github.com에서 했던 방법과 같습니다. 그룹 계정에서 사용할 GitHub Enterprise 호스트를 처리해주기만 하면 됩니다.</p>
<table>
<thead>
<tr><th>파라미터</th><th>설명</th></tr>
</thead>
<tbody>
<tr><td><code>GITHUB_HOST</code></td><td>GitHub enterprise 서버에서 사용하는 호스트이름을 설정합니다.</td></tr>
</tbody>
</table>
<p><code>siteConfig.js</code> 파일에 GitHub Enterprise 호스트이름을 설정하는 <code>'githubHost'</code> 속성을 추가합니다. 아니면, 환경 변수로 명령어 실행 시 <code>GITHUB_HOST</code>를 설정할 수 있습니다.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/site-creation"><span class="arrow-prev"></span><span>당신만의 사이트 만들기</span></a><a class="docs-next button" href="/docs/ko/docker"><span>도커</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#정적-html-페이지-만들기">정적 HTML 페이지 만들기</a></li><li><a href="#정적-html-페이지-호스팅하기">정적 HTML 페이지 호스팅하기</a><ul class="toc-headings"><li><a href="#호스팅-서비스-활용하기">호스팅 서비스 활용하기</a></li><li><a href="#using-vercel">Using Vercel</a></li><li><a href="#github-페이지-활용하기">GitHub 페이지 활용하기</a></li></ul></li><li><a href="#지속적인-통합-환경에서-자동으로-배포하기">지속적인 통합 환경에서 자동으로 배포하기</a><ul class="toc-headings"><li><a href="#using-circleci-20">Using CircleCI 2.0</a></li><li><a href="#팁--트릭">&amp; 트릭</a></li><li><a href="#travis-ci-사용하기">Travis CI 사용하기</a></li><li><a href="#using-azure-pipelines">Using Azure Pipelines</a></li><li><a href="#using-drone">Using Drone</a></li><li><a href="#hosting-on-vercel">Hosting on Vercel</a></li><li><a href="#netlify-활용하기">Netlify 활용하기</a></li><li><a href="#hosting-on-render">Hosting on Render</a></li><li><a href="#github-enterprise-활용하기">GitHub Enterprise 활용하기</a></li></ul></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

163
docs/ko/search.html Normal file
View file

@ -0,0 +1,163 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Enabling Search · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="도큐사우르스에서는 [Algolia 문서 검색](https://community.algolia.com/docsearch/) 기능을 지원합니다. 여러분의 웹사이트가 온라인 상태라면 [DocSearch에 요청하기](https://community.algolia.com/docsearch/)를 할 수 있습니다. Algolia에서 인증 코드를 보내주면 `siteConfig.js` 파일에 추가합니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Enabling Search · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="도큐사우르스에서는 [Algolia 문서 검색](https://community.algolia.com/docsearch/) 기능을 지원합니다. 여러분의 웹사이트가 온라인 상태라면 [DocSearch에 요청하기](https://community.algolia.com/docsearch/)를 할 수 있습니다. Algolia에서 인증 코드를 보내주면 `siteConfig.js` 파일에 추가합니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/search">English</a></li><li><a href="/docs/fr/search">Français</a></li><li><a href="/docs/pt-BR/search">Português (Brasil)</a></li><li><a href="/docs/ro/search">Română</a></li><li><a href="/docs/ru/search">Русский</a></li><li><a href="/docs/zh-CN/search">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>가이드</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Enabling Search</h1></header><article><div><span><p>도큐사우르스에서는 <a href="https://community.algolia.com/docsearch/">Algolia 문서 검색</a> 기능을 지원합니다. 여러분의 웹사이트가 온라인 상태라면 <a href="https://community.algolia.com/docsearch/">DocSearch에 요청하기</a>를 할 수 있습니다. Algolia에서 인증 코드를 보내주면 <code>siteConfig.js</code> 파일에 추가합니다.</p>
<p>DocSearch는 매일 24시간동안 여러분의 웹사이트 콘텐츠를 수집해서 Algolia 인덱스에 모든 콘텐츠를 추가합니다. 여러분의 웹사이트에서 Algolia API를 사용해 수집된 콘텐츠에 대해 질의를 던질 수 있습니다. Note that your website needs to be publicly available for this to work (ie. not behind a firewall). 이 서비스는 무료입니다.</p>
<h2><a class="anchor" aria-hidden="true" id="검색창-활성화하기"></a><a href="#검색창-활성화하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>검색창 활성화하기</h2>
<p><code>siteConfig.js</code> 파일의 <code>algolia</code> 항목에서 API 키와 인덱스명(Algolia에서 보내준)을 입력하면 웹사이트에서 검색 기능을 사용할 수 있습니다.</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
algolia: {
<span class="hljs-attr">apiKey</span>: <span class="hljs-string">'my-api-key'</span>,
<span class="hljs-attr">indexName</span>: <span class="hljs-string">'my-index-name'</span>,
<span class="hljs-attr">appId</span>: <span class="hljs-string">'app-id'</span>, <span class="hljs-comment">// Optional, if you run the DocSearch crawler on your own</span>
<span class="hljs-attr">algoliaOptions</span>: {} <span class="hljs-comment">// Optional, if provided by Algolia</span>
},
...
};
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="extra-search-options"></a><a href="#extra-search-options" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Extra Search Options</h2>
<p>You can also specify extra <a href="https://docsearch.algolia.com/">search options used by Algolia</a> by using an <code>algoliaOptions</code> field in <code>algolia</code>. This may be useful if you want to provide different search results for the different versions or languages of your docs. Any occurrences of &quot;VERSION&quot; or &quot;LANGUAGE&quot; will be replaced by the version or language of the current page, respectively. More details about search options can be <a href="https://www.algolia.com/doc/api-reference/api-parameters/#overview">found here</a>.</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
algolia: {
...
algoliaOptions: {
<span class="hljs-attr">facetFilters</span>: [ <span class="hljs-string">"language:LANGUAGE"</span>, <span class="hljs-string">"version:VERSION"</span> ]
}
},
};
</code></pre>
<p>Algolia might provide you with <a href="https://docsearch.algolia.com/">extra search options</a>. If so, you should add them to the <code>algoliaOptions</code> object.</p>
<h2><a class="anchor" aria-hidden="true" id="controlling-the-location-of-the-search-bar"></a><a href="#controlling-the-location-of-the-search-bar" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Controlling the Location of the Search Bar</h2>
<p>By default, the search bar will be the rightmost element in the top navigation bar.</p>
<p>If you want to change the default location, add the <code>searchBar</code> flag in the <code>headerLinks</code> field of <code>siteConfig.js</code> in your desired location. For example, you may want the search bar between your internal and external links.</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
headerLinks: [
{...}
{...}
{ <span class="hljs-attr">search</span>: <span class="hljs-literal">true</span> }
{...}
{...}
],
...
};
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="customizing-the-placeholder"></a><a href="#customizing-the-placeholder" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Customizing the placeholder</h2>
<p>If you want to change the placeholder (which defaults to <em>Search</em>), add the <code>placeholder</code> field in your config. For example, you may want the search bar to display <em>Ask me something</em>:</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
algolia: {
...
placeholder: <span class="hljs-string">'Ask me something'</span>
},
};
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="disabling-the-search-bar"></a><a href="#disabling-the-search-bar" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Disabling the Search Bar</h2>
<p>To disable the search bar, comment out (recommended) or delete the <code>algolia</code> section in the <code>siteConfig.js</code> file.</p>
<p>Also, if you have customized the location of the search bar in <code>headerLinks</code>, set <code>search: false</code>.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/custom-pages"><span class="arrow-prev"></span><span>사용자 지정 페이지</span></a><a class="docs-next button" href="/docs/ko/navigation"><span>네비게이션과 사이드바</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#검색창-활성화하기">검색창 활성화하기</a></li><li><a href="#extra-search-options">Extra Search Options</a></li><li><a href="#controlling-the-location-of-the-search-bar">Controlling the Location of the Search Bar</a></li><li><a href="#customizing-the-placeholder">Customizing the placeholder</a></li><li><a href="#disabling-the-search-bar">Disabling the Search Bar</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

163
docs/ko/search/index.html Normal file
View file

@ -0,0 +1,163 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Enabling Search · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="도큐사우르스에서는 [Algolia 문서 검색](https://community.algolia.com/docsearch/) 기능을 지원합니다. 여러분의 웹사이트가 온라인 상태라면 [DocSearch에 요청하기](https://community.algolia.com/docsearch/)를 할 수 있습니다. Algolia에서 인증 코드를 보내주면 `siteConfig.js` 파일에 추가합니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Enabling Search · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="도큐사우르스에서는 [Algolia 문서 검색](https://community.algolia.com/docsearch/) 기능을 지원합니다. 여러분의 웹사이트가 온라인 상태라면 [DocSearch에 요청하기](https://community.algolia.com/docsearch/)를 할 수 있습니다. Algolia에서 인증 코드를 보내주면 `siteConfig.js` 파일에 추가합니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/search">English</a></li><li><a href="/docs/fr/search">Français</a></li><li><a href="/docs/pt-BR/search">Português (Brasil)</a></li><li><a href="/docs/ro/search">Română</a></li><li><a href="/docs/ru/search">Русский</a></li><li><a href="/docs/zh-CN/search">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>가이드</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Enabling Search</h1></header><article><div><span><p>도큐사우르스에서는 <a href="https://community.algolia.com/docsearch/">Algolia 문서 검색</a> 기능을 지원합니다. 여러분의 웹사이트가 온라인 상태라면 <a href="https://community.algolia.com/docsearch/">DocSearch에 요청하기</a>를 할 수 있습니다. Algolia에서 인증 코드를 보내주면 <code>siteConfig.js</code> 파일에 추가합니다.</p>
<p>DocSearch는 매일 24시간동안 여러분의 웹사이트 콘텐츠를 수집해서 Algolia 인덱스에 모든 콘텐츠를 추가합니다. 여러분의 웹사이트에서 Algolia API를 사용해 수집된 콘텐츠에 대해 질의를 던질 수 있습니다. Note that your website needs to be publicly available for this to work (ie. not behind a firewall). 이 서비스는 무료입니다.</p>
<h2><a class="anchor" aria-hidden="true" id="검색창-활성화하기"></a><a href="#검색창-활성화하기" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>검색창 활성화하기</h2>
<p><code>siteConfig.js</code> 파일의 <code>algolia</code> 항목에서 API 키와 인덱스명(Algolia에서 보내준)을 입력하면 웹사이트에서 검색 기능을 사용할 수 있습니다.</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
algolia: {
<span class="hljs-attr">apiKey</span>: <span class="hljs-string">'my-api-key'</span>,
<span class="hljs-attr">indexName</span>: <span class="hljs-string">'my-index-name'</span>,
<span class="hljs-attr">appId</span>: <span class="hljs-string">'app-id'</span>, <span class="hljs-comment">// Optional, if you run the DocSearch crawler on your own</span>
<span class="hljs-attr">algoliaOptions</span>: {} <span class="hljs-comment">// Optional, if provided by Algolia</span>
},
...
};
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="extra-search-options"></a><a href="#extra-search-options" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Extra Search Options</h2>
<p>You can also specify extra <a href="https://docsearch.algolia.com/">search options used by Algolia</a> by using an <code>algoliaOptions</code> field in <code>algolia</code>. This may be useful if you want to provide different search results for the different versions or languages of your docs. Any occurrences of &quot;VERSION&quot; or &quot;LANGUAGE&quot; will be replaced by the version or language of the current page, respectively. More details about search options can be <a href="https://www.algolia.com/doc/api-reference/api-parameters/#overview">found here</a>.</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
algolia: {
...
algoliaOptions: {
<span class="hljs-attr">facetFilters</span>: [ <span class="hljs-string">"language:LANGUAGE"</span>, <span class="hljs-string">"version:VERSION"</span> ]
}
},
};
</code></pre>
<p>Algolia might provide you with <a href="https://docsearch.algolia.com/">extra search options</a>. If so, you should add them to the <code>algoliaOptions</code> object.</p>
<h2><a class="anchor" aria-hidden="true" id="controlling-the-location-of-the-search-bar"></a><a href="#controlling-the-location-of-the-search-bar" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Controlling the Location of the Search Bar</h2>
<p>By default, the search bar will be the rightmost element in the top navigation bar.</p>
<p>If you want to change the default location, add the <code>searchBar</code> flag in the <code>headerLinks</code> field of <code>siteConfig.js</code> in your desired location. For example, you may want the search bar between your internal and external links.</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
headerLinks: [
{...}
{...}
{ <span class="hljs-attr">search</span>: <span class="hljs-literal">true</span> }
{...}
{...}
],
...
};
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="customizing-the-placeholder"></a><a href="#customizing-the-placeholder" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Customizing the placeholder</h2>
<p>If you want to change the placeholder (which defaults to <em>Search</em>), add the <code>placeholder</code> field in your config. For example, you may want the search bar to display <em>Ask me something</em>:</p>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> siteConfig = {
...
algolia: {
...
placeholder: <span class="hljs-string">'Ask me something'</span>
},
};
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="disabling-the-search-bar"></a><a href="#disabling-the-search-bar" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Disabling the Search Bar</h2>
<p>To disable the search bar, comment out (recommended) or delete the <code>algolia</code> section in the <code>siteConfig.js</code> file.</p>
<p>Also, if you have customized the location of the search bar in <code>headerLinks</code>, set <code>search: false</code>.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/custom-pages"><span class="arrow-prev"></span><span>사용자 지정 페이지</span></a><a class="docs-next button" href="/docs/ko/navigation"><span>네비게이션과 사이드바</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#검색창-활성화하기">검색창 활성화하기</a></li><li><a href="#extra-search-options">Extra Search Options</a></li><li><a href="#controlling-the-location-of-the-search-bar">Controlling the Location of the Search Bar</a></li><li><a href="#customizing-the-placeholder">Customizing the placeholder</a></li><li><a href="#disabling-the-search-bar">Disabling the Search Bar</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

433
docs/ko/site-config.html Normal file
View file

@ -0,0 +1,433 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>siteConfig.js · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="A large part of the site configuration is done by editing the `siteConfig.js` file."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="siteConfig.js · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="A large part of the site configuration is done by editing the `siteConfig.js` file."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/site-config">English</a></li><li><a href="/docs/fr/site-config">Français</a></li><li><a href="/docs/pt-BR/site-config">Português (Brasil)</a></li><li><a href="/docs/ro/site-config">Română</a></li><li><a href="/docs/ru/site-config">Русский</a></li><li><a href="/docs/zh-CN/site-config">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>API</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">siteConfig.js</h1></header><article><div><span><p>A large part of the site configuration is done by editing the <code>siteConfig.js</code> file.</p>
<h2><a class="anchor" aria-hidden="true" id="user-showcase"></a><a href="#user-showcase" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>User Showcase</h2>
<p>The <code>users</code> array is used to store objects for each project/user that you want to show on your site. Currently, this field is used by the example <code>pages/en/index.js</code> and <code>pages/en/users.js</code> files provided. Each user object should have <code>caption</code>, <code>image</code>, <code>infoLink</code>, and <code>pinned</code> fields. The <code>caption</code> is the text showed when someone hovers over the <code>image</code> of that user, and the <code>infoLink</code> is where clicking the image will bring someone. The <code>pinned</code> field determines whether or not it shows up on the <code>index</code> page.</p>
<p>Currently, this <code>users</code> array is used only by the <code>index.js</code> and <code>users.js</code> example files. If you do not wish to have a users page or show users on the <code>index</code> page, you may remove this section.</p>
<h2><a class="anchor" aria-hidden="true" id="siteconfig-fields"></a><a href="#siteconfig-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>siteConfig Fields</h2>
<p>The <code>siteConfig</code> object contains the bulk of the configuration settings for your website.</p>
<h3><a class="anchor" aria-hidden="true" id="mandatory-fields"></a><a href="#mandatory-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Mandatory Fields</h3>
<h4><a class="anchor" aria-hidden="true" id="baseurl-string"></a><a href="#baseurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>baseUrl</code> [string]</h4>
<p>baseUrl for your site. This can also be considered the path after the host. For example, <code>/metro/</code> is the baseUrl of <a href="https://facebook.github.io/metro/">https://facebook.github.io/metro/</a>. For URLs that have no path, the baseUrl should be set to <code>/</code>. This field is related to the <a href="#url-string"><code>url</code> field</a>.</p>
<h4><a class="anchor" aria-hidden="true" id="colors-object"></a><a href="#colors-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>colors</code> [object]</h4>
<p>Color configurations for the site.</p>
<ul>
<li><code>primaryColor</code> is the color used the header navigation bar and sidebars.</li>
<li><code>secondaryColor</code> is the color seen in the second row of the header navigation bar when the site window is narrow (including on mobile).</li>
<li>Custom color configurations can also be added. For example, if user styles are added with colors specified as <code>$myColor</code>, then adding a <code>myColor</code> field to <code>colors</code> will allow you to configure this color.</li>
</ul>
<h4><a class="anchor" aria-hidden="true" id="copyright-string"></a><a href="#copyright-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>copyright</code> [string]</h4>
<p>The copyright string at the footer of the site and within the feed</p>
<h4><a class="anchor" aria-hidden="true" id="favicon-string"></a><a href="#favicon-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>favicon</code> [string]</h4>
<p>URL for site favicon.</p>
<h4><a class="anchor" aria-hidden="true" id="headericon-string"></a><a href="#headericon-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>headerIcon</code> [string]</h4>
<p>URL for icon used in the header navigation bar.</p>
<h4><a class="anchor" aria-hidden="true" id="headerlinks-array"></a><a href="#headerlinks-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>headerLinks</code> [array]</h4>
<p>Links that will be used in the header navigation bar. The <code>label</code> field of each object will be the link text and will also be translated for each language.</p>
<p>Example Usage:</p>
<pre><code class="hljs css language-js">headerLinks: [
<span class="hljs-comment">// Links to document with id doc1 for current language/version</span>
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">"doc1"</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"Getting Started"</span> },
<span class="hljs-comment">// Link to page found at pages/en/help.js or if that does not exist, pages/help.js, for current language</span>
{ <span class="hljs-attr">page</span>: <span class="hljs-string">"help"</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"Help"</span> },
<span class="hljs-comment">// Links to href destination, using target=_blank (external)</span>
{ <span class="hljs-attr">href</span>: <span class="hljs-string">"https://github.com/"</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"GitHub"</span>, <span class="hljs-attr">external</span>: <span class="hljs-literal">true</span> },
<span class="hljs-comment">// Links to blog generated by Docusaurus (${baseUrl}blog)</span>
{ <span class="hljs-attr">blog</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"Blog"</span> },
<span class="hljs-comment">// Determines search bar position among links</span>
{ <span class="hljs-attr">search</span>: <span class="hljs-literal">true</span> },
<span class="hljs-comment">// Determines language drop down position among links</span>
{ <span class="hljs-attr">languages</span>: <span class="hljs-literal">true</span> }
],
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="organizationname-string"></a><a href="#organizationname-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>organizationName</code> [string]</h4>
<p>GitHub username of the organization or user hosting this project. This is used by the publishing script to determine where your GitHub pages website will be hosted.</p>
<h4><a class="anchor" aria-hidden="true" id="projectname-string"></a><a href="#projectname-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>projectName</code> [string]</h4>
<p>Project name. This must match your GitHub repository project name (case-sensitive).</p>
<h4><a class="anchor" aria-hidden="true" id="tagline-string"></a><a href="#tagline-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>tagline</code> [string]</h4>
<p>The tagline for your website.</p>
<h4><a class="anchor" aria-hidden="true" id="title-string"></a><a href="#title-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>title</code> [string]</h4>
<p>Title for your website.</p>
<h4><a class="anchor" aria-hidden="true" id="url-string"></a><a href="#url-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>url</code> [string]</h4>
<p>URL for your website. This can also be considered the top-level hostname. For example, <code>https://facebook.github.io</code> is the URL of <a href="https://facebook.github.io/metro/">https://facebook.github.io/metro/</a>, and <code>https://docusaurus.io</code> is the URL for <a href="https://docusaurus.io">https://docusaurus.io</a>. This field is related to the <a href="#baseurl-string"><code>baseUrl</code> field</a>.</p>
<h3><a class="anchor" aria-hidden="true" id="optional-fields"></a><a href="#optional-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Optional Fields</h3>
<h4><a class="anchor" aria-hidden="true" id="algolia-object"></a><a href="#algolia-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>algolia</code> [object]</h4>
<p>Information for Algolia search integration. If this field is excluded, the search bar will not appear in the header. You must specify two values for this field, and one (<code>appId</code>) is optional.</p>
<ul>
<li><code>apiKey</code> - the Algolia provided an API key for your search.</li>
<li><code>indexName</code> - the Algolia provided index name for your search (usually this is the project name)</li>
<li><code>appId</code> - Algolia provides a default scraper for your docs. If you provide your own, you will probably get this id from them.</li>
</ul>
<h4><a class="anchor" aria-hidden="true" id="blogsidebarcount-number"></a><a href="#blogsidebarcount-number" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>blogSidebarCount</code> [number]</h4>
<p>Control the number of blog posts that show up in the sidebar. See the <a href="/docs/ko/adding-blog#changing-how-many-blog-posts-show-on-sidebar">adding a blog docs</a> for more information.</p>
<h4><a class="anchor" aria-hidden="true" id="blogsidebartitle-string"></a><a href="#blogsidebartitle-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>blogSidebarTitle</code> [string]</h4>
<p>Control the title of the blog sidebar. See the <a href="/docs/ko/adding-blog#changing-the-sidebar-title">adding a blog docs</a> for more information.</p>
<h4><a class="anchor" aria-hidden="true" id="cleanurl-boolean"></a><a href="#cleanurl-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>cleanUrl</code> [boolean]</h4>
<p>If <code>true</code>, allow URLs with no <code>HTML</code> extension. For example, a request to URL <a href="https://docusaurus.io/docs/installation">https://docusaurus.io/docs/installation</a> will return the same result as <a href="https://docusaurus.io/docs/installation.html">https://docusaurus.io/docs/installation.html</a>.</p>
<blockquote>
<p>If users intend for this website to be used exclusively offline, this value must be set to <code>false</code>. Otherwise, it will cause the site to route to the parent folder of the linked page.</p>
</blockquote>
<h4><a class="anchor" aria-hidden="true" id="cname-string"></a><a href="#cname-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>cname</code> [string]</h4>
<p>The CNAME for your website. It will go into a <code>CNAME</code> file when your site is built.</p>
<h4><a class="anchor" aria-hidden="true" id="customdocspath-string"></a><a href="#customdocspath-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>customDocsPath</code> [string]</h4>
<p>By default, Docusaurus expects your documentation to be in a directory called <code>docs</code>. This directory is at the same level as the <code>website</code> directory (i.e., not inside the <code>website</code> directory). You can specify a custom path to your documentation with this field.</p>
<pre><code class="hljs css language-js">customDocsPath: <span class="hljs-string">'docs/site'</span>;
</code></pre>
<pre><code class="hljs css language-js">customDocsPath: <span class="hljs-string">'website-docs'</span>;
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="defaultversionshown-string"></a><a href="#defaultversionshown-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>defaultVersionShown</code> [string]</h4>
<p>The default version for the site to be shown. If this is not set, the latest version will be shown.</p>
<h4><a class="anchor" aria-hidden="true" id="deleteddocs-object"></a><a href="#deleteddocs-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>deletedDocs</code> [object]</h4>
<p>Even if you delete the main file for a documentation page and delete it from your sidebar, the page will still be created for every version and for the current version due to <a href="versioning#fallback-functionality">fallback functionality</a>. This can lead to confusion if people find the documentation by searching and it appears to be something relevant to a particular version but actually is not.</p>
<p>To force removal of content beginning with a certain version (including for current/next), add a <code>deletedDocs</code> object to your config, where each key is a version and the value is an array of document IDs that should not be generated for that version and all later versions.</p>
<p>예제:</p>
<pre><code class="hljs css language-js">{
<span class="hljs-attr">deletedDocs</span>: {
<span class="hljs-string">"2.0.0"</span>: [
<span class="hljs-string">"tagging"</span>
]
}
}
</code></pre>
<p>The version keys must match those in <code>versions.json</code>. Assuming the versions list in <code>versions.json</code> is <code>[&quot;3.0.0&quot;, &quot;2.0.0&quot;, &quot;1.1.0&quot;, &quot;1.0.0&quot;]</code>, the <code>docs/1.0.0/tagging</code> and <code>docs/1.1.0/tagging</code> URLs will work but <code>docs/2.0.0/tagging</code>, <code>docs/3.0.0/tagging</code>, and <code>docs/tagging</code> will not. The files and folders for those versions will not be generated during the build.</p>
<h4><a class="anchor" aria-hidden="true" id="docsurl-string"></a><a href="#docsurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>docsUrl</code> [string]</h4>
<p>The base URL for all docs file. Set this field to <code>''</code> to remove the <code>docs</code> prefix of the documentation URL. If unset, it is defaulted to <code>docs</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="disableheadertitle-boolean"></a><a href="#disableheadertitle-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>disableHeaderTitle</code> [boolean]</h4>
<p>An option to disable showing the title in the header next to the header icon. Exclude this field to keep the header as normal, otherwise set to <code>true</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="disabletitletagline-boolean"></a><a href="#disabletitletagline-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>disableTitleTagline</code> [boolean]</h4>
<p>An option to disable showing the tagline in the title of main pages. Exclude this field to keep page titles as <code>Title • Tagline</code>. Set to <code>true</code> to make page titles just <code>Title</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="docssidenavcollapsible-boolean"></a><a href="#docssidenavcollapsible-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>docsSideNavCollapsible</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to be able to expand/collapse the links and subcategories in the sidebar.</p>
<h4><a class="anchor" aria-hidden="true" id="editurl-string"></a><a href="#editurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>editUrl</code> [string]</h4>
<p>URL for editing docs, usage example: <code>editUrl + 'en/doc1.md'</code>. If this field is omitted, there will be no &quot;Edit this Doc&quot; button for each document.</p>
<h4><a class="anchor" aria-hidden="true" id="enableupdateby-boolean"></a><a href="#enableupdateby-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>enableUpdateBy</code> [boolean]</h4>
<p>An option to enable the docs showing the author who last updated the doc. Set to <code>true</code> to show a line at the bottom right corner of each doc page as <code>Last updated by &lt;Author Name&gt;</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="enableupdatetime-boolean"></a><a href="#enableupdatetime-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>enableUpdateTime</code> [boolean]</h4>
<p>An option to enable the docs showing last update time. Set to <code>true</code> to show a line at the bottom right corner of each doc page as <code>Last updated on &lt;date&gt;</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="facebookappid-string"></a><a href="#facebookappid-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>facebookAppId</code> [string]</h4>
<p>If you want Facebook Like/Share buttons in the footer and at the bottom of your blog posts, provide a <a href="https://www.facebook.com/help/audiencenetwork/804209223039296">Facebook application id</a>.</p>
<h4><a class="anchor" aria-hidden="true" id="facebookcomments-boolean"></a><a href="#facebookcomments-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>facebookComments</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to enable Facebook comments at the bottom of your blog post. <code>facebookAppId</code> has to be also set.</p>
<h4><a class="anchor" aria-hidden="true" id="facebookpixelid-string"></a><a href="#facebookpixelid-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>facebookPixelId</code> [string]</h4>
<p><a href="https://www.facebook.com/business/a/facebook-pixel">Facebook Pixel</a> ID to track page views.</p>
<h4><a class="anchor" aria-hidden="true" id="fonts-object"></a><a href="#fonts-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>fonts</code> [object]</h4>
<p>Font-family CSS configuration for the site. If a font family is specified in <code>siteConfig.js</code> as <code>$myFont</code>, then adding a <code>myFont</code> key to an array in <code>fonts</code> will allow you to configure the font. Items appearing earlier in the array will take priority of later elements, so ordering of the fonts matter.</p>
<p>In the below example, we have two sets of font configurations, <code>myFont</code> and <code>myOtherFont</code>. <code>Times New Roman</code> is the preferred font in <code>myFont</code>. <code>-apple-system</code> is the preferred in <code>myOtherFont</code>.</p>
<pre><code class="hljs css language-js">fonts: {
<span class="hljs-attr">myFont</span>: [
<span class="hljs-string">'Times New Roman'</span>,
<span class="hljs-string">'Serif'</span>
],
<span class="hljs-attr">myOtherFont</span>: [
<span class="hljs-string">'-apple-system'</span>,
<span class="hljs-string">'system-ui'</span>
]
},
</code></pre>
<p>The above fonts would be represented in your CSS file(s) as variables <code>$myFont</code> and <code>$myOtherFont</code>.</p>
<pre><code class="hljs css language-css"><span class="hljs-selector-tag">h1</span> {
<span class="hljs-attribute">font-family</span>: $myFont;
}
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="footericon-string"></a><a href="#footericon-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>footerIcon</code> [string]</h4>
<p>URL for a footer icon. Currently used in the <code>core/Footer.js</code> file provided as an example, but it can be removed from that file.</p>
<h4><a class="anchor" aria-hidden="true" id="gatrackingid-string"></a><a href="#gatrackingid-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>gaTrackingId</code> [string]</h4>
<p>Google Analytics tracking ID to track page views.</p>
<h4><a class="anchor" aria-hidden="true" id="gagtag-boolean"></a><a href="#gagtag-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>gaGtag</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to use <a href="https://developers.google.com/gtagjs/">global site tags (gtag.js)</a> for Google analytics instead of <code>analytics.js</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="githubhost-string"></a><a href="#githubhost-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>githubHost</code> [string]</h4>
<p>The hostname of your server. Useful if you are using GitHub Enterprise.</p>
<h4><a class="anchor" aria-hidden="true" id="highlight"></a><a href="#highlight" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>highlight</code></h4>
<p><a href="/docs/ko/doc-markdown">Syntax highlighting</a> options:</p>
<pre><code class="hljs css language-js">{
<span class="hljs-comment">// ...</span>
<span class="hljs-attr">highlight</span>: {
<span class="hljs-comment">// The name of the theme used by Highlight.js when highlighting code.</span>
<span class="hljs-comment">// You can find the list of supported themes here:</span>
<span class="hljs-comment">// https://github.com/isagalaev/highlight.js/tree/master/src/styles</span>
<span class="hljs-attr">theme</span>: <span class="hljs-string">'default'</span>,
<span class="hljs-comment">// The particular version of Highlight.js to be used.</span>
<span class="hljs-attr">version</span>: <span class="hljs-string">'9.12.0'</span>,
<span class="hljs-comment">// Escape valve by passing an instance of Highlight.js to the function specified here, allowing additional languages to be registered for syntax highlighting.</span>
<span class="hljs-attr">hljs</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">highlightJsInstance</span>) </span>{
<span class="hljs-comment">// do something here</span>
},
<span class="hljs-comment">// Default language.</span>
<span class="hljs-comment">// It will be used if one is not specified at the top of the code block. You can find the list of supported languages here:</span>
<span class="hljs-comment">// https://github.com/isagalaev/highlight.js/tree/master/src/languages</span>
<span class="hljs-attr">defaultLang</span>: <span class="hljs-string">'javascript'</span>,
<span class="hljs-comment">// custom URL of CSS theme file that you want to use with Highlight.js. If this is provided, the `theme` and `version` fields will be ignored.</span>
<span class="hljs-attr">themeUrl</span>: <span class="hljs-string">'http://foo.bar/custom.css'</span>
},
}
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="manifest-string"></a><a href="#manifest-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>manifest</code> [string]</h4>
<p>Path to your web app manifest (e.g., <code>manifest.json</code>). This will add a <code>&lt;link&gt;</code> tag to <code>&lt;head&gt;</code> with <code>rel</code> as <code>&quot;manifest&quot;</code> and <code>href</code> as the provided path.</p>
<h4><a class="anchor" aria-hidden="true" id="markdownoptions-object"></a><a href="#markdownoptions-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>markdownOptions</code> [object]</h4>
<p>Override default <a href="https://github.com/jonschlinkert/remarkable#options">Remarkable options</a> that will be used to render markdown.</p>
<blockquote>
<p>To manage <a href="https://github.com/jonschlinkert/remarkable#syntax-extensions">syntax extensions</a>, use the <code>markdownPlugins</code> field.</p>
</blockquote>
<h4><a class="anchor" aria-hidden="true" id="markdownplugins-array"></a><a href="#markdownplugins-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>markdownPlugins</code> [array]</h4>
<p>An array of plugins to be loaded by Remarkable, the markdown parser and renderer used by Docusaurus. The plugin will receive a reference to the Remarkable instance, allowing custom parsing and rendering rules to be defined.</p>
<p>For example, if you want to <a href="https://github.com/jonschlinkert/remarkable#syntax-extensions">enable superscript and subscript</a> in your markdown that is rendered by Remarkable to HTML, you would do the following:</p>
<pre><code class="hljs"> markdownPlugins: [
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">foo</span><span class="hljs-params">(md)</span> </span>{
md.inline.ruler.enable([<span class="hljs-string">'sub'</span>, <span class="hljs-string">'sup'</span>]);
},
],
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="noindex-boolean"></a><a href="#noindex-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>noIndex</code> [boolean]</h4>
<p>Boolean. If true, Docusaurus will politely ask crawlers and search engines to avoid indexing your site. This is done with a header tag and so only applies to docs and pages. Will not attempt to hide static resources. This is a best effort request. Malicious crawlers can and will still index your site.</p>
<h4><a class="anchor" aria-hidden="true" id="ogimage-string"></a><a href="#ogimage-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>ogImage</code> [string]</h4>
<p>Local path to an Open Graph image (e.g., <code>img/myImage.png</code>). This image will show up when your site is shared on Facebook and other websites/apps where the Open Graph protocol is supported.</p>
<h4><a class="anchor" aria-hidden="true" id="onpagenav-string"></a><a href="#onpagenav-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>onPageNav</code> [string]</h4>
<p>If you want a visible navigation option for representing topics on the current page. Currently, there is one accepted value for this option:</p>
<ul>
<li><code>separate</code> - The secondary navigation is a separate pane defaulting on the right side of a document. See <a href="http://docusaurus.io/docs/en/translation.html">http://docusaurus.io/docs/en/translation.html</a> for an example.</li>
</ul>
<h4><a class="anchor" aria-hidden="true" id="scripts-array"></a><a href="#scripts-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>scripts</code> [array]</h4>
<p>An array of JavaScript sources to load. The values can be either strings or plain objects of attribute-value maps. Refer to the example below. The script tag will be inserted in the HTML head.</p>
<h4><a class="anchor" aria-hidden="true" id="separatecss-array"></a><a href="#separatecss-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>separateCss</code> [array]</h4>
<p>Directories inside which any <code>CSS</code> files will not be processed and concatenated to Docusaurus' styles. This is to support static <code>HTML</code> pages that may be separate from Docusaurus with completely separate styles.</p>
<h4><a class="anchor" aria-hidden="true" id="scrolltotop-boolean"></a><a href="#scrolltotop-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>scrollToTop</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to enable the scroll to top button at the bottom of your site.</p>
<h4><a class="anchor" aria-hidden="true" id="scrolltotopoptions-object"></a><a href="#scrolltotopoptions-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>scrollToTopOptions</code> [object]</h4>
<p>Optional options configuration for the scroll to top button. You do not need to use this, even if you set <code>scrollToTop</code> to <code>true</code>; it just provides you more configuration control of the button. You can find more options <a href="https://github.com/vfeskov/vanilla-back-to-top/blob/v7.1.14/OPTIONS.md">here</a>. By default, we set the zIndex option to 100.</p>
<h4><a class="anchor" aria-hidden="true" id="slugpreprocessor-function"></a><a href="#slugpreprocessor-function" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>slugPreprocessor</code> [function]</h4>
<p>Define the slug preprocessor function if you want to customize the text used for generating the hash links. Function provides the base string as the first argument and must always return a string.</p>
<h4><a class="anchor" aria-hidden="true" id="stylesheets-array"></a><a href="#stylesheets-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>stylesheets</code> [array]</h4>
<p>An array of CSS sources to load. The values can be either strings or plain objects of attribute-value maps. The link tag will be inserted in the HTML head.</p>
<h4><a class="anchor" aria-hidden="true" id="translationrecruitinglink-string"></a><a href="#translationrecruitinglink-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>translationRecruitingLink</code> [string]</h4>
<p>URL for the <code>Help Translate</code> tab of language selection when languages besides English are enabled. This can be included you are using translations but does not have to be.</p>
<h4><a class="anchor" aria-hidden="true" id="twitter-boolean"></a><a href="#twitter-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>twitter</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want a Twitter social button to appear at the bottom of your blog posts.</p>
<h4><a class="anchor" aria-hidden="true" id="twitterusername-string"></a><a href="#twitterusername-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>twitterUsername</code> [string]</h4>
<p>If you want a Twitter follow button at the bottom of your page, provide a Twitter username to follow. For example: <code>docusaurus</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="twitterimage-string"></a><a href="#twitterimage-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>twitterImage</code> [string]</h4>
<p>Local path to your Twitter card image (e.g., <code>img/myImage.png</code>). This image will show up on the Twitter card when your site is shared on Twitter.</p>
<h4><a class="anchor" aria-hidden="true" id="useenglishurl-string"></a><a href="#useenglishurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>useEnglishUrl</code> [string]</h4>
<p>If you do not have <a href="/docs/ko/translation">translations</a> enabled (e.g., by having a <code>languages.js</code> file), but still want a link of the form <code>/docs/en/doc.html</code> (with the <code>en</code>), set this to <code>true</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="users-array"></a><a href="#users-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>users</code> [array]</h4>
<p>The <code>users</code> array mentioned earlier.</p>
<h4><a class="anchor" aria-hidden="true" id="useprism-array"></a><a href="#useprism-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>usePrism</code> [array]</h4>
<p>An array of languages to use Prism syntax highlighter. Refer to <a href="/docs/ko/doc-markdown#using-prism-as-additional-syntax-highlighter">Using Prism as additional syntax highlighter</a>. Set it to <code>true</code> to use Prism on all languages.</p>
<h4><a class="anchor" aria-hidden="true" id="wrappageshtml-boolean"></a><a href="#wrappageshtml-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>wrapPagesHTML</code> [boolean]</h4>
<p>Boolean flag to indicate whether <code>HTML</code> files in <code>/pages</code> should be wrapped with Docusaurus site styles, header and footer. This feature is experimental and relies on the files being <code>HTML</code> fragments instead of complete pages. It inserts the contents of your <code>HTML</code> file with no extra processing. Defaults to <code>false</code>.</p>
<p>Users can also add their own custom fields if they wish to provide some data across different files.</p>
<h2><a class="anchor" aria-hidden="true" id="adding-google-fonts"></a><a href="#adding-google-fonts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Adding Google Fonts</h2>
<!-- TODO: Shift this into a dedicated styling section in future -->
<p>Google Fonts offers faster load times by caching fonts without forcing users to sacrifice privacy. For more information on Google Fonts, see the <a href="https://fonts.google.com/">Google Fonts</a> documentation.</p>
<p>To add Google Fonts to your Docusaurus deployment, add the font path to the <code>siteConfig.js</code> under <code>stylesheets</code>:</p>
<pre><code class="hljs css language-js">stylesheets: [
<span class="hljs-string">'https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700'</span>,
],
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="example-siteconfigjs-with-many-available-fields"></a><a href="#example-siteconfigjs-with-many-available-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example siteConfig.js with many available fields</h2>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> users = [
{
<span class="hljs-attr">caption</span>: <span class="hljs-string">'User1'</span>,
<span class="hljs-attr">image</span>: <span class="hljs-string">'/test-site/img/docusaurus.svg'</span>,
<span class="hljs-attr">infoLink</span>: <span class="hljs-string">'https://www.example.com'</span>,
<span class="hljs-attr">pinned</span>: <span class="hljs-literal">true</span>,
},
];
<span class="hljs-keyword">const</span> siteConfig = {
<span class="hljs-attr">title</span>: <span class="hljs-string">'Docusaurus'</span>,
<span class="hljs-attr">tagline</span>: <span class="hljs-string">'Generate websites!'</span>,
<span class="hljs-attr">url</span>: <span class="hljs-string">'https://docusaurus.io'</span>,
<span class="hljs-attr">baseUrl</span>: <span class="hljs-string">'/'</span>,
<span class="hljs-comment">// For github.io type URLS, you would combine the URL and baseUrl like:</span>
<span class="hljs-comment">// url: 'https://reasonml.github.io',</span>
<span class="hljs-comment">// baseUrl: '/reason-react/',</span>
<span class="hljs-attr">defaultVersionShown</span>: <span class="hljs-string">'1.0.0'</span>,
<span class="hljs-attr">organizationName</span>: <span class="hljs-string">'facebook'</span>,
<span class="hljs-attr">projectName</span>: <span class="hljs-string">'docusaurus'</span>,
<span class="hljs-attr">noIndex</span>: <span class="hljs-literal">false</span>,
<span class="hljs-comment">// For no header links in the top nav bar -&gt; headerLinks: [],</span>
<span class="hljs-attr">headerLinks</span>: [
{<span class="hljs-attr">doc</span>: <span class="hljs-string">'doc1'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Docs'</span>},
{<span class="hljs-attr">page</span>: <span class="hljs-string">'help'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Help'</span>},
{<span class="hljs-attr">search</span>: <span class="hljs-literal">true</span>},
{<span class="hljs-attr">blog</span>: <span class="hljs-literal">true</span>},
],
<span class="hljs-attr">headerIcon</span>: <span class="hljs-string">'img/docusaurus.svg'</span>,
<span class="hljs-attr">favicon</span>: <span class="hljs-string">'img/favicon.png'</span>,
<span class="hljs-attr">colors</span>: {
<span class="hljs-attr">primaryColor</span>: <span class="hljs-string">'#2E8555'</span>,
<span class="hljs-attr">secondaryColor</span>: <span class="hljs-string">'#205C3B'</span>,
},
<span class="hljs-attr">editUrl</span>: <span class="hljs-string">'https://github.com/facebook/docusaurus/edit/master/docs/'</span>,
<span class="hljs-comment">// Users variable set above</span>
users,
<span class="hljs-attr">disableHeaderTitle</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">disableTitleTagline</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">separateCss</span>: [<span class="hljs-string">'static/css/non-docusaurus'</span>, <span class="hljs-string">'static/assets/separate-css'</span>],
<span class="hljs-attr">footerIcon</span>: <span class="hljs-string">'img/docusaurus.svg'</span>,
<span class="hljs-attr">translationRecruitingLink</span>: <span class="hljs-string">'https://crowdin.com/project/docusaurus'</span>,
<span class="hljs-attr">algolia</span>: {
<span class="hljs-attr">apiKey</span>: <span class="hljs-string">'0f9f28b9ab9efae89810921a351753b5'</span>,
<span class="hljs-attr">indexName</span>: <span class="hljs-string">'github'</span>,
},
<span class="hljs-attr">gaTrackingId</span>: <span class="hljs-string">'UA-12345678-9'</span>,
<span class="hljs-attr">highlight</span>: {
<span class="hljs-attr">theme</span>: <span class="hljs-string">'default'</span>,
},
<span class="hljs-attr">markdownPlugins</span>: [
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">foo</span>(<span class="hljs-params">md</span>) </span>{
md.renderer.rules.fence_custom.foo = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">
tokens,
idx,
options,
env,
instance,
</span>) </span>{
<span class="hljs-keyword">return</span> <span class="hljs-string">'&lt;div class="foo"&gt;bar&lt;/div&gt;'</span>;
};
},
],
<span class="hljs-attr">scripts</span>: [
<span class="hljs-string">'https://docusaurus.io/slash.js'</span>,
{
<span class="hljs-attr">src</span>:
<span class="hljs-string">'https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js'</span>,
<span class="hljs-attr">async</span>: <span class="hljs-literal">true</span>,
},
],
<span class="hljs-attr">stylesheets</span>: [
<span class="hljs-string">'https://docusaurus.io/style.css'</span>,
{
<span class="hljs-attr">href</span>: <span class="hljs-string">'http://css.link'</span>,
<span class="hljs-attr">type</span>: <span class="hljs-string">'text/css'</span>,
},
],
<span class="hljs-attr">facebookAppId</span>: <span class="hljs-string">'1615782811974223'</span>,
<span class="hljs-attr">facebookComments</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">facebookPixelId</span>: <span class="hljs-string">'352490515235776'</span>,
<span class="hljs-attr">twitter</span>: <span class="hljs-string">'true'</span>,
<span class="hljs-attr">twitterUsername</span>: <span class="hljs-string">'docusaurus'</span>,
<span class="hljs-attr">twitterImage</span>: <span class="hljs-string">'img/docusaurus.png'</span>,
<span class="hljs-attr">ogImage</span>: <span class="hljs-string">'img/docusaurus.png'</span>,
<span class="hljs-attr">cleanUrl</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">scrollToTop</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">scrollToTopOptions</span>: {
<span class="hljs-attr">zIndex</span>: <span class="hljs-number">100</span>,
},
<span class="hljs-comment">// Remove the HTML tags and HTML tags content before generating the slug</span>
<span class="hljs-attr">slugPreprocessor</span>: <span class="hljs-function">(<span class="hljs-params">slugBase</span>) =&gt;</span>
slugBase.replace(<span class="hljs-regexp">/&lt;([^&gt;]+?)([^&gt;]*?)&gt;(.*?)&lt;\/\1&gt;/gi</span>, <span class="hljs-string">''</span>),
};
<span class="hljs-built_in">module</span>.exports = siteConfig;
</code></pre>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/api-pages"><span class="arrow-prev"></span><span>페이지 및 스타일</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#user-showcase">User Showcase</a></li><li><a href="#siteconfig-fields">siteConfig Fields</a><ul class="toc-headings"><li><a href="#mandatory-fields">Mandatory Fields</a></li><li><a href="#optional-fields">Optional Fields</a></li></ul></li><li><a href="#adding-google-fonts">Adding Google Fonts</a></li><li><a href="#example-siteconfigjs-with-many-available-fields">Example siteConfig.js with many available fields</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,433 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>siteConfig.js · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="A large part of the site configuration is done by editing the `siteConfig.js` file."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="siteConfig.js · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="A large part of the site configuration is done by editing the `siteConfig.js` file."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class="siteNavGroupActive"><a href="/docs/ko/installation" target="_self">문서</a></li><li class=""><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/site-config">English</a></li><li><a href="/docs/fr/site-config">Français</a></li><li><a href="/docs/pt-BR/site-config">Português (Brasil)</a></li><li><a href="/docs/ro/site-config">Română</a></li><li><a href="/docs/ru/site-config">Русский</a></li><li><a href="/docs/zh-CN/site-config">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>API</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">시작하기<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/installation">Installation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-preparation">Site Preparation</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/site-creation">Creating your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/publishing">Publishing your site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/docker">Docker</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">가이드<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/adding-blog">Adding a Blog</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/custom-pages">Custom Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/search">Enabling Search</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/navigation">Navigation and Sidebars</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/translation">Translations &amp; Localization</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/versioning">Versioning</a></li></ul></div><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">API<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/commands">CLI Commands</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/doc-markdown">Markdown Features</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/api-pages">Pages and Styles</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/site-config">siteConfig.js</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">siteConfig.js</h1></header><article><div><span><p>A large part of the site configuration is done by editing the <code>siteConfig.js</code> file.</p>
<h2><a class="anchor" aria-hidden="true" id="user-showcase"></a><a href="#user-showcase" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>User Showcase</h2>
<p>The <code>users</code> array is used to store objects for each project/user that you want to show on your site. Currently, this field is used by the example <code>pages/en/index.js</code> and <code>pages/en/users.js</code> files provided. Each user object should have <code>caption</code>, <code>image</code>, <code>infoLink</code>, and <code>pinned</code> fields. The <code>caption</code> is the text showed when someone hovers over the <code>image</code> of that user, and the <code>infoLink</code> is where clicking the image will bring someone. The <code>pinned</code> field determines whether or not it shows up on the <code>index</code> page.</p>
<p>Currently, this <code>users</code> array is used only by the <code>index.js</code> and <code>users.js</code> example files. If you do not wish to have a users page or show users on the <code>index</code> page, you may remove this section.</p>
<h2><a class="anchor" aria-hidden="true" id="siteconfig-fields"></a><a href="#siteconfig-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>siteConfig Fields</h2>
<p>The <code>siteConfig</code> object contains the bulk of the configuration settings for your website.</p>
<h3><a class="anchor" aria-hidden="true" id="mandatory-fields"></a><a href="#mandatory-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Mandatory Fields</h3>
<h4><a class="anchor" aria-hidden="true" id="baseurl-string"></a><a href="#baseurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>baseUrl</code> [string]</h4>
<p>baseUrl for your site. This can also be considered the path after the host. For example, <code>/metro/</code> is the baseUrl of <a href="https://facebook.github.io/metro/">https://facebook.github.io/metro/</a>. For URLs that have no path, the baseUrl should be set to <code>/</code>. This field is related to the <a href="#url-string"><code>url</code> field</a>.</p>
<h4><a class="anchor" aria-hidden="true" id="colors-object"></a><a href="#colors-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>colors</code> [object]</h4>
<p>Color configurations for the site.</p>
<ul>
<li><code>primaryColor</code> is the color used the header navigation bar and sidebars.</li>
<li><code>secondaryColor</code> is the color seen in the second row of the header navigation bar when the site window is narrow (including on mobile).</li>
<li>Custom color configurations can also be added. For example, if user styles are added with colors specified as <code>$myColor</code>, then adding a <code>myColor</code> field to <code>colors</code> will allow you to configure this color.</li>
</ul>
<h4><a class="anchor" aria-hidden="true" id="copyright-string"></a><a href="#copyright-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>copyright</code> [string]</h4>
<p>The copyright string at the footer of the site and within the feed</p>
<h4><a class="anchor" aria-hidden="true" id="favicon-string"></a><a href="#favicon-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>favicon</code> [string]</h4>
<p>URL for site favicon.</p>
<h4><a class="anchor" aria-hidden="true" id="headericon-string"></a><a href="#headericon-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>headerIcon</code> [string]</h4>
<p>URL for icon used in the header navigation bar.</p>
<h4><a class="anchor" aria-hidden="true" id="headerlinks-array"></a><a href="#headerlinks-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>headerLinks</code> [array]</h4>
<p>Links that will be used in the header navigation bar. The <code>label</code> field of each object will be the link text and will also be translated for each language.</p>
<p>Example Usage:</p>
<pre><code class="hljs css language-js">headerLinks: [
<span class="hljs-comment">// Links to document with id doc1 for current language/version</span>
{ <span class="hljs-attr">doc</span>: <span class="hljs-string">"doc1"</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"Getting Started"</span> },
<span class="hljs-comment">// Link to page found at pages/en/help.js or if that does not exist, pages/help.js, for current language</span>
{ <span class="hljs-attr">page</span>: <span class="hljs-string">"help"</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"Help"</span> },
<span class="hljs-comment">// Links to href destination, using target=_blank (external)</span>
{ <span class="hljs-attr">href</span>: <span class="hljs-string">"https://github.com/"</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"GitHub"</span>, <span class="hljs-attr">external</span>: <span class="hljs-literal">true</span> },
<span class="hljs-comment">// Links to blog generated by Docusaurus (${baseUrl}blog)</span>
{ <span class="hljs-attr">blog</span>: <span class="hljs-literal">true</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">"Blog"</span> },
<span class="hljs-comment">// Determines search bar position among links</span>
{ <span class="hljs-attr">search</span>: <span class="hljs-literal">true</span> },
<span class="hljs-comment">// Determines language drop down position among links</span>
{ <span class="hljs-attr">languages</span>: <span class="hljs-literal">true</span> }
],
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="organizationname-string"></a><a href="#organizationname-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>organizationName</code> [string]</h4>
<p>GitHub username of the organization or user hosting this project. This is used by the publishing script to determine where your GitHub pages website will be hosted.</p>
<h4><a class="anchor" aria-hidden="true" id="projectname-string"></a><a href="#projectname-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>projectName</code> [string]</h4>
<p>Project name. This must match your GitHub repository project name (case-sensitive).</p>
<h4><a class="anchor" aria-hidden="true" id="tagline-string"></a><a href="#tagline-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>tagline</code> [string]</h4>
<p>The tagline for your website.</p>
<h4><a class="anchor" aria-hidden="true" id="title-string"></a><a href="#title-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>title</code> [string]</h4>
<p>Title for your website.</p>
<h4><a class="anchor" aria-hidden="true" id="url-string"></a><a href="#url-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>url</code> [string]</h4>
<p>URL for your website. This can also be considered the top-level hostname. For example, <code>https://facebook.github.io</code> is the URL of <a href="https://facebook.github.io/metro/">https://facebook.github.io/metro/</a>, and <code>https://docusaurus.io</code> is the URL for <a href="https://docusaurus.io">https://docusaurus.io</a>. This field is related to the <a href="#baseurl-string"><code>baseUrl</code> field</a>.</p>
<h3><a class="anchor" aria-hidden="true" id="optional-fields"></a><a href="#optional-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Optional Fields</h3>
<h4><a class="anchor" aria-hidden="true" id="algolia-object"></a><a href="#algolia-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>algolia</code> [object]</h4>
<p>Information for Algolia search integration. If this field is excluded, the search bar will not appear in the header. You must specify two values for this field, and one (<code>appId</code>) is optional.</p>
<ul>
<li><code>apiKey</code> - the Algolia provided an API key for your search.</li>
<li><code>indexName</code> - the Algolia provided index name for your search (usually this is the project name)</li>
<li><code>appId</code> - Algolia provides a default scraper for your docs. If you provide your own, you will probably get this id from them.</li>
</ul>
<h4><a class="anchor" aria-hidden="true" id="blogsidebarcount-number"></a><a href="#blogsidebarcount-number" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>blogSidebarCount</code> [number]</h4>
<p>Control the number of blog posts that show up in the sidebar. See the <a href="/docs/ko/adding-blog#changing-how-many-blog-posts-show-on-sidebar">adding a blog docs</a> for more information.</p>
<h4><a class="anchor" aria-hidden="true" id="blogsidebartitle-string"></a><a href="#blogsidebartitle-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>blogSidebarTitle</code> [string]</h4>
<p>Control the title of the blog sidebar. See the <a href="/docs/ko/adding-blog#changing-the-sidebar-title">adding a blog docs</a> for more information.</p>
<h4><a class="anchor" aria-hidden="true" id="cleanurl-boolean"></a><a href="#cleanurl-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>cleanUrl</code> [boolean]</h4>
<p>If <code>true</code>, allow URLs with no <code>HTML</code> extension. For example, a request to URL <a href="https://docusaurus.io/docs/installation">https://docusaurus.io/docs/installation</a> will return the same result as <a href="https://docusaurus.io/docs/installation.html">https://docusaurus.io/docs/installation.html</a>.</p>
<blockquote>
<p>If users intend for this website to be used exclusively offline, this value must be set to <code>false</code>. Otherwise, it will cause the site to route to the parent folder of the linked page.</p>
</blockquote>
<h4><a class="anchor" aria-hidden="true" id="cname-string"></a><a href="#cname-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>cname</code> [string]</h4>
<p>The CNAME for your website. It will go into a <code>CNAME</code> file when your site is built.</p>
<h4><a class="anchor" aria-hidden="true" id="customdocspath-string"></a><a href="#customdocspath-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>customDocsPath</code> [string]</h4>
<p>By default, Docusaurus expects your documentation to be in a directory called <code>docs</code>. This directory is at the same level as the <code>website</code> directory (i.e., not inside the <code>website</code> directory). You can specify a custom path to your documentation with this field.</p>
<pre><code class="hljs css language-js">customDocsPath: <span class="hljs-string">'docs/site'</span>;
</code></pre>
<pre><code class="hljs css language-js">customDocsPath: <span class="hljs-string">'website-docs'</span>;
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="defaultversionshown-string"></a><a href="#defaultversionshown-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>defaultVersionShown</code> [string]</h4>
<p>The default version for the site to be shown. If this is not set, the latest version will be shown.</p>
<h4><a class="anchor" aria-hidden="true" id="deleteddocs-object"></a><a href="#deleteddocs-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>deletedDocs</code> [object]</h4>
<p>Even if you delete the main file for a documentation page and delete it from your sidebar, the page will still be created for every version and for the current version due to <a href="versioning#fallback-functionality">fallback functionality</a>. This can lead to confusion if people find the documentation by searching and it appears to be something relevant to a particular version but actually is not.</p>
<p>To force removal of content beginning with a certain version (including for current/next), add a <code>deletedDocs</code> object to your config, where each key is a version and the value is an array of document IDs that should not be generated for that version and all later versions.</p>
<p>예제:</p>
<pre><code class="hljs css language-js">{
<span class="hljs-attr">deletedDocs</span>: {
<span class="hljs-string">"2.0.0"</span>: [
<span class="hljs-string">"tagging"</span>
]
}
}
</code></pre>
<p>The version keys must match those in <code>versions.json</code>. Assuming the versions list in <code>versions.json</code> is <code>[&quot;3.0.0&quot;, &quot;2.0.0&quot;, &quot;1.1.0&quot;, &quot;1.0.0&quot;]</code>, the <code>docs/1.0.0/tagging</code> and <code>docs/1.1.0/tagging</code> URLs will work but <code>docs/2.0.0/tagging</code>, <code>docs/3.0.0/tagging</code>, and <code>docs/tagging</code> will not. The files and folders for those versions will not be generated during the build.</p>
<h4><a class="anchor" aria-hidden="true" id="docsurl-string"></a><a href="#docsurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>docsUrl</code> [string]</h4>
<p>The base URL for all docs file. Set this field to <code>''</code> to remove the <code>docs</code> prefix of the documentation URL. If unset, it is defaulted to <code>docs</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="disableheadertitle-boolean"></a><a href="#disableheadertitle-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>disableHeaderTitle</code> [boolean]</h4>
<p>An option to disable showing the title in the header next to the header icon. Exclude this field to keep the header as normal, otherwise set to <code>true</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="disabletitletagline-boolean"></a><a href="#disabletitletagline-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>disableTitleTagline</code> [boolean]</h4>
<p>An option to disable showing the tagline in the title of main pages. Exclude this field to keep page titles as <code>Title • Tagline</code>. Set to <code>true</code> to make page titles just <code>Title</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="docssidenavcollapsible-boolean"></a><a href="#docssidenavcollapsible-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>docsSideNavCollapsible</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to be able to expand/collapse the links and subcategories in the sidebar.</p>
<h4><a class="anchor" aria-hidden="true" id="editurl-string"></a><a href="#editurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>editUrl</code> [string]</h4>
<p>URL for editing docs, usage example: <code>editUrl + 'en/doc1.md'</code>. If this field is omitted, there will be no &quot;Edit this Doc&quot; button for each document.</p>
<h4><a class="anchor" aria-hidden="true" id="enableupdateby-boolean"></a><a href="#enableupdateby-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>enableUpdateBy</code> [boolean]</h4>
<p>An option to enable the docs showing the author who last updated the doc. Set to <code>true</code> to show a line at the bottom right corner of each doc page as <code>Last updated by &lt;Author Name&gt;</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="enableupdatetime-boolean"></a><a href="#enableupdatetime-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>enableUpdateTime</code> [boolean]</h4>
<p>An option to enable the docs showing last update time. Set to <code>true</code> to show a line at the bottom right corner of each doc page as <code>Last updated on &lt;date&gt;</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="facebookappid-string"></a><a href="#facebookappid-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>facebookAppId</code> [string]</h4>
<p>If you want Facebook Like/Share buttons in the footer and at the bottom of your blog posts, provide a <a href="https://www.facebook.com/help/audiencenetwork/804209223039296">Facebook application id</a>.</p>
<h4><a class="anchor" aria-hidden="true" id="facebookcomments-boolean"></a><a href="#facebookcomments-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>facebookComments</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to enable Facebook comments at the bottom of your blog post. <code>facebookAppId</code> has to be also set.</p>
<h4><a class="anchor" aria-hidden="true" id="facebookpixelid-string"></a><a href="#facebookpixelid-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>facebookPixelId</code> [string]</h4>
<p><a href="https://www.facebook.com/business/a/facebook-pixel">Facebook Pixel</a> ID to track page views.</p>
<h4><a class="anchor" aria-hidden="true" id="fonts-object"></a><a href="#fonts-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>fonts</code> [object]</h4>
<p>Font-family CSS configuration for the site. If a font family is specified in <code>siteConfig.js</code> as <code>$myFont</code>, then adding a <code>myFont</code> key to an array in <code>fonts</code> will allow you to configure the font. Items appearing earlier in the array will take priority of later elements, so ordering of the fonts matter.</p>
<p>In the below example, we have two sets of font configurations, <code>myFont</code> and <code>myOtherFont</code>. <code>Times New Roman</code> is the preferred font in <code>myFont</code>. <code>-apple-system</code> is the preferred in <code>myOtherFont</code>.</p>
<pre><code class="hljs css language-js">fonts: {
<span class="hljs-attr">myFont</span>: [
<span class="hljs-string">'Times New Roman'</span>,
<span class="hljs-string">'Serif'</span>
],
<span class="hljs-attr">myOtherFont</span>: [
<span class="hljs-string">'-apple-system'</span>,
<span class="hljs-string">'system-ui'</span>
]
},
</code></pre>
<p>The above fonts would be represented in your CSS file(s) as variables <code>$myFont</code> and <code>$myOtherFont</code>.</p>
<pre><code class="hljs css language-css"><span class="hljs-selector-tag">h1</span> {
<span class="hljs-attribute">font-family</span>: $myFont;
}
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="footericon-string"></a><a href="#footericon-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>footerIcon</code> [string]</h4>
<p>URL for a footer icon. Currently used in the <code>core/Footer.js</code> file provided as an example, but it can be removed from that file.</p>
<h4><a class="anchor" aria-hidden="true" id="gatrackingid-string"></a><a href="#gatrackingid-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>gaTrackingId</code> [string]</h4>
<p>Google Analytics tracking ID to track page views.</p>
<h4><a class="anchor" aria-hidden="true" id="gagtag-boolean"></a><a href="#gagtag-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>gaGtag</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to use <a href="https://developers.google.com/gtagjs/">global site tags (gtag.js)</a> for Google analytics instead of <code>analytics.js</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="githubhost-string"></a><a href="#githubhost-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>githubHost</code> [string]</h4>
<p>The hostname of your server. Useful if you are using GitHub Enterprise.</p>
<h4><a class="anchor" aria-hidden="true" id="highlight"></a><a href="#highlight" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>highlight</code></h4>
<p><a href="/docs/ko/doc-markdown">Syntax highlighting</a> options:</p>
<pre><code class="hljs css language-js">{
<span class="hljs-comment">// ...</span>
<span class="hljs-attr">highlight</span>: {
<span class="hljs-comment">// The name of the theme used by Highlight.js when highlighting code.</span>
<span class="hljs-comment">// You can find the list of supported themes here:</span>
<span class="hljs-comment">// https://github.com/isagalaev/highlight.js/tree/master/src/styles</span>
<span class="hljs-attr">theme</span>: <span class="hljs-string">'default'</span>,
<span class="hljs-comment">// The particular version of Highlight.js to be used.</span>
<span class="hljs-attr">version</span>: <span class="hljs-string">'9.12.0'</span>,
<span class="hljs-comment">// Escape valve by passing an instance of Highlight.js to the function specified here, allowing additional languages to be registered for syntax highlighting.</span>
<span class="hljs-attr">hljs</span>: <span class="hljs-function"><span class="hljs-keyword">function</span>(<span class="hljs-params">highlightJsInstance</span>) </span>{
<span class="hljs-comment">// do something here</span>
},
<span class="hljs-comment">// Default language.</span>
<span class="hljs-comment">// It will be used if one is not specified at the top of the code block. You can find the list of supported languages here:</span>
<span class="hljs-comment">// https://github.com/isagalaev/highlight.js/tree/master/src/languages</span>
<span class="hljs-attr">defaultLang</span>: <span class="hljs-string">'javascript'</span>,
<span class="hljs-comment">// custom URL of CSS theme file that you want to use with Highlight.js. If this is provided, the `theme` and `version` fields will be ignored.</span>
<span class="hljs-attr">themeUrl</span>: <span class="hljs-string">'http://foo.bar/custom.css'</span>
},
}
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="manifest-string"></a><a href="#manifest-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>manifest</code> [string]</h4>
<p>Path to your web app manifest (e.g., <code>manifest.json</code>). This will add a <code>&lt;link&gt;</code> tag to <code>&lt;head&gt;</code> with <code>rel</code> as <code>&quot;manifest&quot;</code> and <code>href</code> as the provided path.</p>
<h4><a class="anchor" aria-hidden="true" id="markdownoptions-object"></a><a href="#markdownoptions-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>markdownOptions</code> [object]</h4>
<p>Override default <a href="https://github.com/jonschlinkert/remarkable#options">Remarkable options</a> that will be used to render markdown.</p>
<blockquote>
<p>To manage <a href="https://github.com/jonschlinkert/remarkable#syntax-extensions">syntax extensions</a>, use the <code>markdownPlugins</code> field.</p>
</blockquote>
<h4><a class="anchor" aria-hidden="true" id="markdownplugins-array"></a><a href="#markdownplugins-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>markdownPlugins</code> [array]</h4>
<p>An array of plugins to be loaded by Remarkable, the markdown parser and renderer used by Docusaurus. The plugin will receive a reference to the Remarkable instance, allowing custom parsing and rendering rules to be defined.</p>
<p>For example, if you want to <a href="https://github.com/jonschlinkert/remarkable#syntax-extensions">enable superscript and subscript</a> in your markdown that is rendered by Remarkable to HTML, you would do the following:</p>
<pre><code class="hljs"> markdownPlugins: [
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">foo</span><span class="hljs-params">(md)</span> </span>{
md.inline.ruler.enable([<span class="hljs-string">'sub'</span>, <span class="hljs-string">'sup'</span>]);
},
],
</code></pre>
<h4><a class="anchor" aria-hidden="true" id="noindex-boolean"></a><a href="#noindex-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>noIndex</code> [boolean]</h4>
<p>Boolean. If true, Docusaurus will politely ask crawlers and search engines to avoid indexing your site. This is done with a header tag and so only applies to docs and pages. Will not attempt to hide static resources. This is a best effort request. Malicious crawlers can and will still index your site.</p>
<h4><a class="anchor" aria-hidden="true" id="ogimage-string"></a><a href="#ogimage-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>ogImage</code> [string]</h4>
<p>Local path to an Open Graph image (e.g., <code>img/myImage.png</code>). This image will show up when your site is shared on Facebook and other websites/apps where the Open Graph protocol is supported.</p>
<h4><a class="anchor" aria-hidden="true" id="onpagenav-string"></a><a href="#onpagenav-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>onPageNav</code> [string]</h4>
<p>If you want a visible navigation option for representing topics on the current page. Currently, there is one accepted value for this option:</p>
<ul>
<li><code>separate</code> - The secondary navigation is a separate pane defaulting on the right side of a document. See <a href="http://docusaurus.io/docs/en/translation.html">http://docusaurus.io/docs/en/translation.html</a> for an example.</li>
</ul>
<h4><a class="anchor" aria-hidden="true" id="scripts-array"></a><a href="#scripts-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>scripts</code> [array]</h4>
<p>An array of JavaScript sources to load. The values can be either strings or plain objects of attribute-value maps. Refer to the example below. The script tag will be inserted in the HTML head.</p>
<h4><a class="anchor" aria-hidden="true" id="separatecss-array"></a><a href="#separatecss-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>separateCss</code> [array]</h4>
<p>Directories inside which any <code>CSS</code> files will not be processed and concatenated to Docusaurus' styles. This is to support static <code>HTML</code> pages that may be separate from Docusaurus with completely separate styles.</p>
<h4><a class="anchor" aria-hidden="true" id="scrolltotop-boolean"></a><a href="#scrolltotop-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>scrollToTop</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want to enable the scroll to top button at the bottom of your site.</p>
<h4><a class="anchor" aria-hidden="true" id="scrolltotopoptions-object"></a><a href="#scrolltotopoptions-object" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>scrollToTopOptions</code> [object]</h4>
<p>Optional options configuration for the scroll to top button. You do not need to use this, even if you set <code>scrollToTop</code> to <code>true</code>; it just provides you more configuration control of the button. You can find more options <a href="https://github.com/vfeskov/vanilla-back-to-top/blob/v7.1.14/OPTIONS.md">here</a>. By default, we set the zIndex option to 100.</p>
<h4><a class="anchor" aria-hidden="true" id="slugpreprocessor-function"></a><a href="#slugpreprocessor-function" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>slugPreprocessor</code> [function]</h4>
<p>Define the slug preprocessor function if you want to customize the text used for generating the hash links. Function provides the base string as the first argument and must always return a string.</p>
<h4><a class="anchor" aria-hidden="true" id="stylesheets-array"></a><a href="#stylesheets-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>stylesheets</code> [array]</h4>
<p>An array of CSS sources to load. The values can be either strings or plain objects of attribute-value maps. The link tag will be inserted in the HTML head.</p>
<h4><a class="anchor" aria-hidden="true" id="translationrecruitinglink-string"></a><a href="#translationrecruitinglink-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>translationRecruitingLink</code> [string]</h4>
<p>URL for the <code>Help Translate</code> tab of language selection when languages besides English are enabled. This can be included you are using translations but does not have to be.</p>
<h4><a class="anchor" aria-hidden="true" id="twitter-boolean"></a><a href="#twitter-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>twitter</code> [boolean]</h4>
<p>Set this to <code>true</code> if you want a Twitter social button to appear at the bottom of your blog posts.</p>
<h4><a class="anchor" aria-hidden="true" id="twitterusername-string"></a><a href="#twitterusername-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>twitterUsername</code> [string]</h4>
<p>If you want a Twitter follow button at the bottom of your page, provide a Twitter username to follow. For example: <code>docusaurus</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="twitterimage-string"></a><a href="#twitterimage-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>twitterImage</code> [string]</h4>
<p>Local path to your Twitter card image (e.g., <code>img/myImage.png</code>). This image will show up on the Twitter card when your site is shared on Twitter.</p>
<h4><a class="anchor" aria-hidden="true" id="useenglishurl-string"></a><a href="#useenglishurl-string" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>useEnglishUrl</code> [string]</h4>
<p>If you do not have <a href="/docs/ko/translation">translations</a> enabled (e.g., by having a <code>languages.js</code> file), but still want a link of the form <code>/docs/en/doc.html</code> (with the <code>en</code>), set this to <code>true</code>.</p>
<h4><a class="anchor" aria-hidden="true" id="users-array"></a><a href="#users-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>users</code> [array]</h4>
<p>The <code>users</code> array mentioned earlier.</p>
<h4><a class="anchor" aria-hidden="true" id="useprism-array"></a><a href="#useprism-array" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>usePrism</code> [array]</h4>
<p>An array of languages to use Prism syntax highlighter. Refer to <a href="/docs/ko/doc-markdown#using-prism-as-additional-syntax-highlighter">Using Prism as additional syntax highlighter</a>. Set it to <code>true</code> to use Prism on all languages.</p>
<h4><a class="anchor" aria-hidden="true" id="wrappageshtml-boolean"></a><a href="#wrappageshtml-boolean" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a><code>wrapPagesHTML</code> [boolean]</h4>
<p>Boolean flag to indicate whether <code>HTML</code> files in <code>/pages</code> should be wrapped with Docusaurus site styles, header and footer. This feature is experimental and relies on the files being <code>HTML</code> fragments instead of complete pages. It inserts the contents of your <code>HTML</code> file with no extra processing. Defaults to <code>false</code>.</p>
<p>Users can also add their own custom fields if they wish to provide some data across different files.</p>
<h2><a class="anchor" aria-hidden="true" id="adding-google-fonts"></a><a href="#adding-google-fonts" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Adding Google Fonts</h2>
<!-- TODO: Shift this into a dedicated styling section in future -->
<p>Google Fonts offers faster load times by caching fonts without forcing users to sacrifice privacy. For more information on Google Fonts, see the <a href="https://fonts.google.com/">Google Fonts</a> documentation.</p>
<p>To add Google Fonts to your Docusaurus deployment, add the font path to the <code>siteConfig.js</code> under <code>stylesheets</code>:</p>
<pre><code class="hljs css language-js">stylesheets: [
<span class="hljs-string">'https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,400i,700'</span>,
],
</code></pre>
<h2><a class="anchor" aria-hidden="true" id="example-siteconfigjs-with-many-available-fields"></a><a href="#example-siteconfigjs-with-many-available-fields" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Example siteConfig.js with many available fields</h2>
<pre><code class="hljs css language-js"><span class="hljs-keyword">const</span> users = [
{
<span class="hljs-attr">caption</span>: <span class="hljs-string">'User1'</span>,
<span class="hljs-attr">image</span>: <span class="hljs-string">'/test-site/img/docusaurus.svg'</span>,
<span class="hljs-attr">infoLink</span>: <span class="hljs-string">'https://www.example.com'</span>,
<span class="hljs-attr">pinned</span>: <span class="hljs-literal">true</span>,
},
];
<span class="hljs-keyword">const</span> siteConfig = {
<span class="hljs-attr">title</span>: <span class="hljs-string">'Docusaurus'</span>,
<span class="hljs-attr">tagline</span>: <span class="hljs-string">'Generate websites!'</span>,
<span class="hljs-attr">url</span>: <span class="hljs-string">'https://docusaurus.io'</span>,
<span class="hljs-attr">baseUrl</span>: <span class="hljs-string">'/'</span>,
<span class="hljs-comment">// For github.io type URLS, you would combine the URL and baseUrl like:</span>
<span class="hljs-comment">// url: 'https://reasonml.github.io',</span>
<span class="hljs-comment">// baseUrl: '/reason-react/',</span>
<span class="hljs-attr">defaultVersionShown</span>: <span class="hljs-string">'1.0.0'</span>,
<span class="hljs-attr">organizationName</span>: <span class="hljs-string">'facebook'</span>,
<span class="hljs-attr">projectName</span>: <span class="hljs-string">'docusaurus'</span>,
<span class="hljs-attr">noIndex</span>: <span class="hljs-literal">false</span>,
<span class="hljs-comment">// For no header links in the top nav bar -&gt; headerLinks: [],</span>
<span class="hljs-attr">headerLinks</span>: [
{<span class="hljs-attr">doc</span>: <span class="hljs-string">'doc1'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Docs'</span>},
{<span class="hljs-attr">page</span>: <span class="hljs-string">'help'</span>, <span class="hljs-attr">label</span>: <span class="hljs-string">'Help'</span>},
{<span class="hljs-attr">search</span>: <span class="hljs-literal">true</span>},
{<span class="hljs-attr">blog</span>: <span class="hljs-literal">true</span>},
],
<span class="hljs-attr">headerIcon</span>: <span class="hljs-string">'img/docusaurus.svg'</span>,
<span class="hljs-attr">favicon</span>: <span class="hljs-string">'img/favicon.png'</span>,
<span class="hljs-attr">colors</span>: {
<span class="hljs-attr">primaryColor</span>: <span class="hljs-string">'#2E8555'</span>,
<span class="hljs-attr">secondaryColor</span>: <span class="hljs-string">'#205C3B'</span>,
},
<span class="hljs-attr">editUrl</span>: <span class="hljs-string">'https://github.com/facebook/docusaurus/edit/master/docs/'</span>,
<span class="hljs-comment">// Users variable set above</span>
users,
<span class="hljs-attr">disableHeaderTitle</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">disableTitleTagline</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">separateCss</span>: [<span class="hljs-string">'static/css/non-docusaurus'</span>, <span class="hljs-string">'static/assets/separate-css'</span>],
<span class="hljs-attr">footerIcon</span>: <span class="hljs-string">'img/docusaurus.svg'</span>,
<span class="hljs-attr">translationRecruitingLink</span>: <span class="hljs-string">'https://crowdin.com/project/docusaurus'</span>,
<span class="hljs-attr">algolia</span>: {
<span class="hljs-attr">apiKey</span>: <span class="hljs-string">'0f9f28b9ab9efae89810921a351753b5'</span>,
<span class="hljs-attr">indexName</span>: <span class="hljs-string">'github'</span>,
},
<span class="hljs-attr">gaTrackingId</span>: <span class="hljs-string">'UA-12345678-9'</span>,
<span class="hljs-attr">highlight</span>: {
<span class="hljs-attr">theme</span>: <span class="hljs-string">'default'</span>,
},
<span class="hljs-attr">markdownPlugins</span>: [
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">foo</span>(<span class="hljs-params">md</span>) </span>{
md.renderer.rules.fence_custom.foo = <span class="hljs-function"><span class="hljs-keyword">function</span> (<span class="hljs-params">
tokens,
idx,
options,
env,
instance,
</span>) </span>{
<span class="hljs-keyword">return</span> <span class="hljs-string">'&lt;div class="foo"&gt;bar&lt;/div&gt;'</span>;
};
},
],
<span class="hljs-attr">scripts</span>: [
<span class="hljs-string">'https://docusaurus.io/slash.js'</span>,
{
<span class="hljs-attr">src</span>:
<span class="hljs-string">'https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js'</span>,
<span class="hljs-attr">async</span>: <span class="hljs-literal">true</span>,
},
],
<span class="hljs-attr">stylesheets</span>: [
<span class="hljs-string">'https://docusaurus.io/style.css'</span>,
{
<span class="hljs-attr">href</span>: <span class="hljs-string">'http://css.link'</span>,
<span class="hljs-attr">type</span>: <span class="hljs-string">'text/css'</span>,
},
],
<span class="hljs-attr">facebookAppId</span>: <span class="hljs-string">'1615782811974223'</span>,
<span class="hljs-attr">facebookComments</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">facebookPixelId</span>: <span class="hljs-string">'352490515235776'</span>,
<span class="hljs-attr">twitter</span>: <span class="hljs-string">'true'</span>,
<span class="hljs-attr">twitterUsername</span>: <span class="hljs-string">'docusaurus'</span>,
<span class="hljs-attr">twitterImage</span>: <span class="hljs-string">'img/docusaurus.png'</span>,
<span class="hljs-attr">ogImage</span>: <span class="hljs-string">'img/docusaurus.png'</span>,
<span class="hljs-attr">cleanUrl</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">scrollToTop</span>: <span class="hljs-literal">true</span>,
<span class="hljs-attr">scrollToTopOptions</span>: {
<span class="hljs-attr">zIndex</span>: <span class="hljs-number">100</span>,
},
<span class="hljs-comment">// Remove the HTML tags and HTML tags content before generating the slug</span>
<span class="hljs-attr">slugPreprocessor</span>: <span class="hljs-function">(<span class="hljs-params">slugBase</span>) =&gt;</span>
slugBase.replace(<span class="hljs-regexp">/&lt;([^&gt;]+?)([^&gt;]*?)&gt;(.*?)&lt;\/\1&gt;/gi</span>, <span class="hljs-string">''</span>),
};
<span class="hljs-built_in">module</span>.exports = siteConfig;
</code></pre>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/api-pages"><span class="arrow-prev"></span><span>페이지 및 스타일</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#user-showcase">User Showcase</a></li><li><a href="#siteconfig-fields">siteConfig Fields</a><ul class="toc-headings"><li><a href="#mandatory-fields">Mandatory Fields</a></li><li><a href="#optional-fields">Optional Fields</a></li></ul></li><li><a href="#adding-google-fonts">Adding Google Fonts</a></li><li><a href="#example-siteconfigjs-with-many-available-fields">Example siteConfig.js with many available fields</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,191 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Create Pages · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="이 섹션에서는 두가지 유형인 정규 페이지와 문서화 페이지를 docusaurus에서 생성하는 것에 대해 배웁니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Create Pages · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="이 섹션에서는 두가지 유형인 정규 페이지와 문서화 페이지를 docusaurus에서 생성하는 것에 대해 배웁니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/docs/ko/installation" target="_self">문서</a></li><li class="siteNavGroupActive"><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/tutorial-create-pages">English</a></li><li><a href="/docs/fr/tutorial-create-pages">Français</a></li><li><a href="/docs/pt-BR/tutorial-create-pages">Português (Brasil)</a></li><li><a href="/docs/ro/tutorial-create-pages">Română</a></li><li><a href="/docs/ru/tutorial-create-pages">Русский</a></li><li><a href="/docs/zh-CN/tutorial-create-pages">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>Tutorial</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Tutorial<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-setup">Setting Up</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-create-new-site">Create a New Site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/tutorial-create-pages">Create Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-publish-site">Publish the Site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-version">Add Versions</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Create Pages</h1></header><article><div><span><p>이 섹션에서는 두가지 유형인 정규 페이지와 문서화 페이지를 docusaurus에서 생성하는 것에 대해 배웁니다.</p>
<p><img alt="Docusaurus MacBook" src="/img/undraw_docusaurus_tree.svg" class="docImage" /></p>
<h2><a class="anchor" aria-hidden="true" id="create-a-regular-page"></a><a href="#create-a-regular-page" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Create a Regular Page</h2>
<ol>
<li>In the <code>website/pages/en</code> directory of your repository, save a text file called <code>hello-world.js</code> with the following contents:</li>
</ol>
<pre><code class="hljs"><span class="hljs-keyword">const</span> React = <span class="hljs-built_in">require</span>(<span class="hljs-string">'react'</span>);
<span class="hljs-keyword">const</span> CompLibrary = <span class="hljs-built_in">require</span>(<span class="hljs-string">'../../core/CompLibrary.js'</span>);
<span class="hljs-keyword">const</span> Container = CompLibrary.Container;
<span class="hljs-keyword">const</span> GridBlock = CompLibrary.GridBlock;
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">HelloWorld</span>(<span class="hljs-params">props</span>) </span>{
<span class="hljs-keyword">return</span> (
<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">className</span>=<span class="hljs-string">"docMainWrapper wrapper"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">Container</span> <span class="hljs-attr">className</span>=<span class="hljs-string">"mainContainer documentContainer postContainer"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">h1</span>&gt;</span>Hello World!<span class="hljs-tag">&lt;/<span class="hljs-name">h1</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">p</span>&gt;</span>This is my first page!<span class="hljs-tag">&lt;/<span class="hljs-name">p</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">Container</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></span>
);
}
<span class="hljs-built_in">module</span>.exports = HelloWorld;
</code></pre>
<blockquote>
<p>Use any text editor to make the file, such as <a href="https://code.visualstudio.com/download">Microsoft Visual Studio Code</a> or <a href="https://www.activestate.com/komodo-edit">Komodo Edit</a>.</p>
</blockquote>
<ol start="2">
<li>Go to <a href="http://localhost:3000/hello-world">http://localhost:3000/hello-world</a> and you should be able to see the new page.</li>
<li>Change the text within the <code>&lt;p&gt;...&lt;/p&gt;</code> to &quot;I can write JSX here!&quot; and save the file again. The browser should refresh automatically to reflect the change.</li>
</ol>
<pre><code class="hljs css language-diff"><span class="hljs-deletion">- &lt;p&gt;This is my first page!&lt;/p&gt;</span>
<span class="hljs-addition">+ &lt;p&gt;I can write JSX here!&lt;/p&gt;</span>
</code></pre>
<p>React is being used as a templating engine for rendering static markup. You can leverage on the expressibility of React to build rich web content. Learn more about creating pages <a href="custom-pages">here</a>.</p>
<p><img alt="Docusaurus React" src="/img/undraw_docusaurus_react.svg" class="docImage" /></p>
<h2><a class="anchor" aria-hidden="true" id="create-a-documentation-page"></a><a href="#create-a-documentation-page" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Create a Documentation Page</h2>
<ol>
<li>Create a new file in the <code>docs</code> folder called <code>doc9.md</code>. The <code>docs</code> folder is in the root of your Docusaurus project, same level as the <code>website</code> folder.</li>
<li>Paste the following contents:</li>
</ol>
<pre><code class="hljs">---
id: doc9
<span class="hljs-section">title: This is Doc 9
---</span>
I can write content using [<span class="hljs-string">GitHub-flavored Markdown syntax</span>](<span class="hljs-link">https://github.github.com/gfm/</span>).
<span class="hljs-section">## Markdown Syntax</span>
<span class="hljs-strong">**Bold**</span> <span class="hljs-emphasis">_italic_</span> <span class="hljs-code">`code`</span> [<span class="hljs-string">Links</span>](<span class="hljs-link">#url</span>)
<span class="hljs-quote">&gt; Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse</span>
<span class="hljs-quote">&gt; id sem consectetuer libero luctus adipiscing.</span>
<span class="hljs-bullet">
* </span>Hey
<span class="hljs-bullet">* </span>Ho
<span class="hljs-bullet">* </span>Let's Go
</code></pre>
<ol start="3">
<li>The <code>sidebars.json</code> is where you specify the order of your documentation pages, so open <code>website/sidebars.json</code> and add <code>&quot;doc9&quot;</code> after <code>&quot;doc1&quot;</code>. This ID should be the same one as in the metadata for the Markdown file above, so if you gave a different ID in Step 2, just make sure to use the same ID in the sidebar file.</li>
</ol>
<pre><code class="hljs css language-diff">{
"docs": {
"Docusaurus": [
"doc1",
<span class="hljs-addition">+ "doc9"</span>
],
"First Category": ["doc2"],
"Second Category": ["doc3"]
},
"docs-other": {
"First Category": ["doc4", "doc5"]
}
}
</code></pre>
<ol start="4">
<li>A server restart is needed to pick up sidebar changes, so go to your terminal, kill your dev server (<kbd>Cmd</kbd> + <kbd>C</kbd> or <kbd>Ctrl</kbd> + <kbd>C</kbd>), and run <code>npm start</code> or <code>yarn start</code>.</li>
<li>Navigate to <a href="http://localhost:3000/docs/doc9">http://localhost:3000/docs/doc9</a> to see the new documentation page.</li>
</ol>
<p>You've created your first documentation page on Docusaurus!</p>
<p>Learn more about creating docs pages <a href="navigation">here</a>.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/tutorial-create-new-site"><span class="arrow-prev"></span><span>Create a New Site</span></a><a class="docs-next button" href="/docs/ko/tutorial-publish-site"><span>Publish the Site</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#create-a-regular-page">Create a Regular Page</a></li><li><a href="#create-a-documentation-page">Create a Documentation Page</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,191 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Create Pages · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="이 섹션에서는 두가지 유형인 정규 페이지와 문서화 페이지를 docusaurus에서 생성하는 것에 대해 배웁니다."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Create Pages · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="이 섹션에서는 두가지 유형인 정규 페이지와 문서화 페이지를 docusaurus에서 생성하는 것에 대해 배웁니다."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/docs/ko/installation" target="_self">문서</a></li><li class="siteNavGroupActive"><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/tutorial-create-pages">English</a></li><li><a href="/docs/fr/tutorial-create-pages">Français</a></li><li><a href="/docs/pt-BR/tutorial-create-pages">Português (Brasil)</a></li><li><a href="/docs/ro/tutorial-create-pages">Română</a></li><li><a href="/docs/ru/tutorial-create-pages">Русский</a></li><li><a href="/docs/zh-CN/tutorial-create-pages">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>Tutorial</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Tutorial<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-setup">Setting Up</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-create-new-site">Create a New Site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/tutorial-create-pages">Create Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-publish-site">Publish the Site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-version">Add Versions</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Create Pages</h1></header><article><div><span><p>이 섹션에서는 두가지 유형인 정규 페이지와 문서화 페이지를 docusaurus에서 생성하는 것에 대해 배웁니다.</p>
<p><img alt="Docusaurus MacBook" src="/img/undraw_docusaurus_tree.svg" class="docImage" /></p>
<h2><a class="anchor" aria-hidden="true" id="create-a-regular-page"></a><a href="#create-a-regular-page" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Create a Regular Page</h2>
<ol>
<li>In the <code>website/pages/en</code> directory of your repository, save a text file called <code>hello-world.js</code> with the following contents:</li>
</ol>
<pre><code class="hljs"><span class="hljs-keyword">const</span> React = <span class="hljs-built_in">require</span>(<span class="hljs-string">'react'</span>);
<span class="hljs-keyword">const</span> CompLibrary = <span class="hljs-built_in">require</span>(<span class="hljs-string">'../../core/CompLibrary.js'</span>);
<span class="hljs-keyword">const</span> Container = CompLibrary.Container;
<span class="hljs-keyword">const</span> GridBlock = CompLibrary.GridBlock;
<span class="hljs-function"><span class="hljs-keyword">function</span> <span class="hljs-title">HelloWorld</span>(<span class="hljs-params">props</span>) </span>{
<span class="hljs-keyword">return</span> (
<span class="xml"><span class="hljs-tag">&lt;<span class="hljs-name">div</span> <span class="hljs-attr">className</span>=<span class="hljs-string">"docMainWrapper wrapper"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">Container</span> <span class="hljs-attr">className</span>=<span class="hljs-string">"mainContainer documentContainer postContainer"</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">h1</span>&gt;</span>Hello World!<span class="hljs-tag">&lt;/<span class="hljs-name">h1</span>&gt;</span>
<span class="hljs-tag">&lt;<span class="hljs-name">p</span>&gt;</span>This is my first page!<span class="hljs-tag">&lt;/<span class="hljs-name">p</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">Container</span>&gt;</span>
<span class="hljs-tag">&lt;/<span class="hljs-name">div</span>&gt;</span></span>
);
}
<span class="hljs-built_in">module</span>.exports = HelloWorld;
</code></pre>
<blockquote>
<p>Use any text editor to make the file, such as <a href="https://code.visualstudio.com/download">Microsoft Visual Studio Code</a> or <a href="https://www.activestate.com/komodo-edit">Komodo Edit</a>.</p>
</blockquote>
<ol start="2">
<li>Go to <a href="http://localhost:3000/hello-world">http://localhost:3000/hello-world</a> and you should be able to see the new page.</li>
<li>Change the text within the <code>&lt;p&gt;...&lt;/p&gt;</code> to &quot;I can write JSX here!&quot; and save the file again. The browser should refresh automatically to reflect the change.</li>
</ol>
<pre><code class="hljs css language-diff"><span class="hljs-deletion">- &lt;p&gt;This is my first page!&lt;/p&gt;</span>
<span class="hljs-addition">+ &lt;p&gt;I can write JSX here!&lt;/p&gt;</span>
</code></pre>
<p>React is being used as a templating engine for rendering static markup. You can leverage on the expressibility of React to build rich web content. Learn more about creating pages <a href="custom-pages">here</a>.</p>
<p><img alt="Docusaurus React" src="/img/undraw_docusaurus_react.svg" class="docImage" /></p>
<h2><a class="anchor" aria-hidden="true" id="create-a-documentation-page"></a><a href="#create-a-documentation-page" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Create a Documentation Page</h2>
<ol>
<li>Create a new file in the <code>docs</code> folder called <code>doc9.md</code>. The <code>docs</code> folder is in the root of your Docusaurus project, same level as the <code>website</code> folder.</li>
<li>Paste the following contents:</li>
</ol>
<pre><code class="hljs">---
id: doc9
<span class="hljs-section">title: This is Doc 9
---</span>
I can write content using [<span class="hljs-string">GitHub-flavored Markdown syntax</span>](<span class="hljs-link">https://github.github.com/gfm/</span>).
<span class="hljs-section">## Markdown Syntax</span>
<span class="hljs-strong">**Bold**</span> <span class="hljs-emphasis">_italic_</span> <span class="hljs-code">`code`</span> [<span class="hljs-string">Links</span>](<span class="hljs-link">#url</span>)
<span class="hljs-quote">&gt; Donec sit amet nisl. Aliquam semper ipsum sit amet velit. Suspendisse</span>
<span class="hljs-quote">&gt; id sem consectetuer libero luctus adipiscing.</span>
<span class="hljs-bullet">
* </span>Hey
<span class="hljs-bullet">* </span>Ho
<span class="hljs-bullet">* </span>Let's Go
</code></pre>
<ol start="3">
<li>The <code>sidebars.json</code> is where you specify the order of your documentation pages, so open <code>website/sidebars.json</code> and add <code>&quot;doc9&quot;</code> after <code>&quot;doc1&quot;</code>. This ID should be the same one as in the metadata for the Markdown file above, so if you gave a different ID in Step 2, just make sure to use the same ID in the sidebar file.</li>
</ol>
<pre><code class="hljs css language-diff">{
"docs": {
"Docusaurus": [
"doc1",
<span class="hljs-addition">+ "doc9"</span>
],
"First Category": ["doc2"],
"Second Category": ["doc3"]
},
"docs-other": {
"First Category": ["doc4", "doc5"]
}
}
</code></pre>
<ol start="4">
<li>A server restart is needed to pick up sidebar changes, so go to your terminal, kill your dev server (<kbd>Cmd</kbd> + <kbd>C</kbd> or <kbd>Ctrl</kbd> + <kbd>C</kbd>), and run <code>npm start</code> or <code>yarn start</code>.</li>
<li>Navigate to <a href="http://localhost:3000/docs/doc9">http://localhost:3000/docs/doc9</a> to see the new documentation page.</li>
</ol>
<p>You've created your first documentation page on Docusaurus!</p>
<p>Learn more about creating docs pages <a href="navigation">here</a>.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/tutorial-create-new-site"><span class="arrow-prev"></span><span>Create a New Site</span></a><a class="docs-next button" href="/docs/ko/tutorial-publish-site"><span>Publish the Site</span><span class="arrow-next"></span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#create-a-regular-page">Create a Regular Page</a></li><li><a href="#create-a-documentation-page">Create a Documentation Page</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,147 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Add Versions · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="With an example site deployed, we can now try out one of the killer features of Docusaurus &amp;mdash; versioned documentation. Versioned documentation helps to show relevant documentation for the current version of a tool and also hide unreleased documentation from users, reducing confusion. Documentation for older versions is also preserved and accessible to users of older versions of a tool even as the latest documentation changes."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Add Versions · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="With an example site deployed, we can now try out one of the killer features of Docusaurus &amp;mdash; versioned documentation. Versioned documentation helps to show relevant documentation for the current version of a tool and also hide unreleased documentation from users, reducing confusion. Documentation for older versions is also preserved and accessible to users of older versions of a tool even as the latest documentation changes."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/docs/ko/installation" target="_self">문서</a></li><li class="siteNavGroupActive"><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/tutorial-version">English</a></li><li><a href="/docs/fr/tutorial-version">Français</a></li><li><a href="/docs/pt-BR/tutorial-version">Português (Brasil)</a></li><li><a href="/docs/ro/tutorial-version">Română</a></li><li><a href="/docs/ru/tutorial-version">Русский</a></li><li><a href="/docs/zh-CN/tutorial-version">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>Tutorial</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Tutorial<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-setup">Setting Up</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-create-new-site">Create a New Site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-create-pages">Create Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-publish-site">Publish the Site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/tutorial-version">Add Versions</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Add Versions</h1></header><article><div><span><p>With an example site deployed, we can now try out one of the killer features of Docusaurus — versioned documentation. Versioned documentation helps to show relevant documentation for the current version of a tool and also hide unreleased documentation from users, reducing confusion. Documentation for older versions is also preserved and accessible to users of older versions of a tool even as the latest documentation changes.</p>
<p><img alt="Docusaurus process" src="/img/undraw_docusaurus_process.svg" class="docImage" /></p>
<h2><a class="anchor" aria-hidden="true" id="releasing-a-version"></a><a href="#releasing-a-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Releasing a Version</h2>
<p>Assume you are happy with the current state of the documentation and want to freeze it as the v1.0.0 docs. First you <code>cd</code> to the <code>website</code> directory and run the following command.</p>
<pre><code class="hljs css language-sh">npm run examples versions
</code></pre>
<p>That command generates a <code>versions.json</code> file, which will be used to list down all the versions of docs in the project.</p>
<p>Next, you run a command with the version you want to create, like <code>1.0.0</code>.</p>
<pre><code class="hljs css language-sh">npm run version 1.0.0
</code></pre>
<p>That command preserves a copy of all documents currently in the <code>docs</code> directory and makes them available as documentation for version 1.0.0. The <code>docs</code> directory is copied to the <code>website/versioned_docs/version-1.0.0</code> directory.</p>
<h3><a class="anchor" aria-hidden="true" id="current-version"></a><a href="#current-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Current Version</h3>
<p>Type <code>npm start</code> and you will see the version beside the title. Version 1.0.0, the number of your current version, shows at the URL <a href="http://localhost:3000/docusaurus-tutorial/docs/doc1">http://localhost:3000/docusaurus-tutorial/docs/doc1</a>.</p>
<p>Let's test out how versioning actually works. Open <code>docs/doc1.md</code> and change the first line of the body:</p>
<pre><code class="hljs css language-diff"><span class="hljs-comment">---</span>
id: doc1
title: Latin-ish
sidebar_label: Example Page
<span class="hljs-comment">---</span>
<span class="hljs-deletion">- Check the [documentation](https://docusaurus.io) for how to use Docusaurus.</span>
<span class="hljs-addition">+ This is the latest version of the docs.</span>
## Lorem
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies.
</code></pre>
<p>If you go to <a href="http://localhost:3000/docusaurus-tutorial/docs/doc1">http://localhost:3000/docusaurus-tutorial/docs/doc1</a> in your browser, realize that it's still showing the line before the change. That's because the version you're looking at is the 1.0.0 version, which has already been frozen in time. The document you changed is part of the next version.</p>
<h3><a class="anchor" aria-hidden="true" id="next-version"></a><a href="#next-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Next Version</h3>
<p>The latest version of the documents is viewed by adding <code>next</code> to the URL: <a href="http://localhost:3000/docusaurus-tutorial/docs/next/doc1">http://localhost:3000/docusaurus-tutorial/docs/next/doc1</a>. Now you can see the line change to &quot;This is the latest version of the docs.&quot; Note that the version beside the title changes to &quot;next&quot; when you open that URL.</p>
<p>Click the version to open the versions page, which was created at <a href="http://localhost:3000/docusaurus-tutorial/versions">http://localhost:3000/docusaurus-tutorial/versions</a> with a list of the documentation versions. See that both <code>1.0.0</code> and <code>master</code> are listed there and they link to the respective versions of the documentation.</p>
<p>The master documents in the <code>docs</code> directory became version next when the <code>website/versioned_docs/version-1.0.0</code> directory was made for version 1.0.0.</p>
<h3><a class="anchor" aria-hidden="true" id="past-versions"></a><a href="#past-versions" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Past Versions</h3>
<p>Assume the documentation changed and needs an update. You can release another version, like <code>1.0.1</code>.</p>
<pre><code class="hljs css language-sh">npm run version 1.0.1
</code></pre>
<p>Version 1.0.0 remains available as a past version. You can view it by adding <code>1.0.0</code> to the URL, <a href="http://localhost:3000/docusaurus-tutorial/docs/1.0.0/doc1">http://localhost:3000/docusaurus-tutorial/docs/1.0.0/doc1</a>. Also, a link to version 1.0.0 appears on the versions page.</p>
<p>Go ahead and <a href="https://docusaurus.io/docs/en/next/tutorial-publish-site">publish</a> your versioned site with the <code>publish-gh-pages</code> script!</p>
<h2><a class="anchor" aria-hidden="true" id="wrap-up"></a><a href="#wrap-up" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Wrap Up</h2>
<p>That's all folks! In this short tutorial, you have experienced how easy it is to create a documentation website from scratch and make versions for them. There are many more things you can do with Docusaurus, such as adding a blog, search and translations. Check out the <a href="https://docusaurus.io/docs/en/next/versioning">Guides</a> section for more.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/tutorial-publish-site"><span class="arrow-prev"></span><span>Publish the Site</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#releasing-a-version">Releasing a Version</a><ul class="toc-headings"><li><a href="#current-version">Current Version</a></li><li><a href="#next-version">Next Version</a></li><li><a href="#past-versions">Past Versions</a></li></ul></li><li><a href="#wrap-up">Wrap Up</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>

View file

@ -0,0 +1,147 @@
<!DOCTYPE html><html lang="ko"><head><meta charSet="utf-8"/><meta http-equiv="X-UA-Compatible" content="IE=edge"/><title>Add Versions · Docusaurus</title><meta name="viewport" content="width=device-width, initial-scale=1.0"/><meta name="generator" content="Docusaurus"/><meta name="description" content="With an example site deployed, we can now try out one of the killer features of Docusaurus &amp;mdash; versioned documentation. Versioned documentation helps to show relevant documentation for the current version of a tool and also hide unreleased documentation from users, reducing confusion. Documentation for older versions is also preserved and accessible to users of older versions of a tool even as the latest documentation changes."/><meta name="docsearch:version" content="1.14.7"/><meta name="docsearch:language" content="ko"/><meta property="og:title" content="Add Versions · Docusaurus"/><meta property="og:type" content="website"/><meta property="og:url" content="https://docusaurus.io/"/><meta property="og:description" content="With an example site deployed, we can now try out one of the killer features of Docusaurus &amp;mdash; versioned documentation. Versioned documentation helps to show relevant documentation for the current version of a tool and also hide unreleased documentation from users, reducing confusion. Documentation for older versions is also preserved and accessible to users of older versions of a tool even as the latest documentation changes."/><meta property="og:image" content="https://docusaurus.io/img/docusaurus.png"/><meta name="twitter:card" content="summary"/><meta name="twitter:image" content="https://docusaurus.io/img/docusaurus.png"/><link rel="shortcut icon" href="/img/docusaurus.ico"/><link rel="stylesheet" href="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.css"/><link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/9.12.0/styles/atom-one-dark.min.css"/><link rel="alternate" type="application/atom+xml" href="https://docusaurus.io/blog/atom.xml" title="Docusaurus Blog ATOM Feed"/><link rel="alternate" type="application/rss+xml" href="https://docusaurus.io/blog/feed.xml" title="Docusaurus Blog RSS Feed"/><script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
ga('create', 'UA-44373548-31', 'auto');
ga('send', 'pageview');
</script><script type="text/javascript" src="https://buttons.github.io/buttons.js"></script><script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/clipboard.js/2.0.0/clipboard.min.js"></script><script type="text/javascript" src="/js/code-blocks-buttons.js"></script><script src="https://unpkg.com/vanilla-back-to-top@7.1.14/dist/vanilla-back-to-top.min.js"></script><script>
document.addEventListener('DOMContentLoaded', function() {
addBackToTop(
{"zIndex":100}
)
});
</script><script src="/js/scrollSpy.js"></script><link rel="stylesheet" href="/css/prism.css"/><link rel="stylesheet" href="/css/main.css"/><script src="/js/codetabs.js"></script></head><body class="sideNavVisible separateOnPageNav"><div class="fixedHeaderContainer"><div class="headerWrapper wrapper"><header><a href="/ko"><img class="logo" src="/img/docusaurus.svg" alt="Docusaurus"/><h2 class="headerTitleWithLogo">Docusaurus</h2></a><a href="/ko/versions"><h3>1.14.7</h3></a><div class="navigationWrapper navigationSlider"><nav class="slidingNav"><ul class="nav-site nav-site-internal"><li class=""><a href="/docs/ko/installation" target="_self">문서</a></li><li class="siteNavGroupActive"><a href="/docs/ko/tutorial-setup" target="_self">Tutorial</a></li><li class=""><a href="/ko/users" target="_self">사용자</a></li><li class=""><a href="/blog/" target="_self">블로그</a></li><li class=""><a href="https://github.com/facebook/docusaurus" target="_blank">GitHub</a></li><span><li><a id="languages-menu" href="#"><img class="languages-icon" src="/img/language.svg" alt="Languages icon"/>한국어</a><div id="languages-dropdown" class="hide"><ul id="languages-dropdown-items"><li><a href="/docs/en/tutorial-version">English</a></li><li><a href="/docs/fr/tutorial-version">Français</a></li><li><a href="/docs/pt-BR/tutorial-version">Português (Brasil)</a></li><li><a href="/docs/ro/tutorial-version">Română</a></li><li><a href="/docs/ru/tutorial-version">Русский</a></li><li><a href="/docs/zh-CN/tutorial-version">简体中文</a></li><li><a href="https://crowdin.com/project/docusaurus" target="_blank" rel="noreferrer noopener">번역을 도와주세요</a></li></ul></div></li><script>
const languagesMenuItem = document.getElementById("languages-menu");
const languagesDropDown = document.getElementById("languages-dropdown");
languagesMenuItem.addEventListener("click", function(event) {
event.preventDefault();
if (languagesDropDown.className == "hide") {
languagesDropDown.className = "visible";
} else {
languagesDropDown.className = "hide";
}
});
</script></span><li class="navSearchWrapper reactNavSearchWrapper"><input type="text" id="search_input_react" placeholder="Search" title="Search"/></li></ul></nav></div></header></div></div><div class="navPusher"><div class="docMainWrapper wrapper"><div class="docsNavContainer" id="docsNav"><nav class="toc"><div class="toggleNav"><section class="navWrapper wrapper"><div class="navBreadcrumb wrapper"><div class="navToggle" id="navToggler"><div class="hamburger-menu"><div class="line1"></div><div class="line2"></div><div class="line3"></div></div></div><h2><i></i><span>Tutorial</span></h2><div class="tocToggler" id="tocToggler"><i class="icon-toc"></i></div></div><div class="navGroups"><div class="navGroup"><h3 class="navGroupCategoryTitle collapsible">Tutorial<span class="arrow"><svg width="24" height="24" viewBox="0 0 24 24"><path fill="#565656" d="M7.41 15.41L12 10.83l4.59 4.58L18 14l-6-6-6 6z"></path><path d="M0 0h24v24H0z" fill="none"></path></svg></span></h3><ul class="hide"><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-setup">Setting Up</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-create-new-site">Create a New Site</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-create-pages">Create Pages</a></li><li class="navListItem"><a class="navItem" href="/docs/ko/tutorial-publish-site">Publish the Site</a></li><li class="navListItem navListItemActive"><a class="navItem" href="/docs/ko/tutorial-version">Add Versions</a></li></ul></div></div></section></div><script>
var coll = document.getElementsByClassName('collapsible');
var checkActiveCategory = true;
for (var i = 0; i < coll.length; i++) {
var links = coll[i].nextElementSibling.getElementsByTagName('*');
if (checkActiveCategory){
for (var j = 0; j < links.length; j++) {
if (links[j].classList.contains('navListItemActive')){
coll[i].nextElementSibling.classList.toggle('hide');
coll[i].childNodes[1].classList.toggle('rotate');
checkActiveCategory = false;
break;
}
}
}
coll[i].addEventListener('click', function() {
var arrow = this.childNodes[1];
arrow.classList.toggle('rotate');
var content = this.nextElementSibling;
content.classList.toggle('hide');
});
}
document.addEventListener('DOMContentLoaded', function() {
createToggler('#navToggler', '#docsNav', 'docsSliderActive');
createToggler('#tocToggler', 'body', 'tocActive');
var headings = document.querySelector('.toc-headings');
headings && headings.addEventListener('click', function(event) {
var el = event.target;
while(el !== headings){
if (el.tagName === 'A') {
document.body.classList.remove('tocActive');
break;
} else{
el = el.parentNode;
}
}
}, false);
function createToggler(togglerSelector, targetSelector, className) {
var toggler = document.querySelector(togglerSelector);
var target = document.querySelector(targetSelector);
if (!toggler) {
return;
}
toggler.onclick = function(event) {
event.preventDefault();
target.classList.toggle(className);
};
}
});
</script></nav></div><div class="container mainContainer docsContainer"><div class="wrapper"><div class="post"><header class="postHeader"><a class="edit-page-link button" href="https://crowdin.com/project/docusaurus/ko" target="_blank" rel="noreferrer noopener">Translate</a><h1 id="__docusaurus" class="postHeaderTitle">Add Versions</h1></header><article><div><span><p>With an example site deployed, we can now try out one of the killer features of Docusaurus — versioned documentation. Versioned documentation helps to show relevant documentation for the current version of a tool and also hide unreleased documentation from users, reducing confusion. Documentation for older versions is also preserved and accessible to users of older versions of a tool even as the latest documentation changes.</p>
<p><img alt="Docusaurus process" src="/img/undraw_docusaurus_process.svg" class="docImage" /></p>
<h2><a class="anchor" aria-hidden="true" id="releasing-a-version"></a><a href="#releasing-a-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Releasing a Version</h2>
<p>Assume you are happy with the current state of the documentation and want to freeze it as the v1.0.0 docs. First you <code>cd</code> to the <code>website</code> directory and run the following command.</p>
<pre><code class="hljs css language-sh">npm run examples versions
</code></pre>
<p>That command generates a <code>versions.json</code> file, which will be used to list down all the versions of docs in the project.</p>
<p>Next, you run a command with the version you want to create, like <code>1.0.0</code>.</p>
<pre><code class="hljs css language-sh">npm run version 1.0.0
</code></pre>
<p>That command preserves a copy of all documents currently in the <code>docs</code> directory and makes them available as documentation for version 1.0.0. The <code>docs</code> directory is copied to the <code>website/versioned_docs/version-1.0.0</code> directory.</p>
<h3><a class="anchor" aria-hidden="true" id="current-version"></a><a href="#current-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Current Version</h3>
<p>Type <code>npm start</code> and you will see the version beside the title. Version 1.0.0, the number of your current version, shows at the URL <a href="http://localhost:3000/docusaurus-tutorial/docs/doc1">http://localhost:3000/docusaurus-tutorial/docs/doc1</a>.</p>
<p>Let's test out how versioning actually works. Open <code>docs/doc1.md</code> and change the first line of the body:</p>
<pre><code class="hljs css language-diff"><span class="hljs-comment">---</span>
id: doc1
title: Latin-ish
sidebar_label: Example Page
<span class="hljs-comment">---</span>
<span class="hljs-deletion">- Check the [documentation](https://docusaurus.io) for how to use Docusaurus.</span>
<span class="hljs-addition">+ This is the latest version of the docs.</span>
## Lorem
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Pellentesque elementum dignissim ultricies.
</code></pre>
<p>If you go to <a href="http://localhost:3000/docusaurus-tutorial/docs/doc1">http://localhost:3000/docusaurus-tutorial/docs/doc1</a> in your browser, realize that it's still showing the line before the change. That's because the version you're looking at is the 1.0.0 version, which has already been frozen in time. The document you changed is part of the next version.</p>
<h3><a class="anchor" aria-hidden="true" id="next-version"></a><a href="#next-version" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Next Version</h3>
<p>The latest version of the documents is viewed by adding <code>next</code> to the URL: <a href="http://localhost:3000/docusaurus-tutorial/docs/next/doc1">http://localhost:3000/docusaurus-tutorial/docs/next/doc1</a>. Now you can see the line change to &quot;This is the latest version of the docs.&quot; Note that the version beside the title changes to &quot;next&quot; when you open that URL.</p>
<p>Click the version to open the versions page, which was created at <a href="http://localhost:3000/docusaurus-tutorial/versions">http://localhost:3000/docusaurus-tutorial/versions</a> with a list of the documentation versions. See that both <code>1.0.0</code> and <code>master</code> are listed there and they link to the respective versions of the documentation.</p>
<p>The master documents in the <code>docs</code> directory became version next when the <code>website/versioned_docs/version-1.0.0</code> directory was made for version 1.0.0.</p>
<h3><a class="anchor" aria-hidden="true" id="past-versions"></a><a href="#past-versions" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Past Versions</h3>
<p>Assume the documentation changed and needs an update. You can release another version, like <code>1.0.1</code>.</p>
<pre><code class="hljs css language-sh">npm run version 1.0.1
</code></pre>
<p>Version 1.0.0 remains available as a past version. You can view it by adding <code>1.0.0</code> to the URL, <a href="http://localhost:3000/docusaurus-tutorial/docs/1.0.0/doc1">http://localhost:3000/docusaurus-tutorial/docs/1.0.0/doc1</a>. Also, a link to version 1.0.0 appears on the versions page.</p>
<p>Go ahead and <a href="https://docusaurus.io/docs/en/next/tutorial-publish-site">publish</a> your versioned site with the <code>publish-gh-pages</code> script!</p>
<h2><a class="anchor" aria-hidden="true" id="wrap-up"></a><a href="#wrap-up" aria-hidden="true" class="hash-link"><svg class="hash-link-icon" aria-hidden="true" height="16" version="1.1" viewBox="0 0 16 16" width="16"><path fill-rule="evenodd" d="M4 9h1v1H4c-1.5 0-3-1.69-3-3.5S2.55 3 4 3h4c1.45 0 3 1.69 3 3.5 0 1.41-.91 2.72-2 3.25V8.59c.58-.45 1-1.27 1-2.09C10 5.22 8.98 4 8 4H4c-.98 0-2 1.22-2 2.5S3 9 4 9zm9-3h-1v1h1c1 0 2 1.22 2 2.5S13.98 12 13 12H9c-.98 0-2-1.22-2-2.5 0-.83.42-1.64 1-2.09V6.25c-1.09.53-2 1.84-2 3.25C6 11.31 7.55 13 9 13h4c1.45 0 3-1.69 3-3.5S14.5 6 13 6z"></path></svg></a>Wrap Up</h2>
<p>That's all folks! In this short tutorial, you have experienced how easy it is to create a documentation website from scratch and make versions for them. There are many more things you can do with Docusaurus, such as adding a blog, search and translations. Check out the <a href="https://docusaurus.io/docs/en/next/versioning">Guides</a> section for more.</p>
</span></div></article></div><div class="docs-prevnext"><a class="docs-prev button" href="/docs/ko/tutorial-publish-site"><span class="arrow-prev"></span><span>Publish the Site</span></a></div></div></div><nav class="onPageNav"><ul class="toc-headings"><li><a href="#releasing-a-version">Releasing a Version</a><ul class="toc-headings"><li><a href="#current-version">Current Version</a></li><li><a href="#next-version">Next Version</a></li><li><a href="#past-versions">Past Versions</a></li></ul></li><li><a href="#wrap-up">Wrap Up</a></li></ul></nav></div><footer class="nav-footer" id="footer"><section class="sitemap"><a href="/" class="nav-home"><img src="/img/docusaurus_monochrome.svg" alt="Docusaurus" width="66" height="58"/></a><div class="footerSection"><h5>Docs</h5><a href="
/docs/ko/installation">Getting Started</a><a href="
/docs/ko/versioning">Versioning</a><a href="
/docs/ko/translation">Localization</a><a href="
/docs/ko/search">Adding Search</a></div><div class="footerSection"><h5>Community</h5><a href="/ko/help">Help</a><a href="/ko/users">User Showcase</a><a href="/ko/about-slash">About</a></div><div class="footerSection"><h5>Legal</h5><a href="https://opensource.facebook.com/legal/privacy/" target="_blank" rel="noreferrer noopener">Privacy</a><a href="https://opensource.facebook.com/legal/terms/" target="_blank" rel="noreferrer noopener">Terms</a><a href="https://opensource.facebook.com/legal/data-policy/" target="_blank" rel="noreferrer noopener">Data Policy</a><a href="https://opensource.facebook.com/legal/cookie-policy/" target="_blank" rel="noreferrer noopener">Cookie Policy</a></div><div class="footerSection"><h5>Social</h5><div class="social"><a class="github-button" href="https://github.com/facebook/docusaurus" data-count-href="https://github.com/facebook/docusaurus/stargazers" data-show-count="true" data-count-aria-label="# stargazers on GitHub" aria-label="Star this project on GitHub">docusaurus</a></div><div class="social"><a href="https://twitter.com/docusaurus" class="twitter-follow-button">Follow @docusaurus</a></div><div class="social"><div class="fb-like" data-href="https://docusaurus.io" data-colorscheme="dark" data-layout="standard" data-share="true" data-width="225" data-show-faces="false"></div></div></div></section><a href="https://opensource.facebook.com/" target="_blank" rel="noreferrer noopener" class="fbOpenSource"><img src="/img/oss_logo.png" alt="Facebook Open Source" width="170" height="45"/></a><section class="copyright"><span>Copyright © 2021 Facebook Inc.</span> Landing images by <a href="https://undraw.co/">unDraw</a>.</section></footer></div><script type="text/javascript" src="https://cdn.jsdelivr.net/docsearch.js/1/docsearch.min.js"></script><script>window.fbAsyncInit = function() {FB.init({appId:'199138890728411',xfbml:true,version:'v2.7'});};(function(d, s, id){var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) {return;}js = d.createElement(s); js.id = id;js.src = '//connect.facebook.net/en_US/sdk.js';fjs.parentNode.insertBefore(js, fjs);}(document, 'script','facebook-jssdk'));
</script><script>window.twttr=(function(d,s, id){var js,fjs=d.getElementsByTagName(s)[0],t=window.twttr||{};if(d.getElementById(id))return t;js=d.createElement(s);js.id=id;js.src='https://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js, fjs);t._e = [];t.ready = function(f) {t._e.push(f);};return t;}(document, 'script', 'twitter-wjs'));</script><script>
document.addEventListener('keyup', function(e) {
if (e.target !== document.body) {
return;
}
// keyCode for '/' (slash)
if (e.keyCode === 191) {
const search = document.getElementById('search_input_react');
search && search.focus();
}
});
</script><script>
var search = docsearch({
apiKey: '3eb9507824b8be89e7a199ecaa1a9d2c',
indexName: 'docusaurus',
inputSelector: '#search_input_react',
algoliaOptions: {"facetFilters":["language:ko","version:1.14.7"]}
});
</script></body></html>