## 職務要約
- 医療、介護事業所向けクラウド型のWebサービスのフロントエンド開発
当社では近年製品のUI/UX向上を目指し開発チームの構成として、画面設計やUIデザインを中心に行うフロントエンドチームが組織され私は未経験からフロンエンドに採用されました。
入社時はcssコーディングやjQueryを使用して画面に動きをつけるなど、チーム自体がサーバーサイドの補助的な位置付けでしたが、Vue.jsを導入し新規機能をSPA構成で開発するなど、現在に至るまで徐々にフロンドエンドとしての役割が確立されていきチームの成長と共に段階的に技術や経験を積みました。
## 技術・工夫
- Vue2
- Vue3(vue-router, vueX)
- Vuetify
- Typescript
- Storybook
当初Webアプリケーション作成をサーバーサイドのみで行い、フロントエンドという役割がない状態からチームが組織されJavascriptのフレームワークであるVue3を導入しSPA構成の新規機能を作成してきました。
これまでデザインを担っていたチームであっため、jQueryで画面の動きを付ける以外にJavascriptを使用する機会は少なく、Ajax通信、REST API、ルーティングといったサーバーサイドと通信を行う基礎に加え、モダンなフレームワークの使用、Typescriptによる型安全などを学び実装していきました。Vueを選択した理由はscript、デザイン、html要素をシンプルに切り離し記述できる点がこれまでHTML,css,jQueryを扱ってきた技術体制に合っていたからです。この際、デザインフレームワークにVuetifyを選択し、あらかじめ準備されたVueコード、JavaScript、CSSで構成されたUIを使用する事にしました。
また昨今Vue3が公式リリースされTypescriptが標準仕様となりそちらの対応も行いました。コンポーネントが肥大化しないよう、スクリプトを分割しjavascript部分の再利用、モジュール化、その際の型安全の確保に努めました。
## 成果・課題
小さな機能追加からですが、サーバーサイドとフロントエンドを分担しSAP構成でWebアプリをリリースする事ができました。それにより、開発の効率化、UI/UXの向上を図ることができました。
大きな課題として、フロントエンドのテスト導入ができていません。サーバーサイドにビルドしたファイルを渡しサーバーサイド主体のE2Eテストで品質を確認しています。こちらはテスト設計やテストツールを学習し開発工程も含めた改善が必要と考えています。