SHOEISHA iD

※旧SEメンバーシップ会員の方は、同じ登録情報(メールアドレス&パスワード)でログインいただけます

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

「GrapeCity ECHO」レポート(AD)

Webアプリケーション開発にかかわる、新たな世界を拓く「SPA」の最新動向を追う――「GrapeCity ECHO Tokyo 2019」開催!

  • X ポスト
  • このエントリーをはてなブックマークに追加

「状態との戦い」に勝利するための開発アプローチを支える「武器」

 この日3つ目の講演となったのは、日本プロテック(NPC)の疋田直樹氏による「SPAを選択した理由とその結果 ~Reactを添えて~」と題するセッションである。NPCは1982年の創業以来、マイクロフィルムの製造販売、汎用コンピュータ(大型汎用機)、クライアントサーバーシステムの開発を経て、現在はWebアプリケーションシステムに関する企画から運用までをトータルに支援するシステムベンダーだ。

株式会社日本プロテック 情報セキュリティグループ システムエンジニア 疋田直樹氏
株式会社日本プロテック 情報セキュリティグループ システムエンジニア 疋田直樹氏

 同社では、これまでSpringやASP.NETといった技術を使い受託開発を行ってきた。しかし最近では、特にFlashやSilverlightなどの技術がレガシー化する中で、リッチなUIや操作性を維持し、かつ既存のコンポーネント構成やバックエンドをそのまま活かせるといったメリットもあって、アプリケーション移行の手段としてSPAを採用するケースが増えているという。

 「特にクライアントサイドについては、ボタンやアイテム、入力フォームなどの状態に応じて、各パーツを適切にコントロールする機能要件が多く、そうしたニーズに応えるには非常に煩雑な処理が必要で、それはまさに『状態との戦い』とも言えます。そうした煩雑さをクリアする上ではSPAの採用が極めて有効なのです」と疋田氏は強調する。

 今回NPCでは、顧客の開発プロジェクトに人員を配備するためのアサイン管理システムをSPAにより構築。これについては、すでに述べたような状態管理を行うのに、とりわけ有効なフレームワークとして同社が関心を寄せていたReactによる開発を、自社システムにおいて検証したいというねらいがあった。それもあって同社では、開発言語にはTypeScript、そしてUIコンポーネントにグレープシティのWijmoをそれぞれ採用している。

 そもそもが検証という動機もあって、今回のアサイン管理システムでは、画面上のボタンやフォームなどの複雑な状態管理を行っている。例えば未保存データを一覧することや、行の挿入を現在の最下行の下に対し行う、あるいは全行が削除された際には必ず空白行を1行残すといった仕組み、さらには独自のフィルタ、ソート、グルーピングなどの機能を実装している。

 「React自体は非常にシンプルで『html=component(props)』すなわち『結果となるHTMLの文字列=関数(引数)』という純粋な関数をツリー構造で組み合わせてコンポーネントを構成する形となります。このときコンポーネントは、引き数が同じであれば、いつ、何回呼び出しても結果は同じであり、Reactでは状態を極力持たない、持つとしても局所化するという思想でデザインされています」と疋田氏は説明する。端的に言えば、これらのことがアプリケーション開発における状態管理の煩雑さを解消するポイントとなっているわけだ。

 NPCのアサイン管理システム開発の取り組みにおいては、こうしたReactの活用が想定通りの効果を上げた。具体的には、状態をできるだけ持たない仕組みにより、機能やデータ、開発者がどれだけ増えても、状態管理の煩雑さからアプリケーション開発が破綻するようなことはなかったという。

 「最初からReactの思想や意義を開発者に理解してもらうのは難しいかも知れませんが、とりあえずプログラムを書いてもらえれば、確実に習熟できるものと思います。印象的には、Angularよりも学習コストは低いものと感じています」と疋田氏は語る。

常にユーザーの声に耳を傾け製品のブラッシュアップに努める

 イベントを締めくくる最後のセッションには、主催者であるグレープシティの村上功光氏が壇上に上がり、「GrapeCity製品からみるSPA開発のトレンドと動向」と銘打つセッションを行った。

グレープシティ株式会社 ツール事業部 プロダクトマーケティング 村上功光氏
グレープシティ株式会社 ツール事業部 プロダクトマーケティング 村上功光氏

 グレープシティでは、SPAに組み込んで利用できるJavaScript製品として、この日のほかの講演でも登場したUIコンポーネントのWijmoやExcelライクな機能を提供するスプレッドシートコントロールであるSpreadJSに加え、全角入力など日本仕様にこだわった入力支援コントロールセット「InputManJS(インプットマンJS)」をラインナップ。

 さらに2019年12月には、長年、帳票開発ライブラリ製品として、広範なユーザーに受け入れられてきた「ActiveReports(アクティブレポート)」のJavaScript版となる「ActiveReportsJS(アクティブレポートJS)」も新たにリリースした。またSpreadJSについては、2020年1月下旬にその新版が登場。セル結合を行うことなく、1つのセルの中で複数の情報を扱えるテンプレート型セルや、隣接するセルを自動マージする機能など、30以上の新機能が追加され大きく進化を遂げている。

 グレープシティにおける、こうした製品の拡充について村上氏は「日本や米国のほか、中国、韓国のお客さまにも広く活用いただいているWijmoを例にとると、それら各国にある当社の拠点が、お客さまの要望や不満、意見を日々吸い上げています。それらを製品にフィードバックしながら、4カ月ごとに最新版をリリースするサイクルを確立しています」と紹介する。

 もちろん、最新の技術動向に対する速やかなキャッチアップにも努めており、例えばBlazorに関しても、グレープシティの開発チームは強い関心を寄せている。現在「Wijmo Blazor」という実験プロジェクトをGitHub上で展開。そこでデモなども公開しており、製品での対応に向けた取り組みを鋭意進めているところである。

 絶えず進化し続けるWebの世界にあって、開発者に常に求められているのは、シンプルかつ使いやすいインターフェースを備えたハイパフォーマンスなアプリケーションの実現だ。グレープシティでは今後もJavaScript向けライブラリ製品の提供を通じて、そうした要請に応える開発者の取り組みを強力に支援していくことになる。

当日の講演資料は以下の記事からご覧いただけます!

この記事は参考になりましたか?

  • X ポスト
  • このエントリーをはてなブックマークに追加
「GrapeCity ECHO」レポート連載記事一覧

もっと読む

この記事の著者

丸谷 潔(マルタニ キヨシ)

 フリーランスライター。1963年生まれ。慶應義塾大学文学部卒。システム開発(メインフレーム、OS/2等)、IT関連雑誌・書籍の編集を経て現職。執筆領域はIT系全般、FA系など。

※プロフィールは、執筆時点、または直近の記事の寄稿時点での内容です

【AD】本記事の内容は記事掲載開始時点のものです 企画・制作 株式会社翔泳社

この記事は参考になりましたか?

この記事をシェア

  • X ポスト
  • このエントリーをはてなブックマークに追加
CodeZine(コードジン)
https://codezine.jp/article/detail/11902 2020/01/29 12:00

おすすめ

アクセスランキング

アクセスランキング

イベント

CodeZine編集部では、現場で活躍するデベロッパーをスターにするためのカンファレンス「Developers Summit」や、エンジニアの生きざまをブーストするためのイベント「Developers Boost」など、さまざまなカンファレンスを企画・運営しています。

新規会員登録無料のご案内

  • ・全ての過去記事が閲覧できます
  • ・会員限定メルマガを受信できます

メールバックナンバー

アクセスランキング

アクセスランキング