新規事業として中古商品の売買を始められた事業者様に、在庫・売上管理用のWebアプリケーションを開発致しました。

## 背景

事業の拡大にあたって、仕入れから売却までの業務をできる人手を増やしていきたいが、教育にコストがかかる。新しく雇い入れた人材でも簡単に業務が可能になるような、画一化されたワークフローをシステムで実現したいとの要望でした。

加えて、管理が行き届いていなかった在庫管理・売上管理もデータベース化しておきたいとのことから、私が設計をまとめ上げ提案いたしました。

## 実装

従業員がスマホ上で作業することが多いことから、スマホセントリックなUIを意識し、データベースへのアクセスを容易にしました。

販売から売上までの業務プロセスをUI上で案内することでITリテラシーの乏しい人材にも使っていただきつつ、業務の質を均一に保つようにしています。

ログイン情報を入力してスタッフの誰が商品データを編集したのかを明確化し、業務の監視・透明化を可能にしました。

将来的には大量の商品データが蓄積されることが予想されたため、カスタムなフィルターを実装しデータの検索性を高めました。

## 運用

業務体制も含めて継続的に試行錯誤を行いながら運用・開発を行なっています。

## 使用技術

- Typescript
- React
- AWS Amplify

中古品売買の在庫・売上管理システム開発

新入社員に対する研修を行われている事業社様にて、サポート用の既存Webアプリケーションのテスト構築を支援いたしました。
自社で構築されている数名の開発チームに参画する形でアプリケーション運用上の問題を提起し、解決方法を提案致しました。

## 背景

現状で、新入社員のモチベーションアップ・早期の離職防止などを図るWebアプリケーションを運用されていました。
運用上の問題として、重なる修正・デバッグの度に不具合が頻発しており、お客様よりの問合せも少なくありませんでした。

こうした事象の原因としては、アプリケーションのコード品質の担保ができていないことがあげられます。
実際に、運用されているアプリケーションは立ち上げ後そこまで間も無く、全体としてテストコードが皆無に等しい状態でした。
その結果として、コード修正による影響範囲が把握できず、思わぬ不具合を度々引き起こしていました。

私の方で、まずその現状を指摘した上で、テスト環境の構築、導入を進めて参りました。

## 実装

コード上のユニット間の分離が悪く、また短期間に担保を与えられるようなテストを用意する必要があったことから、実際のブラウザ上での挙動をテストする環境およびスクリプトを構築し、毎回のデプロイを行うCIパイプライン（アプリケーションの更新を行う仮想マシン）上にテストを行うプロセスを設置しました。

ブラウザ上のエミュレーションはSeleniumと呼ばれるライブラリを使用して行い、万が一テストに失敗した場合、通知が来るようになっており、未然のバグ改修を可能にしています。

## 運用

新規機能に対する追加テストシナリオの対応体制なども含めて引き続き対応しています。

## 使用技術・環境

- Typescript
- React
- Selenium
- CircleCI

既存Webサービスのテスト構築・導入支援

会社内のチームに対するコーチング・コンサルティングを行われている事業社様にて、新規Webアプリケーションの開発を支援いたしました。自社で構築されている数名の開発チームに参画する形で実装上の問題解決を致しました。

## 設計

渡されている設計としては以下のようになっていました。

- ユーザは複数名でログインする
- 同時に進行するゲーム形式でWeb上でコーチングを受ける
- ゲーム中にチーム内の問題について意見を投稿し、お互いの投稿が配信される
- 最終的に投票によって有力な解決策が決定したところでゲームは終了する

実装上の問題は、複数ユーザ間のゲーム進行の同期にあると見て、私の方で実装の指針を提案させていただきました。

## 実装

GraphQLと呼ばれるHTTP通信技術を用いて、Subscription（WebSocketによるサーバからクライアントへのデータ配信）を通じて複数ユーザ間のデータ同期を可能にしました。

また、チーム内の全員がゲーム内のプロセスを完了した際には、ゲームを次のステージに進行する処理をトップレベルのコントローラを設置することにより対応し、動作の安定化を図りました。

またデータ処理を可能な限りサーバサイドに移すことにより、重複となるデータ処理を未然にキャンセルし再試行させ、ゲーム進行上の不具合を防ぎました。

## 運用

バグ報告に対する修正・ゲーム内容の見直しに伴う改修も含めて引き続き対応しています。

## 使用技術・環境

- Typescript
- React
- AWS Amplify
- Serverless Framework(AWS)

社内チームのコーチングWebアプリ開発支援

広告運送会社様の案件・シフト管理用の業務Webアプリケーションを開発致しました。
（画面は現在開発中のものです）

## 背景

業務全体の自動化を進めたいとの代表のご意向があり、私の方から提案・開発させて頂きました。
テスト運用として実際に使っていただきながら機能追加、修正を断続的に行っています。

## 実装

時系列のタイムライン形式のUI上でのドラッグやクリックを中心に据えた直感的な操作で、シフトの変更が簡単に行えるようになっています。
アカウント内ユーザを切り替えることにより、担当者ごとに違う管理情報が出るようにしつつ、社内で共通のデータを閲覧できます。

## 使用技術

- typescript
- react
- redux
- vis.js
- aws amplify

開発実績