AngularJSのngResourceモジュールをRestangularに置き換えてみた

AngularJSのngResourceモジュールをRestangularに置き換えてみた

いなば

いなば

こんにちは、フロントエンドエンジニアのいなばです。
最近引っ越して台東区民になりました。憧れだったチャリ通勤ができてとても満足しています。

今回はAngularJSで開発している案件で、Ajax通信部分をngResourceからRestangularに置き換えてみたらとても便利だったのでご紹介したいと思います。

Restangularを使った簡単なサンプルも用意してみました。
http://i78s.me/ligblog-sample/restangular-sample/demo/#/member

APIのモックサーバは「Apiary」を使っています。

RestangularとngResource

まずRestangularとngResourceについて簡単にご説明します。

ngResourceとは

RESTfulなAPIとのデータの受け渡しを行うことを想定した高レベルAPIです。
AngularJSでAjax通信をする為の機能である$httpに依存しています。

https://docs.angularjs.org/api/ngResource

Restangularとは

同じくRESTfulなAPIとのデータの受け渡しをおこなうことを想定した高レベルAPIです。AngularJSでAjax通信をするための機能である$httpに依存しています。

GitHub:https://github.com/mgonto/restangular

用途は同じなのですが、Restangularを使うとリクエストやレスポンスの前処理の段階でデータの整形などの処理をはさんだり、アプリ全体のエラーハンドリングなども簡単な記述で制御できるようになります。

LIGはWebサイト制作を支援しています。ご興味のある方は事業ぺージをぜひご覧ください。

Webサイト制作の実績・料金を見る

この記事のシェア数

フロントエンドエンジニアのいなばです。 LIGではAngularやVueなどのフレームワークを使った中~大規模のWebアプリケーション開発、フロントエンドエンジニアの育成などを担当しています。 好きなものはカフェインとカプサイシン。 趣味はランニングと一眼レフです。

このメンバーの記事をもっと読む