技術書典のサークル情報をエクセルで一覧表示する

※　技術書典８で、内部の仕様が変更されているため、本記事の方法でサークルリストをエクセル取り込みすることはできません。

早いもので技術書典７の開催まであと1か月を切り、先日、一般参加者さん向けのWebサイトが公開されました。

[技術書典７](https://techbookfest.org/event/tbf07)

今回の参加サークルは６００以上ということで、事前のサークルチェックも少し大変です。

そこで今回は、技術書典７に参加されるサークルさんの一覧をエクセルにエクスポートすることで、サークルチェックにかける時間をぐぐっと短縮してみたいと思います。

# 今回作るもの
こんな感じの、全サークルさんの情報が１枚のシートにまとまったエクセルデータです。
![無題.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/376ba2be-c8e8-424f-09de-b771f0a880b0.png)

* 各サークルさんの情報行には、技術書典公式サイトのサークル詳細ページＵＲＬも付与されており、そこから、サークルの出版物などの詳細も確認することができるようになっています。

* 購入したい書籍が見つかったら、技術書典公式サイトのサークル詳細ページから、「このサークルをチェックリストに追加する（要ユーザ登録）」ボタンを押しておくと、サークル主さんに感謝されるかもしれません（頒布数の予測が何となく立てられるようになり、何部刷ればよいのかの判断材料になるため）
![01.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/00c4d937-5b7b-41b9-5978-ae4ff2cae41f.png)


なお、この記事では、MicrosoftExcel 2019年8月27日時点のOffice365版を使用しています。バージョンなどの差異により、画面の見た目などに多少差異が出る可能性があります。

# やりかた

技術書典のサイトは、サークル一覧情報やサークル詳細情報の取得に、内部でAPI発行し、クライアント側でレンダリングしているようです。

<img width="781" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/239e22f1-9cb4-0c41-1049-48a174fecbe8.png">

サークル一覧を取得するためのAPIをたたいた結果として返されるjsonはこんな感じです。
<img width="775" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/48b9a8e8-e99a-aadd-e2e7-3a2aa464c7a6.png">

このjsonデータをエクセルのデータとして取り込み、見やすいように調整します。

* エクセルを起動し、画面上部のリボンから[データ]タブを選びます。
* 次に、リボンの中の[データの取得と変換]カテゴリー内の[Webから]を選んでください。
<img width="943" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/f4bab1a0-f6ee-90db-e7f2-26e1798d2708.png">

* URLを入力するダイアログが表示されるので、 https://techbookfest.org/api/circle?eventID=tbf07&visibility=site&limit=700 と入力します（今回の参加サークル数は６００～７００件とのことだったので、limit=700としています）
<img width="525" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/be4472cf-660a-f578-e11b-d98d540b8ea0.png">

* 接続確認のダイアログが表示されるので、接続ボタンを押してしばらく（１分ほど）待ちます。
* 1分ほど待つと、以下のような画面が表示されるので、List の部分からショートカットメニュー（右クリックメニューのこと）を表示させ、[テーブルへの変換]を選択します。
<img width="834" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/d7a8115f-b49c-f837-3ca6-34708f87f25b.png">

* 表示内容が変わったら、Valueラベルの右側のアイコンボタンを押します。ショートカットメニューが表示されるので、[新しい行に展開する]を選びます。
<img width="834" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/2df3f4fd-f310-0efd-7b6d-cea65e75c792.png">

* 再び表示内容が変わり、Recordと書かれた行がたくさん出てきます。もう一度Valueラベルの右横のアイコンボタンを押すと、エクセルに取り込みたいカラムを選択するためのリストが表示されます。
<img width="834" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/3c64771f-25e4-78cf-a8b4-9027d77d62ca.png">
* エクセルに取り込みたい列を選択します。[id] [name] [webSiteUrl] [genre] [genreFreeFormat] [circleCutImage] [space] あたりがおすすめです。

* Value.circleCutImage、Value.spaceは、もう一段階展開する必要があります。前の手順で行ったのと同じ要領で再度展開してください。
<img width="834" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/2d03f33c-8cf1-f33c-eb9a-b687666dc079.png">

* リボンから[閉じて読み込む]を選ぶと、表示された内容がエクセルシートに反映されます。
<img width="834" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/6c77b264-1ae7-39b6-e3bd-0b1d710e51cb.png">

* Value.id の列の右側に１列追加し、セルの値として =HYPERLINK("https://techbookfest.org/event/tbf07/" & B2)　と設定すれば、エクセルシートから技術書典７のサークル詳細ページに直接飛べるので非常に便利です。当日の領布物などは、公式サイトのサークル詳細ページから確認することができます。
* 情報を最新のものに更新するには、リボン内の [外部のテーブルデータ] カテゴリーの [更新] ボタンを押すとサークル情報が最新のものに更新されます。
<img width="943" alt="01.png" src="https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/9f62ae22-88c9-4b44-b791-ff61ed78166c.png">


サークルカット画像のURLをシートに取り込んだうえで以下のようなマクロを用意＆実行すれば
サークルカット画像もエクセルに取り込むことができます。
（マクロ中のコメントにも書きましたが　コード内の (r, 10) となっている個所は、サークルカット画像URLが書かれた列番号(１オーダー）に置き換えてください。
また、サークルカット画像の表示サイズは適当に縮小したほうが良いかと思います。
元のサイズは635*903です。
アスペクト比固定で縮小とかはされないので、Width:= とHeight:= それぞれ比率を保ったまま縮小してください。
なお、マクロを実行しても行の高さは変更されません。そのままだと画像が重なってしまうと思うので、行を全選択後、いい感じの高さに調整してください。


```VisualBasic
Sub Macro()
    On Error Resume Next
    Dim r As Long
    Dim picture
    r = 2
    ' (r, 10) の 10 の部分はサークルカット画像URLが書かれた列番号(１オーダー）に置き換える
    While Cells(r, 1) <> ""
        Set picture = ActiveSheet.Shapes.AddPicture( _
            Filename:=Cells(r, 10), _
            LinkToFile:=False, SaveWithDocument:=True, _
            Left:=Cells(r, 10).Left, Top:=Cells(r, 10).Top, _
            Width:=64, Height:=90)
        r = r + 1
    Wend
End Sub
```
![サークルカット対応.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/78337/4f9a7d41-6bbe-283e-f20f-114956131a5b.png)


# 最後に
技術書典７には、僕もサークルとして参加いたします。

「個人開発のいろは」と題しまして、今年初めに個人で立ち上げたウェブサービス「ソロ旅ねっと」の開発を振り返りつつ、
個人開発のアイデアだしからモチベーションをしっかり維持して完成させるコツみたいな内容の本を出します。
もしご興味ありましたら、のらぬこはうす（い３２Ｃ）にお越しいただければ嬉しいです。