ジャンルを選択し、それに応じておすすめの店を表示

[Yuki-TU]

概要

食のジャンルをプルダウン表示して、それに応じて周辺のお店を表示させる。

詳細

• 食のジャンルを表示

  • material uiを用いてプルダウン表示させる。
  • ジャンル取得APIでジャンル名からジャンルコードを取得すること。 https://webservice.recruit.co.jp/doc/hotpepper/reference.html 今回はあらかじめ、イタリアン、中華、ラーメン、お好み焼き、洋食のジャンルコードを取得しておき、その値をして、お店一覧を表示させる。

• お店表示

  • お店一覧表示に関してはmaterial uiを使用する。 以下のURLを参考にする。 https://material-ui.com/components/cards/#complex-interaction
  • お店取得APIより経度、緯度、ジャンルコードを用いて周辺のお店情報を取得する。 https://webservice.recruit.co.jp/doc/hotpepper/reference.html

仕様一覧

1. ジャンルをプルダウンより選ぶ。
2. 検索ボタンを押すと、お店の情報を表示する。
3. 結果表示中に他のジャンルを選択すると、選択ジャンルに応じてお店の情報を表示する。
4. 位置情報が取得できなければ、原因に応じてエラーを表示させる。
5. お店の情報が取得できなければ、エラー表示させる。
6. 各お店はカードで表示しており、カードには折り畳み機能を有しており、折りたたみボタンを押すと、該当カードだけ開閉が行われる。

イメージ画像