SE+センター SE+推進部 システム開発課 岩本 次郎

React.jsでOSS Rader Scopeを再実装する

第1回 はじめに

React.jsとはMVC のV(View)として利用されるライブラリです。
XMLをJavaScript中に直接書くことでコンポーネントを宣言的に定義することが可能です。また、値が更新された場合には全体を再描画せずに、変更箇所だけを再描画する仕組みが備わっているため、パフォーマンスも十分です。しかも、Facebookで利用されており、今注目のライブラリです。

今回作成したアプリ

今回作成したアプリケーションではOSS Radar Scope®をそのまま再実装したわけではありません。仕様を少々変えてあります。

もとのOSS Radar Scope®は下図の通りです。

それを、次のように作り変えています。

React.js で動くものはここで閲覧することができます。CSS3 SMIL によるアニメーションも追加しているので、まずはアクセスして動作を確認してください(※Internet Explorer へは未対応のため、他のブラウザで表示してください。また、表示されましたら、左の列の"表示月"を指定してみてください)。

この記事ではReact.jsの使い方から紹介し、上記のOSS Radar Scope®の一部を説明します。

それでは、早速React.jsの世界に入っていきましょう。

1

2 3
PAGE TOP