見出し画像

個人開発でラブライブ専用掲示板を作った話

初めまして。

今回は私が作ったラブライブの掲示板についてお話したいと思います。

経緯

もうこの掲示板をリリースして一年以上経っているのですが、最近スレッドページのOGP対応などを行ったので、記憶を掘り起こしながら経緯や使用技術について書きたいと思います。(Qiitaで書かないのはメモとかポエム?よりな内容になると思ったからです💦)

去年の1月頃でしょうか、業務で好きなJavaScriptフレームワークを導入しても良いということだったので、気になっていたVue.jsを導入することにしました。が、当時は業界に入ってまだ3、4ヶ月とかでJavaScriptもろくに書けない状態でした。

多少使い慣れていたjQueryを使用する道もありましたが、どうせならモダンな技術を業務で使ってみたいと言う思いがあったので、自分の時間を使って勉強することにしました。

とりあえず猫本を使って学習を進めていましたが、MVVMの概念が難しく、なかなか理解ができませんでした。。。(vuexとかほんっとに意味不明でした)

とりあえず一通り本に目を通してざっくり理解できたタイミングで、業務でVue.jsを使う案件がペンディングになり、せっかく学んだのにお預けをくらうことになりました。

業務でしばらく使わないんだったら学んだ内容を忘れないように個人でVue.jsを使ったSPAのサイトを作ってみようと思いました。

当時友達の付き合いで観に行ったラブライブサンシャイン の劇場版がきっかけで作品にどハマりしていたので、自分の好きな作品関係のサービスだったらモチベーションが続くかなと思ってラブライブの掲示板を作ることにしました。(なぜ掲示板を作ったのかはサイトのaboutページに書いております。

さてようやくですが、使用技術についてです。

サーバーサイド
・Laravel5.5
フロントエンド
・Vue.js
UIフレームワーク
・bulma
バーション管理
・Github(プライベートリポジトリ)
デプロイサーバー
・さくらVPS
ミドルウェア
・MySQL
・Apache

機能
・ログイン機能
・スレッド作成
・スレッドお気に入り機能(ログイン時)
・スレッド検索機能(タグによる絞り込み、like文でのタイトルと本文検索)
・スレッドページのOGP対応(スレ立て時にOPG用の画像生成)
・通知機能(ログイン時に立てたスレッドに良いねされた時にトップページに通知)
・SS特化機能(キャラの名前を楽に入力できる機能)

開発期間 2019年1月〜7月頃

この掲示板開発を通して学べたことは以下になります。
・JavaScriptの基礎、非同期処理について
・SPAサイトの開発
・SPAサイトでのログイン機能(OAuth)
・Laravelを使用したAPI開発
・管理者ログインでスレッドの削除などの管理機能
・UIフレームワークを使用したデザインの作成

特にOAuthについて理解に1ヶ月近くかかりました。(理解したとは言ってない)

最後にまとめると、この掲示板の開発を通していろいろなことが学べたと思います。
確か去年の1月、2月の段階ではLaravel+Vue.jsでのSPAサイトでログイン機能開発について細かく書いている記事が少なく、Githubに上がっているコードを参考に実装したのを覚えています。(確かこのプロジェクトでした。
それに伴って、OSS等のコードリーディングも抵抗がなくなり、個人開発は良いことしかないです。これからも学習がてらに何かを作っていきたいです。

最近自分の興味がサーバーサイド > フロントエンドという塩梅なので、noteではその学習記録を残せたらなと思います。

今Golangを勉強しているのでそれについても後日noteに記録を残したいと思います。

(ささっと書いたので誤字脱字日本語がおかしいなどあると思うのであとでこっそり修正します。)

この記事が気に入ったらサポートをしてみませんか?