今回、現在地周辺のジムとサウナを同時に表示できるマップサイト作成しました。
作った理由としては、自分自身がジムで筋トレしたり銭湯やサウナに言って疲れを癒したりするのが好きで作成しました。 このアプリの長所としては3つあります。
1.従来のグーグルマップより表示数が多い →Google Map API を使用してジムとサウナで限定しているため
2.いちいち検索かける手間が減る。 →自分自身、かなりのめんどくさがりなので、正直この機能は気に入っています。
3.PWAにしているので普通のMAPサイトと比べて操作性が良い →最初はNetlifyで公開していて操作していましたが、とても操作性が悪かったので、PWAにして操作性を向上させため、操作性はかなりいいです。 実際に自分はジムや銭湯を探すときはこのサイトを利用することが増えました。
PWAと簡単に言うとスマホアプリのようなウェブサイトで従来のウェブサイトより、以下のようなメリットがあります。
● Android・iOSのどちらでもOK
● ストアに申請する必要がない
● ホーム画面にアイコンを設置できる
● 表示速度が優れている
つぎの画像のようにアプリとしても利用できます。Safariならホーム画面に追加とすると、アプリのように利用できます。
詳しいPWAの説明は以下のリンクが分かりやすいので共有します。
https://www.profuture.co.jp/mk/column/45348#:~:text=PWA%E3%81%A8%E3%81%AF%E3%80%81Web%E3%82%A2%E3%83%97%E3%83%AA,%E6%A9%9F%E8%83%BD%E3%82%92%E4%BD%BF%E7%94%A8%E3%81%A7%E3%81%8D%E3%81%BE%E3%81%99%E3%80%82
以上がアプリの説明です。記事を見ていただきありがとうございました。
最後に使用技術を説明していきます。
・Next.js
・Google Map API
ソースコード
https://github.com/kaede-hub/hurokinniku/blob/main/README.md