【url】
https://immense-spire-64115.herokuapp.com
【githubアカウント】
https://github.com/refresh-mintowa/spot
機能は大きく二つ
投稿と検索
【投稿】
地元の穴場だなと思う場所を投稿し、共有していく。
【検索】
検索方法は２種類ある。
1.日本地図の都道府県から選択する方法⇨右側のサイドバーに表示
2.カテゴリー、都道府県、キーワードを入れるより細かい検索方法⇨検索結果一覧ページに遷移
【作った経緯】
旅行に行くときにありきたりな観光地だけに行くのはもったいないなと思い、その場の人しか知らなそうなところにこそ行く意味があるなと思って毎回穴場を探しています。しかし穴場を調べるのにとても時間がかかってしまい、その時間を短縮させたいと思いました。そこで今回の穴場サーチというアプリを作ろうと思いました。
【使用言語】
HTML/CSS/JavaScript/PHP(7.3.27)
【フレームワーク】
SCSS/JQuery/Laravel(6.0)
【OS】
Linux(CentOS)
【データベース】
MariaDB
S3 画像保存に使用
【LOGIN情報】
ユーザー名 test
パスワード testtest
【機能】
- いいね機能
- ログイン機能
- 検索機能
- 投稿機能
- 編集機能
- 削除機能
【今後追加予定の機能】
- 人気順
- いいねリスト
- APIの実装
【今後の予定】
vue.jsの学習を進めていき、よりリッチなサイトを作れるようにしていく
【工夫した点】
複数の項目を同時に検索できるようにしたこと
一つ一つの項目での検索なら比較的簡単にできたが複数項目での検索には入れ子形式で実装すべきなのか、それとも場合分けを全通りしていかなければいけないのかなど色々考えさせられた。検索時の情報を保存するためにセッションを使ったこと
検索結果を一覧で表示したものにいいねを押すとURLが変わるため変わった時に検索時の情報を持たせてあげるためにはどのようにすればいいか考え調べた。
するとセッションを利用したやり方の記事が多かったためセッションを使ってみることにした。検索結果をシングルページで表示するためにajaxを使用したこと
シングルページで値を返すための方法を調べjson形式で返すなどJavaScriptの知識もつける必要があったため時間がかかった。
【苦労したこと】
中間テーブルを使用し、いいね機能を実装したこと
リレーションを理解することが最も大変でした。その中でも多対多の理解には中間テーブルについての学習も必要で時間がかかった。Herokuでのデプロイ時の画像の表示
シンボリックリンクで画像を表示できるようにしていたが、herokuはシンボリックリンクに対応していないとのことでS3を使って実装するようにしたこと。
【テーブル設計】
検索結果画面
記事詳細画面
