linoupの開発プロセスについて

これは、プログラミングスクールのジーズアカデミーというところで、プログラミング開始2ヶ月ほどで行ったphp選手権で提出した課題です。
Laravelに初挑戦して四苦八苦した思い出のエントリー。

share links in your group
linoup
https://www.linoup.jp/
http://www.linoup.jp

linoupとは

linoupとは "link" + "group" の造語です。
家族、友達、カップル、職場など特定のグループの人たちが、気軽にリンクを共有できるサービスを目指しています。
行きたい！、美味しそう！、便利！など、出会った情報をLINEで共有しても、あれどこにいったっけ？となるストレスが解消され、グループで情報共有が進めば、コミュニケーションはもっと楽しくなるはずです。

なぜlinoupを作るのか

国内のコミュニケーションの中心はLINEを中心としたチャット形式なものであり、いわゆるフロー型が基本となっている。
一方で、一定期間保持しておきたい情報を貯めて共有するストック型のコミュニケーションを軸として設計されたサービスがあまり存在しない。
エンジニアを中心にドキュメントを残す（qiita, esa, docbase）文化はあるものの、日常的に使うことを想定したサービスは見かけない。
情報の種類によってフローとストックをうまく使い分けることで、コミュニケーションの質は高まると考えます。

コア機能

ユーザーがグループを作成し、そのグループ内にリンクを展開することで共有できること。

開発について

開発環境

• 環境
  • virtual box（仮想環境）
  • vagrant（仮想環境構築と共有）
• エディタ
  • VSCode
• git
  • bitbucket

言語・フレームワーク

• 言語
  • HTML
  • CSS
  • Javascript
  • php
• フレームワーク
  • Jquery
  • bootstrap
  • laravel
• Database
  • MySQL（ Squel Proで管理 ）
• サーバー
  • heroku
• domain
  • AWS Route53

デザインについて

DINのフォントでシンプルで洗練された印象を与えつつ、緑を活用することで親しみも演出しています（つもり）。
それ以外はbootstrapに頼りきりです。

開発予定機能

• ユーザー
  • 各URLに対してタグを追加
  • URLの検索
  • ユーザーの削除
  • グループ名の変更
  • ドメインのSSL化
  • 招待URLの共有方法追加（LINE..etc）
• 管理画面
  • ユーザー管理
  • 投稿管理
  • グループ管理
  • 統計（ユーザー数、グループ数、投稿数）
• 外部連携
  • LINEからの登録、参照
  • twitterからの登録

収益モデル（妄想）

• 広告モデル
  • URLリストに一定間隔で広告の表示
  • URLからの嗜好性を分析し、おすすめコンテンツの提供（広告含む）する。
• 有料機能
  • 検討中

php選手権で頑張ったこと

開発環境

仮想環境の構築は非常に難解でしたが、結果的にはローカルと同期させた環境で実装を進めることができました。そのため、今までと変わらずVSCodeを使った開発をすることができました。これはCloud9では実現できないことで、挑戦の価値があったと思います。
参考：https://www.vagrantup.com/

laravel

phpのフレームワークであるlaravelは、MVCを理解することと、フレームワーク独自のルールを把握することに非常に時間がかかりました。ですが、大枠を理解できたところから開発速度が上がり、非常に短時間で機能実装できたと感じています。これからの授業とあわせて理解を深めたいです。
User関連をコマンド一つで実現できたり、画面の共通化をしたり...色々便利です。

git管理

また、Gitを導入したことも非常によかったと感じています。ツールはbitbucketとsourcetreeを活用しています。bitbucketでは非公開のリポジトリを無料で作ることができます（githubは有料）。sourcetreeはコミットのログを簡単にみることができるので、わざわざbitbucketで確認する必要はありません。
またVSCode上からもgitの差分が確認できるため、何触ったかなって視覚的に簡単にみることができます。
参考：https://bitbucket.org/ https://ja.atlassian.com/software/sourcetree

database

sequel proがおすすめです。phpmyadminはブラウザにアクセスする必要がありますが、これはアプリに接続情報を設定するだけで、MySQLを管理できます。
また、外部キー制約を実装することで、テーブル間のデータの関連付けも可能になり、データの整合性を保つことができます。
参考：https://www.sequelpro.com/

サーバー

今回はherokuに挑戦しました。無料で便利という噂を聞いており、著名なサービスであるために利用したかったという理由です。実際に、簡単にdeployできました。
さくらサーバーとの具体的な比較ができていないために、今後のサーバー選定時にもっと詳しく評価して行きたいです。
参考：http://heroku.com/

独自ドメインの取得

AWSのRoute53というサービスからドメインを取得しました。（ただ取得するだけならもっと簡単なサービスがいっぱいあるようです。ムームードメイン、お名前.com..etcなど）
AWSのサービスを活用できれば、サーバー・ロードバランサー？・S3？..etcを組み合わせてより便利に開発が進められると思いまずはその足がかりにRoute53を使ってみたという経緯です。
ドメインの取得とサイトへの反映は簡単に実現可能でした。
参考：https://aws.amazon.com/jp/route53/

Googleアナリティクス

サイトのアクセス解析といえばgoogle analyticsです。scriptを埋め込むだけで、サイト分析が可能。今後どのような利用状況になるかを具体的な数値をベースに観察して行きたいと思います。

google search console

公開したサイトをgoogleの検索結果に乗るようにリクエストするなど、google検索における設定が可能です。リクエストした結果、現在はキーワード"linoup"で４位です。サービス名検索で4位なので先は長い。。。
どうやったら検索流入を増やしていけるのか検討が必要です。

ちょっとしたこと

linoupにはアプリがないため、サイトアクセスを簡単にするためにiPhoneでホーム画面に追加をすると便利です。その際に、ホーム画面に表示されるアイコンやタイトルを適切に設定し、サービスロゴと名前が表示されるようにしました。

できなかったこと

gulpでbootstrap4にアップデート

laravel homesteadではbootstrap3が初期にセットされています。
これは単純にhtmlのheaderで上書き可能なのですが、設定と不整合が起きるためにgulp等を使ったフレームワークの管理を目指しましたが、概要把握できませんでした。

SSL化

AWSのCertificate ManagerでSSL化を実現可能です。linoupでも一時的にSSL化できましたが、その後設定不備でページを表示できなくなりました。
ドメインに対するSSLの適用には時間がかかり、トライ&エラーを繰り返しにくかったために時間的に断念いたしました。

https://www.linoup.jp/
herokuの有料プランに加入しました。

広告の配置

google adsenseの配置によって、サイト内に広告を表示しようと試みました。
しかし、審査の結果不承認となってしました。

理由：

不十分なコンテンツ: AdSense
の承認を得てサイトに関連性の高い広告を掲載していただくには、AdSense
の担当者による審査とクローラによる解析でページの内容を判断できるだけのテキストがページに含まれている必要があります。

コンテンツはユーザー自身が作っていくものなので、どうやったら広告を表示可能なのか今後調査を進めたいです。

まとめ

私はジーズにおいてサービスをリリースすることを目標に活動しています。
そのため、なるべく早期にサービスの企画→開発→公開→修正（PDCA的な）を実施し、サービスを作ることの全体像を把握・体験したいと考えていました。
その点に関して、本番に公開するところまで持ってこれたことは非常によかったと感じています。機能追加やアクセス分析..etcを続け、サービスを運用するという体験を進めて行きます。
さらに今後は収益機会を作れるようにな新たなチャレンジをして行きたいと思います。
チーム開発が楽しみです。

参考URL

php選手権において参考にしたサイト情報を共有いたします。
- ドットインストールのlaravel講座
- 【Laravel超入門】開発環境の構築（VirtualBox + Vagrant + Homestead + Composer）
- Laravel 5.5 TOC
- VagrantでMySQLをインストールしてSequel Proでデータベースを確認する
- Laravelで多対多の中間テーブルを用いたDBの作り方と使い方
- Laravel 5.4 の認証機能とそのカスタマイズ
- Laravelで関連するデータを簡単に操作する
- 【メモ】Laravelで外部キー制約付きのテーブルをマイグレーションする時に気をつけた方がよかった点
- Laravel5.4 + MySQL5.5.9 でusersテーブルのマイグレーション時に Syntax error
- ハッシュ値を生成する
- Laravelのバリデーションで指定できる内容をざっくりまとめ直しました。
- HerokuアプリにAWS Route53 で取った独自ドメインを割り当て、 Certificate Manager + Cloudfront を使ってhttps化する
- Laravel5.1でgmail経由でメール送信
- SEO嫌いにお送りするSEO策。これでもうSEOについてしばらく考えなくて良いぜ！！
- Heroku 運用検討
- Herokuに独自ドメインのSSL接続を無料で導入できるようになった話（有料Dynoのみ）
- Laravel5.3でSSL通信を強制する

---

※ボツLOGO
※gif作ったのですが、アニメーションがカクカクでいまいちだったので却下にしました。
※SKETCH plugin：https://github.com/nathco/Export-More

備考

仮想通貨関連です。天才というか偉人だと思いました。
https://qiita.com/bitrinjani/items/3ed756da9baf7d171306

以上