朝日ネット 技術者ブログ

朝日ネットのエンジニアによるリレーブログ。今、自分が一番気になるテーマで書きます。

ASAHIネット会員専用ページを刷新します

開発部のmuratamです。今回は、現在進行中のASAHIネット会員専用ページ刷新プロジェクトについて書きます。

ASAHIネット会員専用ページとは

ASAHIネット会員、つまりASAHIネットの各種サービスをご利用いただいているお客様がサービスに関する情報を見たり手続きができるwebサービスです。 この会員専用ページ自体は昔から提供してきました。1

なぜ刷新するのか

そんな会員専用ページですが、長い歴史に伴って問題も出てきます。

まず、変更は続けられてきたものの長年デザインが同じ状態なので、スマートフォンに適した画面がありません。 スマートフォンからのインターネット利用が大きな割合を占める2現在においてそれは不便でしょう。

また、数多くある画面のなかには古くに作られたものもあり、ドキュメント類がない、あるいは現状に追従していないものもあります。 このサービスを支えるフレームワーク自体も見直す時期ということもあって、刷新することとしました。

どう刷新するのか

システムの外側からみた変化

スマートフォンに対応していないならすればいい、ということでレスポンシブデザインで新たに作っています。 また、ルールに基づいた統一されたUIでわかりやすくするということも狙っています。

f:id:anmrtm:20191125121922p:plain
PC版とスマートフォン版3

システムの内側の変化

内部設計の大きな変化として、これまでモノリシック(monolithic, 一枚岩)だったサーバアプリケーションを分解します。 今回は画面表示の作成を担うフロントエンド・各種リソースへのアクセスとロジックを担うバックエンドと2つに分離して、両者の間をつなぐAPIを整備することとしました。 これによりアプリケーションコードの簡略化・メンテナンス性の向上を狙っています。

f:id:anmrtm:20191210130105p:plain
構成の変化

しかし、アプリケーションを分離したところで実装の際に意識していないとフロントエンドのコードにロジックが埋まってしまうなど当初のポリシーと乖離してしまいます。 その点は実装に携わる全員が注意する必要があります。 対策として、どちら側に実装したらいいのか?という判断のガイドラインを作りつつ進めています。

例えば:

  • 価格はバックエンドで計算する
    • 消費税対応もあるので
  • 数値の合計はバックエンドで計算する
  • 日時のフォーマットはフロントエンドで計算する

また、今回はフロントエンドとバックエンドの2つへの分解にとどめました。 マイクロサービスのレベルまで分解して再構築することも考えましたが、 比較的少人数で開発しているという現在の開発体制においては分離することによるコストのほうが高いと判断し見送りました。 ただ、今後機能のAPI化を推進してマイクロサービスの方向に舵を切ることも十分考えられます。

f:id:anmrtm:20191210130107p:plain
マイクロサービスにするのか?

これから

刷新プロジェクトはまだ始まったばかり。今後も順次置き換えを進めます。 さらに今回整理した情報をもとにさらに次世代の会員専用ページ、あるいはその他のサービスにつながればよいと思います。

採用情報

朝日ネットでは新卒採用・キャリア採用を行っております。


  1. 筆者は詳細な歴史までは把握していませんが…

  2. 総務省|令和元年版 情報通信白書|インターネットの利用状況

  3. 画面は開発中のものです (書いてみたかった)