初心者がVPSを借りてRailsを動かした振り返り
はじめに
ちょっとご無沙汰なブログです。こんにちは。
忘れていたわけではないのですが、しばらくブログをお休みしてRailsの勉強をしていました。
このたび練習用に作ったRailsアプリを本番公開したので、ここまでの流れを振り返っておきます。
ひとまず今回はここまでの過程で意識していたことや、やってみて初めて見えた課題や、今後やりたいことなど、「考えてること」レベルで整理しようと思います。
あまり具体的な話じゃないので、自分向けの記事です。技術ブログというより日記ですね。
技術的に学んだ個別の事柄については、今後tips的な形で記事にしたいです。
どんなアプリ？
リンクはこちらです。
(たぶん少しの期間しか公開しないと思います)
ご覧の通り、Railsチュートリアルで作るアプリに一手間加えただけのTwitterモドキです。モデルの設計的にはむしろ簡単になってたり。
機能の特徴としては、呟ける内容が喜怒哀楽の4項目のみに限定されていることと、TwitterのIDに紐付いてユーザー・呟き（えもったーではエモと呼びます！）を作成するという点でしょうか。
間違ってもユーザー利用が見込める実用的なアプリではありません。
そもそもTwitter連携が前提なのに、機能がTwitterの縮小再生産という根本的な欠陥さえあります。
そんなわけで、今回はユーザーの獲得は度外視するという前提なのですが、今後作りたいと考えているものについては、きちんと実用性やユーザー獲得のための導線も考慮する必要があります。
大まかなスケジュール
ここまでの流れを超ざっくり振り返ると以下の通りです。（はじめから今回のアプリ作成に向けてスケジュールしていたわけではないですが）
- 2016/12 ProgateでRubyやRailsに関する講座を勉強してました
- 2017/1 macを購入したので、環境を作ってRailsチュートリアルを写経し始めました
- 2017/2-3 このブログをはじめて、環境構築周りのことを浅く勉強してました
- 2017/4中旬 えもったー作り始めました
このブログの2017年2,3月の記事を見て頂けるとわかるのですが、「環境構築周りのことを勉強」といっても非常にスカスカの内容です。他の月も同様。
この半年以上、とにかく生活がばたばたしてました。
ようやく時間を取れそうな気配が出てきたっぽい気配が無くも無い気配なので、もっと腰を据えて勉強していきます。頑張ります。
事前に考えていた課題
今回のアプリを作るにあたり、意識していた事柄として以下が挙げられます。
ほかにも考えていたことがあった気がするのですが・・・とりあえず上記それぞれについて書いていきます。
課題：VPS借りる
本番環境を想定して一般公開することをゴールにしました。
実際にやってみて、VPSの扱い方を知ったことはもちろん、本番移行（RAILS_ENV=productionにしたり、アプリをデプロイしたり）の段階で様々な落とし穴があることを知ることができました。
VPSはConoHaを選びました
VPS選定にあたって色々ググりましたが、さくらやConoHaがスタンダードみたいですね。
信頼・実績という観点では共に充分であり、「初めてのVPS」「お値段控えめだと嬉しい」といった前提を考慮しても、どちらを選んでも間違いなさそうでした。
そんななかでConoHaを選んだ理由は、
- コンパネがポップな色合いで好み
- 初期費用が無料
- 最小構成なら630円/月
- 応援団長の美雲このはちゃんがかわいい(重要！)
でした。
実際に使ってみた感想ですが、契約から1台目のサーバー立ち上げまで迷うことなく進められ、コントロールパネルもとても分かりやすく、私と同じような初心者におすすめ出来ると思います。あと、このはちゃんかわいい。
このはモードのコントロールパネル。かわいい。
・・・なんかConoHaの宣伝になってるような。
課題：5月いっぱいで終わりにする
ずるずる長引きそうなので、5月最後の土日にはVPSへの公開を終えて、このブログを書くことにしていました。
特に今回は機能やUIを作り込んでも仕方がなく、Railsを書く感覚を掴めればよいと考えていました。本番環境に公開するステップまで早めに経験する意味でも、最低限やることやったらずばーっと終わりにするつもりでした。
最終的に、未実装の機能も多いですし、見た目も笑えるほど簡素ですが、早い段階で「いつ公開してもよい」状態にすることを意識して作成できたと思います。
課題：Twitterとの連携機能を実装する
Railsチュートリアルで学べることに1つくらい味付けしたいという意図があり、Twitter連携を利用するアプリにしました。半分取ってつけたような課題なのですが。
今後ほかのアプリを作るにあたっても、WebAPIってどんな風に使うのかを知っておいて損はないだろうという考えがありました。
実際、「APIを使うってどんな感じか」が理解できたので、Facebookにせよ何にせよ、他のSNS関係のAPIもある程度円滑に使用できる気がします。
ただ、gemには'omniauth-twitter'と'twitter'を利用しており、結局は巨人の肩に乗っているだけです。gemを使うこと自体はもちろん悪いことではないですが、小手先であれこれして満足するだけではなく、もっと深掘りして仕組みを理解する必要があるなーとも感じています。
それはたぶんAPIに限定した姿勢ではなくて、 RubyやRails自体や、インフラの各要素についても言えることですね。どうにか動かしただけで満足しないようにしなければ。
今後の課題
事前に設定した課題については以上の通りです。
以下では、当初から見えていたけど今回は保留にした課題や、実際に手を動かしてみて初めて実感した課題についてまとめます。
本番環境の構築やデプロイの方法を整理・自動化する
想定していたことですが、実際にVPSを借りて本番環境をセットアップするにあたり、もうハマりにハマりました。
行った変更内容は大まかにメモしていますが、あまり整理されてはいません。今回の場合、railsディレクトリを丸ごとscpでアップロードして、手当たり次第にunicornやnginxを導入しては設定をいじり、どうにか動いたという状況です。
nginxの設定方法など、もっと体系的に理解した上で環境構築の手順を整理する必要があります。
また、自動化の重要性も実感したので、改めて勉強していきたいです。インフラ構築も、アプリのデプロイも、可能な限り自動化できるようになりたい。
テストコードを書く
今回はとにかく動くコードを書いて、本番環境で動かして・・・というのをゴールにしていました。
次はテストコードの書き方も身につけて、きちんと機能ごとにテストを用意しながら実装を進めていこうと思います。
設計する
場当たり的にビューを追加するなどコードを書き足していくと、当然ながらあとになって変数の命名やスコープに困ることがありました（コントローラに条件分岐用のパラメータを渡すときとか）
「コード全体がどういうものになるのか」という感覚も何となく掴めてきたので、これからは事前に全体像をイメージして作らないといけません。初めからできそうには無いですが、意識的に頑張らなければ。
また、設計という言葉とはややズレるかもしれませんが、読みやすいコードを書く技術も身につける必要がありそうです。
デザインのお勉強
さすがに今回のは素っ気無さすぎですね。今後作るアプリでは、多少は見た目も気にしないといけません。
ただ、これについてはアクションを決めかねています。絵を描いたりといった視覚的な分野にはそもそも苦手意識がある*1のですが、WEBサイトにおける見た目（=CSS）の話って、実践の仕方が今ひとつ分からないのですよね。
- 色や情報の配置といった(そのままの意味での)デザイン
- CSSの書き方
それぞれについては書籍やサイトが沢山あると思うのですが、両者を組み合わせるというか、「こうしたいときはこう書く！」みたいなCSSのプロパティをどう使うかという部分については、試行錯誤するしかないと感じています。
CSS についてググってみても、「float:leftで回り込みができるよ！」という解説はヒットします。が、そういう個々の規則が、どのようにして巷に溢れるイケてる要素の配置に使われているのかまで中々理解できないのです。
たとえばTwitterの画面左上のプロフィール領域（名前とかツイート数とか出てる部分）、あれってどういう風に作られてるんでしょう。文字や画像のサイズとか配置とか、難しくないですか・・・？
そのうえ分かりやすい・使いやすい見た目を1から自分で考えて作るとなると、もう何から手をつけていいのかわからなくなってしまいます。
とりあえず、日頃から目に入るデザインに注目して「いい感じのデザイン」を学び、それを実際に形にする段階では愚直にCSSを書いて模索するしかなさそうです。
おわりに
久々のブログはいつも以上にとりとめのないものになりました。自分用メモにもほどがある。
事前に意識していた事柄や、開発中に感じた課題や反省点はもっと色々あった気がしますが・・・適切な課題を設定する能力の低さがあらわになってますね。
ともあれ、一連の作業の感想ですが、とても楽しかったです（こなみかん）
チュートリアルを写経するだけでなく、自分で機能を考えてコードを書くのは楽しいです。一つの機能に対しても保守性・拡張性という観点で書き方に悩む場面が多々あり（たぶん全然正解に辿り着けてない・・・）、単なる文法やモジュールを沢山知れば良いというわけではないこと実感しました。
今後ですが、ちょっと作りたいもののイメージがあるので、それに向けて必要な知識を身につけたいです。
このブログについては、今回の件で学んだこと（tipsレベルのコードとか、直面した問題の対応策とか）や、今回感じた課題に対する取り組みのほか、前述の作りたいものに関連した学習メモを書いていきたいと思います。
*1:デザインとは見栄えではなく機能性なのかもしれませんが、視覚的な要素が関係する時点で等しく苦手分野です・・・
