ここ最近のAWS勉強会の目玉となっているAWSカルタ

これの練習用アプリを作りました。

Lonely AWS Karuta

Lonely AWS Karuta

ソースはコチラに。

使い方は簡単です。

左上にある「札を読む」ボタンをポチポチクリックして表示される説明文に合ったAWSサービスを選んでやるだけです。

(結果がwindow.alertで表示されるのがイケてないかも・・・?)

 

説明文だけじゃサービスわからないよ!て場合も安心です。

下の余白のあたりを反転させてみてください。

Lonely AWS Karuta-1

ね?簡単でしょう。

 

中身はjQuery + Javascriptです。ホスティングはもちろんAmazonS3で。

フォントにGoogle Web Fontsを使っているのですが、Chromeで開いた場合のみ反映されないようです。

コンソールを見ると下記のようなワーニングが出ていました。

[blocked] The page at https://s3-ap-northeast-1.amazonaws.com/lonelyawskaruta/karuta.html ran insecure content from
http://fonts.googleapis.com/css?family=Fjalla+One.

しばらくハマってたのですが、ここを見て解決。

アドレスバーの横に表示される「盾マーク」をクリックして、httpのURLにあるファイルの読み込みを許可してやることでフォントが反映されます。

 

これで前回のJAWS-UG名古屋で登場し、一部の参加者を恐怖に陥れた上級者向け ”サービス名の書いてない絵札”にも対応できますね!

AWSカルタで一旗揚げてやろうという方は是非これで特訓に励んでみてください!

初心者の方もこれで練習して、本番で無双したらいいんじゃないでしょうか!

(僕もこれ作ったおかげでだいぶ覚えられたなぁ)