【LINE Bot挑戦】子連れランチ難民を救いたい

## やってみよう

どうも、子育て真っ最中のワーママエンジニアです。
今回も、覚えたての知識を使ってプロトタイピング挑戦！
使ってみるのはLINE Bot（初挑戦～！）

**やってみよう～**

## 子連れでもOKのお店を探したい
子連れランチ・・そこには、高いハードルがある・・
「ベビーカーが入る広さのお店かな・・」
「キッズメニューあるかな・・」

良い感じのお店が見つかっても、子連れOKのお店でなければ、
世の親達は諦め、またイチからか探すのである・・

なんて、日々自分の悩みをどうにかしたいと思ったので、
手軽に子連れOKなお店を探してくれるLINE Botを作ってみることにしました！

まず始めるにあたっては以下を参考にしました。

https://qiita.com/n0bisuke/items/ceaa09ef8898bee8369d

## 使用したもの
* Node-RED（FlowForge）
* LINEmessagingAPI
* グルメサーチAPI(<a href="http://webservice.recruit.co.jp/"><img src="http://webservice.recruit.co.jp/banner/hotpepper-s.gif" alt="ホットペッパー Webサービス" width="135" height="17" border="0" title="ホットペッパー Webサービス"></a>)



## 完成したものがこちら
<blockquote class="twitter-tweet"><p lang="ja" dir="ltr">子連れ🆗のお店を検索できるLINE botを作ってみた！<br>初心者が作った簡単なものだけど、ちゃんと動いて感動〜🥺<br>これで、子連れランチ難民が救われるといいな〜<a href="https://twitter.com/hashtag/protoout?src=hash&amp;ref_src=twsrc%5Etfw">#protoout</a><a href="https://twitter.com/hashtag/LINEbot?src=hash&amp;ref_src=twsrc%5Etfw">#LINEbot</a><a href="https://twitter.com/hashtag/%E5%AD%90%E8%82%B2%E3%81%A6?src=hash&amp;ref_src=twsrc%5Etfw">#子育て</a><a href="https://twitter.com/hashtag/%E5%AD%90%E9%80%A3%E3%82%8C%E3%83%A9%E3%83%B3%E3%83%81?src=hash&amp;ref_src=twsrc%5Etfw">#子連れランチ</a> <a href="https://t.co/a2MPRi1eIO">pic.twitter.com/a2MPRi1eIO</a></p>&mdash; そってぃ (@sotan115) <a href="https://twitter.com/sotan115/status/1718562137759772968?ref_src=twsrc%5Etfw">October 29, 2023</a></blockquote> <script async src="https://platform.twitter.com/widgets.js" charset="utf-8"></script>

**わぁ、動いてる～～（感動）**

## 中身について

フローはこんな感じです
![スクリーンショット 2023-10-29 155507.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3569867/14e7e40e-1922-c890-fe66-f60383d6772d.png)


JSON形式のコードは以下
```json
[{"id":"790d607f541e14c2","type":"tab","label":"子連れランチ","disabled":false,"info":"","env":[]},{"id":"183e6087438e6d31","type":"ReplyMessage","z":"790d607f541e14c2","name":"","replyMessage":"","credentials":{"channelSecret":"","channelAccessToken":""},"x":740,"y":140,"wires":[]},{"id":"be76a4f277acadfd","type":"Webhook","z":"790d607f541e14c2","name":"","url":"/webhook","x":100,"y":60,"wires":[["20bf2584a00a38a2"]]},{"id":"20bf2584a00a38a2","type":"switch","z":"790d607f541e14c2","name":"","property":"payload","propertyType":"msg","rules":[{"t":"cont","v":"和食","vt":"str"},{"t":"cont","v":"洋食","vt":"str"},{"t":"cont","v":"カフェ","vt":"str"},{"t":"else"}],"checkall":"true","repair":false,"outputs":4,"x":130,"y":160,"wires":[["268b11a96f7cc8ec"],["6450c75c87be5c10"],["c4cdc4730f9d9b83"],["c266bc5b63acafef"]]},{"id":"c266bc5b63acafef","type":"template","z":"790d607f541e14c2","name":"","field":"payload","fieldType":"msg","format":"handlebars","syntax":"mustache","template":"カテゴリを選択してね！","output":"str","x":420,"y":280,"wires":[["183e6087438e6d31"]]},{"id":"6450c75c87be5c10","type":"http request","z":"790d607f541e14c2","name":"","method":"GET","ret":"obj","paytoqs":"ignore","url":"http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key=取得したAPIキー&large_area=Z011&keyword=%E3%81%8A%E5%AD%90%E6%A7%98&genre=G005&count=20&order=4&format=json","tls":"","persist":false,"proxy":"","insecureHTTPParser":false,"authType":"","senderr":false,"headers":[],"x":330,"y":140,"wires":[["ef437d24eed1fda9"]]},{"id":"c4cdc4730f9d9b83","type":"http request","z":"790d607f541e14c2","name":"","method":"GET","ret":"obj","paytoqs":"ignore","url":"http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key=取得したAPIキー&large_area=Z011&keyword=%E3%81%8A%E5%AD%90%E6%A7%98&genre=G014&count=20&order=4&format=json","tls":"","persist":false,"proxy":"","insecureHTTPParser":false,"authType":"","senderr":false,"headers":[],"x":330,"y":180,"wires":[["1acc97f2c6207530"]]},{"id":"a3607268bc8fe7cd","type":"function","z":"790d607f541e14c2","name":"和食","func":"msg.num = Math.floor(Math.random() * msg.payload.results.shop.length);\nmsg.payload = 'おすすめはこちら！ \\n' + msg.payload.results.shop[msg.num].name + ' \\n アクセス' + msg.payload.results.shop[msg.num].access + ' \\n ★' + msg.payload.results.shop[msg.num].child + ' \\n ' + msg.payload.results.shop[msg.num].urls.pc;\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":510,"y":80,"wires":[["183e6087438e6d31"]]},{"id":"268b11a96f7cc8ec","type":"http request","z":"790d607f541e14c2","name":"","method":"GET","ret":"obj","paytoqs":"ignore","url":"http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key=取得したAPIキー&large_area=Z011&keyword=%E3%81%8A%E5%AD%90%E6%A7%98&genre=G004&count=10&order=4&format=json","tls":"","persist":false,"proxy":"","insecureHTTPParser":false,"authType":"","senderr":false,"headers":[],"x":330,"y":80,"wires":[["a3607268bc8fe7cd"]]},{"id":"ef437d24eed1fda9","type":"function","z":"790d607f541e14c2","name":"洋食","func":"msg.num = Math.floor(Math.random() * msg.payload.results.shop.length);\nmsg.payload = 'おすすめはこちら！ \\n' + msg.payload.results.shop[msg.num].name + ' \\n アクセス' + msg.payload.results.shop[msg.num].access + ' \\n ★' + msg.payload.results.shop[msg.num].child + ' \\n ' + msg.payload.results.shop[msg.num].urls.pc;\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":510,"y":140,"wires":[["183e6087438e6d31"]]},{"id":"1acc97f2c6207530","type":"function","z":"790d607f541e14c2","name":"カフェ","func":"msg.num = Math.floor(Math.random() * msg.payload.results.shop.length);\nmsg.payload = 'おすすめはこちら！ \\n' + msg.payload.results.shop[msg.num].name + ' \\n アクセス' + msg.payload.results.shop[msg.num].access + ' \\n ★' + msg.payload.results.shop[msg.num].child + ' \\n ' + msg.payload.results.shop[msg.num].urls.pc;\nreturn msg;","outputs":1,"noerr":0,"initialize":"","finalize":"","libs":[],"x":510,"y":180,"wires":[["183e6087438e6d31"]]}]
```



### ①ジャンルを分ける
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3569867/86757d7c-bf0f-fd0d-aa28-ba245ce1b5c5.png)

まずジャンルは、**「和食」「洋食」「カフェ」** に分けました。（要素を含めばOK）

送るメッセージはリッチメニューで作成
![image.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3569867/096db15b-88de-344d-cb20-b9bc404f740e.png)


https://developers.line.biz/ja/docs/messaging-api/rich-menus-overview/#choosing-tool-for-creating-rich-menus

※ちなみに、どのジャンルも含まないものを送ると、以下のように出る仕様
![中華.jpg](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3569867/29ec24ca-4395-549c-f44f-f23449f18436.jpeg)


### ②API　リクエスト
![スクリーンショット 2023-10-29 180028.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3569867/6a55490e-ca52-34f2-a0d2-871f1b928200.png)
```
http://webservice.recruit.co.jp/hotpepper/gourmet/v1/?key=取得したAPIキー&large_area=Z011&keyword=%E3%81%8A%E5%AD%90%E6%A7%98&genre=G004&count=10&order=4&format=json
```
使ったのはリクルートが提供している「グルメサーチAPI」
検索クエリについては「[こちら](https://webservice.recruit.co.jp/doc/hotpepper/reference.html)」を参照しました。`（使うには、利用登録して、APIキー取得することが必要です！）`
ここで上記の３つのジャンルを指定しています。
また、キーワードには **「お子様」** を指定。これで、お子様OKの店を抽出しています。


### ③結果を返信する
![スクリーンショット 2023-10-29 180049.png](https://qiita-image-store.s3.ap-northeast-1.amazonaws.com/0/3569867/b4ef2491-4f89-db55-3d71-895594badffa.png)
```javascript
msg.num = Math.floor(Math.random() * msg.payload.results.shop.length);
msg.payload = 'おすすめはこちら！ \n' + msg.payload.results.shop[msg.num].name + ' \n アクセス' + msg.payload.results.shop[msg.num].access + ' \n ★' + msg.payload.results.shop[msg.num].child + ' \n ' + msg.payload.results.shop[msg.num].urls.pc;
return msg;
```

取得したデータから、ランダムで１件返してくれるようにしてみました。
自分のこだわりですが、お店側が書いている、「お子様連れOK」の情報を出してくれるようにしてみました。
お店によってはここに、「お子様メニュー」とか「お子様椅子あり」とか書いてあったので、分かると助かる～！と思って。


## 作ってみて
まず、ちゃんと動いたことに感動・・！
初心者でもある程度のものが作れるので、LINE Bot楽しい～
（もちろん、簡単には出来ず、たくさん苦労はしました。）

今回はエリアを広く「東京」で指定してまったのですが、
本当は、こちらからエリアを指定して検索したり、
詳細な条件で絞ったりしてみたかったのですが、今回は断念・・
でも楽しかったのでもっと色々作ってみたくなりました！

最後まで読んでいただきありがとうございました！

## 参考記事
* [「決められない」人のためのラーメン激推しBot](https://qiita.com/KendoLab/items/8558095ddcd7e415f20c)
[]()