はじめに

今回eclipseでwebアプリケーションを作成しました。
まだAWSなどについて勉強不足で公開できていないのですが、webアプリケーションの開発手順やEclipse、SpringBoot、GoogleMapsAPI、MySQLについて知りたいという方達の役に立ちたいと思ったので、開発のことについてお話ししようと思います。
[GitHub URL]
https://github.com/HagisawaYuki/GachaMap.git

開発したwebアプリについて

今回私が開発したwebアプリは『ガチャマップ』というものです。

画像としてはこのようなものです。
この赤いピンはガチャガチャがあるところを示しています。
この赤いピンをタップすると、

このようにガチャガチャスポットの説明がポップアップとして出てきます。
また、マップ上に新しいガチャガチャスポットを設定したい場合は、マップ上でその部分をタップして

このフォームに情報を入力して完了ボタンを押せば、登録できます。
これがこのwebアプリの概要です。

搭載した機能

・ログイン機能

・会員登録機能

・パスワードを忘れた際のパスワード再設定機能

ユーザ名と誕生日を入力すれば、パスワードを再設定できるようにしています。
セキュリティとしては弱いかもしれませんが、たいした個人情報を扱っていないし、ないよりはあった方が良い機能だと思ったので、この機能を作成しました。
扱う個人情報が増えた際にはメールを扱った認証機能を追加したいと考えています。

・パスワードのハッシュ化

会員情報であるパスワードは、エンコードしてデータベースへセットするようにしています。

開発のきっかけ

これを開発しようとしたきっかけは2つあります。
まず1つ目は、ガチャガチャを探す手段があまりないと感じていたからです。Googleマップで探しても出てこないので、ガチャガチャを探している時、不便に思っていました。そこでガチャガチャの場所とその詳細がマップ上でわかるアプリがあったら便利だと思ったので、今回ガチャガチャを題材にしました。
2つ目は、Javaで何か制作してみたいとずっと思っていたからです。何年もjavaを扱ってきましたが、何か制作したことはなかったのでそろそろ作りたいと感じたからです。

使用技術

バックエンド

　Java（フレームワーク：SpringBoot）
　SQL

フロントエンド

　HTML
　CSS
　JavaScript

ツール

　MySQL
　draw.io(ER図)
　figma(画面遷移図)
　eclipse

画面遷移図

データベース設計

まだ、user情報とガチャガチャスポット情報しか実装できてないです、、、

苦労したこと

SpringBootを初めて扱ったため、エラーの意味が全然わからなくて苦労しました。手当たり次第エラーをコピーしてwebで調べての繰り返しでした。
また、最初はwebアプリのデザインにBootstrapを使用しようと考えていたのですが、なぜか使えなかったため、CSSで全てデザインしたこともものすごく苦労しました。

追加しようと考えている機能

まだこれは必要最低限の機能とデザインしか実装できていないので、これからたくさんの機能を追加しようと考えています。現時点で考えている機能は下記のとおりです。

・ガチャガチャスポットに写真を追加できるようにする。
・約何台ガチャガチャがあるかの項目を、登録フォームに追加する。
・今緯度経度でしか場所指定できない状態になっているので、マーカーを自分で動かして場所指定をできるようにする。
・ガチャガチャスポットのお気に入り追加機能。
・ガチャガチャスポットのフィードバックをできるようにする。
・マイページを作成する。
・メールを使った認証機能
・インターネット上に載せる。

最後に

これからは、このwebアプリを作成する上でよく発生したエラーの対処の仕方や、機能を追加際にどのように追加したかなどの記事を書いていこうと思っています。