実際に完成したWebサービス
BingMaps for Begenners
サイトURL： https://venezia-works.com/bing/
一度サイトを見てから記事を読んだほうが面白いかもしれません。
【 なぜ？ Map APIを研究しようと思ったのか 】
MapAPIを授業で使ったいた
私は、エンジニアでもありますが、学校でプログラミングも教える立場でもあります（デザインは超苦手です）。
JavaScriptを使った授業ではMAP APIを利用する授業もあります。ビジネスアプリケーションなどでは、Mapを使ったものもありますし、ポケモンGOやUberのように位置情報・MAPを使ったアプリケーションも出ていますので、使えたほうが良い技術の1つと考えています。また、APIは自分で考えたオブジェクト・関数の作り方と違うことが多いでしょう。他のAPIを使用することも考え慣れるためにも良い教材だと考えています。
※実際には他のAPI等も使っています。
問題発生
そこで最近問題が起きました。授業中にMAP用のKEYを取得する際に、「クレジット登録」の画面がでるようになりました。
これは以前から言われてましたが、まさか授業のその日に起こるとは・・・。ということで、学生にクレジットカード登録は強要できませんので、困ったという経緯からです。
なぜBingMaps？
GoogleMap,YahooMapと比較して、クレジット登録が必要ない（これはYahooMapも一緒）こと、GoogleMapの使い方に比較的似てるという点がBingMapsを選択した理由です。
【 膨大なインプットの1週間 】
とりあえず、情報が少ないBingMapsなので、公式ドキュメントから眺めて、そしてコードを打ちながら進めました。
動作するようなモックアップを作りながら進めることが大事です。英語のドキュメントですし、本当に「その動作するの？」っていうのも目で確認できます。少しずつ進みながらMAP独自の関数の使い方など多くを学ぶことができました。
１週間くらいでドキュメントに記載してる全てを試すことができました。
実際にやってみて、自分の身の回りで使いそうな機能や、使わなそうな部分が見えました。全てをやると、時間が足りないので、機能の取捨選択はおこないました。（実際に作ったサンプルもそれに当たります）
※今後は全てを載せたいとは考えています。
-※初学者の人に：写経に近いですね。ただし、少し変更を加えたりしながら、「どの変数がどの役割か？」「この関数を違う場所で実行すると？」などなど、試しながら進むのが理解につながるので大事かと思います。
【 圧倒的OUTPUTの１週間 】
インプットでなんとなく解った気になってるので、そのままでは作れません。
そのため、せっかく作ったモックアップを「サンプルファイル」として使えるようにして、
BingMapsのサンプルコードを表示だけでは面白くないので、Web上で変更やプレビューもできるように開発。
見た目もある程度ちゃんとしたいので、「Bootstrap」を使い見栄えも良い感じに。
アイコン表示は「fontawesome」を使用しました。
もちろんPWA対応もしました。コンテンツ的にPC向けなのでCacheAPIを上手く利用してます
途中で、日本語で作ってましたが、全世界へ向けて英語に切り替えました。世界中の方が母数が多いですから。
緑をメインカラーにしてるのは、”Bingのカラーが緑”だからです。カラーピッカーを使い同色にしました。
また、初心者のために、HOMEページにKEY取得マニュアルのリンクを用意、「Getting Started！」も追加。
追加機能：MapAPIがわからなくてもWebサイトにIframeで埋め込めるツールも作成
４年位まえに作ろうと思ってたのを完成したツールです。
BingMaps Maker
サイトURL： https://venezia-works.com/bing/builder.html
【作成してみて 】
理解して使えるようになる、制作力を上げるには、最もOUTPUTが重要だと再認識です。
作ってる最中は自分が世の中でTOP１０に入るBingMapsを使う技術者に違いないと勘違いするほどです（その時は）
米MicrosoftBingTeamの人からも評価してもらえました。 個人的には、
そのときに作りたいと思ったものを思うがまま形にする
これが最高の学びにつながった形となりました。
最後の方は妥協できなくて、色やアイコン等に時間がかかりすぎた割には、、、納得はしてませんが、
今後、世界で使われうようになるようであれば、または変更すればもっと使われるニーズが見えれば変えて行きます。
2週間でのインプット・アウトプットでしたが、とても楽しくスキルアップできたと思います。
みなさんもエンジョイ・プログラミング！！！
だらだらと３０分位でこの記事を書かせていただきました。
是非、個人で作ってみたい人の少しでも参考になればと思います。
おまえやるな！って思ったら「いいね」いただければと思います。(^^)
以上
