はじめに
ここ1年、自社の業務システムを Django（バックエンド） と Vue（フロントエンド） で刷新している。
旧システムはベンダー委託で .NET ベース で作られており、画面も複雑化して保守が難しい状況だった。
改善のたびに期間・コストがかさみ、利用者からの不満も多かった。
この記事では 「なぜ刷新したのか」「なぜ Django × Vue なのか」「なぜ SPA にしたのか」 という全体像を書いていく。
旧システムの課題
- UI が古い：画面遷移ごとにページがリロードされ、操作感が重い
- 保守性が低い：ウォーターフォール開発で実際のニーズを反映しづらく、修正も困難。設計書も現物と一致しているか分からない
- 機能追加にコストがかかる：小さな変更にも費用が高く、しかも期間が長すぎる。その間ユーザーの時間も奪ってしまう
こうした課題を解消するには 「設計思想そのもの」の見直し と、内製化 が必要だった。
Django を選んだ理由
バックエンドは Python 製フレームワークの Django を採用。
理由はシンプルで、業務システムに必要な「型」が揃っているから。
- 管理画面が標準で付いてくる
- 認証・権限まわりがしっかりしている
- モデルベースの開発がやりやすく、既存の SQL 資産も活かせる
- Python ベースなので周辺ライブラリが豊富
- 学習コストが低い
バックエンドに求められる 「堅牢さ」と「開発効率」 のバランスを Django は満たしていた。
Vue を選んだ理由
フロントエンドは Vue。
React など他の選択肢もあったが、学習コストを重視した。
- 記述がシンプルで理解しやすい
- コンポーネント設計が直感的
特に内製化では 「チームが早く慣れること」 が重要で、その点 Vue は最適だった。
SPA にした理由
刷新の大きな決断のひとつが SPA（Single Page Application）化。
選んだ理由は以下の通り。
-
操作感の向上
ページ全体をリロードせずにコンテンツだけを切り替えるため、ユーザー体験がスムーズになる -
モバイル対応しやすい
スマホやタブレットでもネイティブアプリに近いレスポンス感を出せる -
機能を柔軟に組み合わせられる
カレンダー、チャット、スプレッドシート表示などを同じ画面に統合できる -
API ドリブンな構成に統一できる
Django REST Framework で API を提供し、Vue 側でデータを扱う
→ バックエンドとフロントの役割分担が明確になり、保守性も向上 -
複雑なデータ構造に強い
製造業特有の BOM のような複雑なデータも扱いやすい。これは .NET では限界があった
業務システムはユーザーが一日中操作することも多い。だからこそ 「サクサク動く快適さ」 は思った以上に効果が大きい。
また、エンジニアとしての成長 も理由のひとつ。
.NET クラサバベースの選択肢もあったが、モダンな開発手法の方が市場価値が高く、単純に「やりたい」と思えた。
今後書く予定のこと
この記事は 「導入編」 という位置づけ。今後は以下のトピックを掘り下げていく予定。
- 認証・権限まわりの設計
- チャットや通知機能の実装
- 画面 UI の工夫
- 受注やマスタ管理など、各業務システムの具体的な作り方
まとめ
Django × Vue で SPA 構成 にしたことで、操作感と開発効率が大幅に改善。
今では「使いやすくなった」と現場の声も増えてきている。
このシリーズを通じて、同じようにレガシーシステム刷新を考えている方のヒントになれば幸いです。