#1. 何するの?
Ruby on Railsというフレームワークを使って簡単なWebアプリを作り、それをネット上で一般に公開(デプロイ)します。コーディングは一切不要です。
何番煎じだ、という内容ですが自分でやったことのまとめとして残しておきます。
ちなみに作ったのはこういうものです。コメントの書き込み・編集・消去ができます。↓
https://myblog-test-o2.herokuapp.com/posts
#2. Web開発初心者の3大障壁
自分はWeb開発は全くの初心者なのですが、ちょっとかじって見た中で大変だなと思ったのが以下の3点。
- 環境構築でつまずく!
- サーバーとかデータベースとか謎!
- ローカルで実行できたけど、デプロイってどうやんの??
特にデプロイはかなり謎でした・・・(最初は意味すらわからなかった)
で、どうやって乗り越えたかというと
環境設定・サーバーなど→AWS Cloud9で楽々!
デプロイ→HerokuとGithubで楽々!
でした。
#3. 利用するサービス
いずれもユーザー登録をお願いします。今回のような範囲で使う分にはどれも無料です。
・Github
https://github.com/
・AWS Cloud9
https://aws.amazon.com/jp/cloud9/
・Heroku
https://jp.heroku.com/
#4. 早速やってみよう
Cloud9にRailsをインストール
まずはCloud9にアクセスします。
Create a new workspaceで新しいワークスペースを作りましょう。
Workspace nameとDescriptionは適当にお願いします。
テンプレートとしてBlankを選んでCreate workspaceしましょう。
ページ下部にコマンドラインが現れたと思います。まずは
$ sudo gem install rails
でRuby on Railsをインストールしましょう。しばらくして「Successfully installed rails-X.X.X」となったら完了です。
####早速アプリを作ってみよう!
$ rails new memoapp
とすると、memoappという名前のフォルダができ、アプリが生成されます。
$ cd memoapp
$ rails g scaffold post user:string content:text
$ rails db:migrate
$ rails assets:precompile
とすると、scaffoldという機能を利用して、メモアプリが自動生成されます。ここで
$ rails s -b $IP -p $PORT
として、画面上部のPreview→Preview Running Applicationとして
https://newapp-[ユーザー名].c9users.io/posts
にアクセスすると、アプリが動いていることが確認できます。New Postからメモを残せます。
ただこれはまだローカルで実行しているだけなのでデプロイはされていません。
一度control+Cでアプリを落としておきましょう。
Herokuを使う準備
ここからGithubとHerokuを使ってデプロイしていきます。
まずHerokuではsqlite3が使えないので、Gemfileを編集します。
newapp/memoappにあるGemfileを以下のように編集してください。
gem 'sqlite3'
となっているのを
gem 'sqlite3', group: :development
gem 'pg', group: :production
に変更。
そのあと、コマンドラインで
$ bundle
を実行してください。次にnewapp/memoapp/config/database.ymlを編集します。
production:
<<: *default
database: db/production.sqlite3
の部分を
production:
<<: *default
adapter: postgresql
encoding: unicode
pool: 5
に変更してください。ymlファイルのインデントは必ず半角スペース2個です!
Githubと連携しよう
まずコマンドライで以下を実行します。
$ git init
$ git add -A
$ git commit -m "first commit"
次に
https://github.com/
に移動しましょう。+マークからNew Repositoryを選んで・・・
repository nameをmemoappとして、Create Repositoryします。
この部分を後で使います。
####SSH接続しよう
Cloud9のコマンドラインに戻ります。
$ cat ~/.ssh/id_rsa.pub
とすると、ssh-rsaで始まるなにやらすごく長いものが出てきます。これがGithubに接続するのに必要な鍵となります。(他の人には教えないように!)
またGithubの方でSettingsに移動します。
SSH and GPG keysを選びます。
緑色の「SSH Keys」をクリックして、タイトルをcloud9とし、先ほどの公開鍵をコピペして、Add SSH Keyします。
Githubのmemoappレポジトリから先ほどのアレをコピーします。
cloud9のコマンドラインから
$ git push コピペしたやつ master
で、Githubとの連携は完了です!
####Herokuでデプロイする
$ heroku create サーバーの名前
として今回のアプリ用のサーバーを立てます。サーバー名は自由につけられますが、他の人と被ってはいけないので、memoapp-[名前]-[日付]などとして重複を避けてください。
あとはコマンドラインで
$ git push heroku master
$ heroku run rails db:migrate
とします。
次にhttps://dashboard.heroku.com/
にログインして先ほど作ったサーバー名(memoapp-[名前]-[日付]とか)をクリック。
DeployのタブからDeployment MethodをGithubに。
App connected to GitHubからGithubへの連携をオンにし、
Automatic deploysをオン(enabled)にします。
最後にDeploy Branchをして、Viewでアプリの稼働を確認します。
どうだったでしょうか?無料のサービスだけで、自分のアプリケショーンをWebに公開することができました。これをきっかけに、どんどん機能を充実させて自分だけのアプリを作ってみてはいかがでしょうか?
#5. 参考にさせていただいたもの
https://www.sejuku.net/blog/8178
https://rails-study.net/github/
https://qiita.com/seltzer/items/d52a31c558a30c857a3f
https://railstutorial.jp/