python製のMkDocsを使ってMarkdownでドキュメントを作成する
![python製のMkDocsを使ってMarkdownでドキュメントを作成する](https://mebee.info/wp-content/uploads/2020/08/image-7-890x500.png)
Markdownで記述した内容を静的サイトとして生成してくれるMkDocsを利用するまでの手順を記述してます。使い方もとてもシンプルで非常に便利です。
環境
- OS windows10 pro 64bit
- python 3.6.8
- pip 20.1.1
MkDocsインストール
pipを使ってインストールします。
pip install mkdocs
バージョンを確認してみます。
mkdocs -V
<出力結果>
mkdocs, version 1.1.2 from c:\users\usertest\scoop\apps\python\3.8.4\lib\site-packages\mkdocs (Python 3.8)
MkDocsプロジェクト作成
プロジェクトを作成してみます。
mkdocs new test-mkdocs
MkDocsを起動みます。
cd test-mkdocs
mkdocs serve
ブラウザから http://localhost:8000にアクセスすると以下の画面が表示されます。
![](https://mebee.info/wp-content/uploads/2020/08/image-7-1024x496.png)
MkDocs使い方
TOPページを編集してみます。「docs」フォルダ配下にある「index.md」を編集すると、TOPページに反映されます。
ホットリロードなので、編集がすぐに反映されます。
![](https://mebee.info/wp-content/uploads/2020/08/image-9-1024x493.png)
次にページを追加します。「docs」フォルダ配下に「test.md」という名前で以下の内容で追加します。
## コードを表示
- コードを表示します
```
require 'redcarpet'
markdown = Redcarpet.new("Hello World!")
puts markdown.to_html
```
ブラウザから http://localhost:8000/test にアクセスするとページが追加されていることが確認できます。
![](https://mebee.info/wp-content/uploads/2020/08/image-10-1024x466.png)
ページを設定する場合は、プロジェクト配下にある「mkdocs.yml」を以下のように編集します。
site_name: My Docs
pages:
- Page1: index.md
- Page2: test2.md
- Page3: test.md
![](https://mebee.info/wp-content/uploads/2020/08/image-11-1024x417.png)
HTML生成
buildコマンドを実行すると静的ファイルが「site」フォルダ内に生成されます。
mkdocs build
![](https://mebee.info/wp-content/uploads/2020/08/image-12.png)
-
前の記事
React.js UIコンポーネント「semantic-ui-react」をインストールして使用する手順 2020.08.03
-
次の記事
jekyllのテンプレートを利用する手順 2020.08.03
コメントを書く