概要

ここ最近の業務で、GitHubをほとんど触ったことがない人に対して、Git-flowを体験してもらうためのワークショップを開催しました。
そのワークショップでは、以下のような体験ができるようにしました。

ブランチ作成 → コミット（プッシュ） → Pull Request → レビュー → マージの一連の流れを実践できる
GitHub Pagesで公開されているため、マージされた内容がすぐにウェブページで確認できる
Markdownに馴染みがない人は、Markdownの練習になる

また、運営側として必要以上の時間がかからないよう、コンフリクトが極力発生しないような構成にしました。

作成したサイト

トップページおよびサイドバーに、各ページへのリンクが用意されている
ユーザー名（hoge、fuga、piyo）に対して、ページが1つ用意されている
各ユーザーは、自分のページだけ編集する（Markdown記法 + docsifyの記法で書ける）

ソースコード

作り方

docsifyのQuick startに従って、docs/以下にコンテンツを作成するところまでやります
Windows環境で、「このシステムではスクリプトの実行が無効になっているため…」と表示された場合は、実行ポリシーを付与するよう、ターミナルに以下を入力することで解決できます。
Set-ExecutionPolicy -ExecutionPolicy RemoteSigned -Scope Process
リポジトリのルートにpackage.jsonを配置し、npm installします
package.json
```
{
    "dependencies": {
        "docsify-cli": "^4.4.4"
    }
}
```

docs/index.htmlを編集し、サイドバーを表示させるようなつくりにします

docs/index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
    <meta name="description" content="Description">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
    <link rel="stylesheet" href="//cdn.jsdelivr.net/npm/docsify@4/lib/themes/vue.css">
</head>
<body>
    <div id="app"></div>
    <script>
        window.$docsify = {
        name: 'プロフィール',
        repo: '',
        loadSidebar: '_sidebar.md',
        homepage: '/README.md',
        subMaxLevel: 1
    }
    </script>
<!-- Docsify v4 -->
<script src="//cdn.jsdelivr.net/npm/docsify@4"></script>
<!-- emoji -->
<script src="//cdn.jsdelivr.net/npm/docsify/lib/plugins/emoji.min.js"></script>
</body>
</html>

docs/_sidebar.mdを追加し、Markdown記法でリンクを貼ります
docs/_sidebar.md
```
- [hoge](profile/hoge.md)
- [fuga](profile/fuga.md)
- [piyo](profile/piyo.md)
```
docs/profile/***.mdをユーザーの数だけ作成します
docs/profile/hoge.md
```
# hoge

### 名前

### 所属チーム

### 経験のある言語
```
GitHubのリポジトリから、[Settings]-[Pages]で、/docsに対して公開するよう設定します

GitHub Enterpriseアカウントでない場合、ページはpublicに公開されるので注意が必要です

おわりに

今回紹介したサイトは、誰でも15分ほどで作成できると思います。
実践的なGitHub勉強会を開催しようと思っている方に、何かしらの参考になれば幸いです。

参考