どうもきらぷかです。
1週間でWebサービスを作るイベント『web1week』、今回のお題は「バケーション」
バケーションといったら、夏。。
夏といったら、カレー。。
カレーといったら、ココイチ!!
今回はココイチのトッピングをガチャで決めるアプリを作りました!
(サイゼリヤ1000円ガチャのCoCo壱番屋バージョンです(´ω`))
■「CoCoガチャ」
https://coco-gacha.memory-lovers.com/
内容はシンプルでトッピングの種類と予算を設定してガチャを回すだけ
ガチャを回すと、ベース/ライス/辛さ/甘さ/トッピングを選んでくれます。
お、SSRヒレカツですね(´ω`)
野菜はいらないって人は肉類だけにチェックすればOK
「みんなのトッピング」という今までの結果も見れるようになってます。
ガチャを回すと結果は保存されるので、
奇跡的に良いトッピングがあれば、これを見て注文することも(´ω`)
今回の目標は、最近開発しているSSSAPIを使ってサクッと作ること。ドックフーディングを兼ねてます。
いつも使ってる3点セット(Nuxt/Buefy/Firebase)+SSSAPI
NuxtのSPAだけど、個別のページのタイトルとかも変えたいので、
NetlifyのPreRenderingを使ってる。
SSSAPIは、GoogleスプレッドシートのAPI化サービスで、
こんなスプレッドシートの内容から
こんな感じのJSONを返してくれるAPIを作成してくれます。
[
{
"id": 1,
"name": "ポークカレー",
"price": 514,
"rarity": "C"
},
{
"id": 2,
"name": "甘口ポークカレー",
"price": 514,
"rarity": "R"
},
// 略...
]
SSSAPIのおかげで、初期データ突っ込んだり、後でフィールド増やすときの手間を省けたので、だいぶ楽にできた気がする(´ω`)
みたいな流れで使ってました。
今まではJSONでやってたけど、JSONの編集って面倒。。(´ω`)
中身のスプレッドシートはこちらで確認できます。
・スプレッドシート(CoCoガチャ)
ぜひぜひ〜
SSSAPIもβ版公開中なので、興味ある方は事前登録フォームよりご連絡ください!
どちらのフィードバックもお待ちしてます(´ω`)
Twitter: @kira_puka