webアプリケーション、サーバーサイドアプリケーションなどweb関連の開発がしたい。
webの世界は進歩が速く、常に新しい知識を求められるので大変だと思うのですが、その反面やりがいを感じられそうだと思うからです。
フロントエンド、バックエンドに関わらずwebの開発をしたいと思います。
システムの機能の一つである電文送受信機能を担当しました。
開発方針は以下の4つです。
1.電文はTCP/IP、FTPの二つのプロトコルによって送受信するため、そのためのライブラリの作成
2.通信処理はすべて非同期とする
3.電文は種類が多いため電文名、パラメーターを指定することで生成を行う
4..Net Framework 3.0の新機能であるラムダ式、LINQを積極的に使用する
TCP/IP通信用とFTP通信用のクラスを作成し、非同期通信用のメソッドを実装しました。
これらのメソッドは通信成功用と通信失敗用のデリゲートを引数とし、呼び出し側はラムダ式で記述できるようにしています。
電文は要求電文と応答電文の2種類が存在し、"3000"という要求電文を受信すると"3001"という応答電文を送信するという仕様で、電文の内容は単純なKVPで記述されており、要求電文は"kind=request;name=3000"、応答電文は"kind=response;name=3001;posx=x.xx;posy=x.xx"のような形式でやり取りされます。
電文名とパラメーターを渡すことで自動的に電文が生成されるFactoryを作成し、使用する側の負担を軽減しました。
このプロジェクトを通じて現在では当たり前となっている非同期処理、ラムダ式による簡潔な記述、LINQによるコレクションの操作の基礎を学べました。
システムの機能のうち、洗浄の開始と終了を監視して履歴として残すサービス、洗浄履歴を表示する画面を担当しました。
開発方針は以下の6つです。
1.DB周りの負担を軽減するためにEntityFrameworkを使用する
2.DBへの問い合わせ、更新はasync、awaitを使用した非同期とする
3.洗浄の開始と終了は洗浄機から出力されるファイルがトリガーとなるためファイルを監視するためのクラスを作成する
4.MVVMパターンを使用する
5.リアクティブプログラミングをできるだけ実践する
6.WPFの機能を駆使して画面のデザインをモダンにする
DBへの問い合わせ、更新を管理するライブラリはEntityFrameworkを使用して作成しました。
EntityFrameworkにはDBへの初回アクセス時に初期化処理が実行され、初期化の完了までに数秒かかってしまうという問題がありましが、これを回避する方法が発見できなかったため、サービス、画面の起動時に空問い合わせを行うことで初期化処理を完了させるという方法で問題を回避しました。
洗浄の開始、終了はファイルでやり取りされるためファイルを監視するための仕組みが必要でした。
当初はFileSystemWatcherクラスを使用して実装することを考えましたが監視先がネットワーク上であり、FileSystemWatcherクラスによる監視はネットワークが切断された場合に自動で監視が復帰しないためこれを断念、最終的にRxのTimerを使用することでリアクティブに実装することで解決しました。
洗浄履歴を表示する画面にはWPF(XAML)、MVVMパターン、Rx(Reactive Extentions)を使用してモダンな画面として実装することを心掛けました。
ViewとViewModel間のインターフェースは全てRxを使用して繋ぎ、値の変更があったときに自動で通知されるように実装、ViewModelとModel間は長期的に監視される状態のようなものはRxで、DBへの問い合わせで得られるような揮発的なデータは戻り値ありの非同期メソッドで実装しました。
画面のデザインについてはAndroidやwebを参考にし、それをXAMLで再現しました。
これまでに習得してきたXAMLの知識の集大成になったと感じています。
このプロジェクトを通じてモダンなプログラミングを実践し、良いUXを提供できたと思います。
C#をメインに使用していますが他の言語、分野の新しい技術を取り入れることで自分の分野でできることも広がるのだと実感しました。
web周りの技術を本格的に学習したいと考え、自主学習勉強として始めたプロジェクトです。
業務でElectronを使用してデスクトップアプリを作成することが検討されていたのでちょうどいいタイミングだったと思います。
エディタはVisual Studio Codeを選択、言語はJava Script(ES2015)、HTML5、CSS(SASS)を選択しました。
バンドラは現在一番ホットだと思われるwebpackを選択し、SASSをコンパイルするためにsass-loader、css-loader、style-loaderを、ES2015に対応していないブラウザを想定してbabelをインストールしました。
webpackの設定ファイルの内容を理解し、期待通りの動作をさせるまでに一番時間がかかりました。
レイアウトには新しくFlexboxレイアウトが使用できるということでそれを選択、MVVMパターンを実現するフレームワークにはVueを選択しました。
マークアップ言語によるUIの構築、MVVMパターンについてはWPF(XAML)でアプリを開発していたときの経験、知識が活用できたと思います。
スクレイピングにはPhantomJSを使用し、ヘッドレスブラウザの便利さを知ることができました。
このプロジェクトを通じてwebの世界の開発に触れることができたと思います。
相対レイアウトやMVVMパターンなどの知識はデスクトップアプリでもwebアプリでも適用できることを実感しました。
これからも学習を続け、webの世界への理解を深めたいと思います。
Java ScriptやHTML5などweb関係の技術を深く理解したいです。
デスクトップアプリ開発もとても楽しいのですが、技術の視野をもっと広げたいと思います。
充実した開発環境(デュアルモニタやハイスペックのPCなど)があると開発効率も気持ちもとても上がります。