LoginSignup
16

More than 5 years have passed since last update.

Parse + AngularJS + Rails + herokuで、最小限のコードでAPIサーバーと管理画面を作る

Posted at

いいたいこと

  • データ構造を定義するだけで、アクセス制御(アカウント管理)付きのRestful API + 各プラットフォーム別SDK + 運用サーバーを自動的に用意してくれるParse、サイコー。
  • でもある程度データ構造が複雑になってくると、管理用インターフェイスは自前で作らなきゃいけなくなってくる。
  • 管理画面はCRUDがベースになることが多いからAngularJS使うと便利。
  • 作業環境はgrantとかgulpを使ってもいいけど、rails + herokuの組み合わせがなにかと楽。

Parse

Parseってなに

データ構造とアクセス制御周りの設定をしたら、自動的にRestful APIと実際にそれを運用するサーバーを生成してくれるサービス。所謂BaaSというやつだけど、設定画面/クライアント用SDK/ドキュメントの出来が素晴らしい。

Parse

フルスクラッチでAPIサーバーを作る場合に比べて自由度が低いんじゃないか、と思うかもしれないしそれは事実だけど、Parse上でやりやすい形で作っていけば全然使える。一度これになれたら自分でスクラッチからAPIサーバーを書いて運用する、というのはとても面倒に感じるようになる。

でも管理画面は自前で用意したい

スクリーンショット 2014-12-23 21.01.08.png

しかし問題になるのが管理画面。データのCRUDは基本的にParseの管理画面上でできるが、モデル間にリレーションがあるような場合だったり、数百件もレコードがあったりするとさすがに最適化された管理画面が欲しくなってくる。

AngularJS

管理画面はCRUDベースになることが多いので、AngularJSとの相性が良い。


Parse.initialize("cwpY...", "BuSf...")
Project = Parse.Object.extend("project")

query = new Parse.Query(Project)
query.find
  success: (objects) ->
    $scope.$apply ->
      $scope.projects = objects
  error: (error) ->
    alert "error"

#ngExp(ng-controller="ProjectsCtrl")
  %ul
    %li(ng-repeat="project in projects")
      {{project.get("name")}}

ParseのSDKとの相性も問題ない。例えば、レコードのリストを表示するだけなら、こんな感じで至ってスマートに実装できる。素晴らしい。

わかりやすさ重視のため、ユーザ認証部分については省略しているが、本番運用では必須です!

注意しなければいけない点としては、$http$resourceを使う場合と異なり、ParseのSDKのコールバック内で$scopeに対して操作をしても、AngularJS側では変更を検知できないので、$scope.$applyを使う必要があるという点くらい。

Rails + heroku

  • JavaScript(AngularJS)を使うなら、coffeescriptを使いたい。
  • coffeescriptを使うなら、コード変更時に自動的にコンパイルされてほしい。
  • できればjadehamlを使いたい。
  • twitter bootstrapとかも使いたい。
  • 最終アウトプットはhtml + jsなので、デプロイも簡単に行いたい。

grantかgulp?

素直に考えると、grantgulpを使って環境を作るのが妥当だけど、grantは設定自体がだいぶややこしい。yeomanとか使って多少楽をしたとしても、デプロイ先サーバーの準備なども自分で行わなければいけないので結構面倒臭い。

Rails + herokuいいかも

  • 設定しなくてもcoffeescriptとかhamlが使える。
  • gitレポジトリが用意される。(heroku)
  • 運用サーバーが用意される。(heroku)

というわけで、grant or gulpよりもRails + herokuのほうが楽だと思う。

結論

この組み合わせだと、最小限のコードだけでAPIサーバーと管理サイトが作れるので楽しい。でもセキュリティ周りは気をつけてね!

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
16