第１章 やることを整理しておく

1.1 web アプリ開発に挑戦

インターネット黎明期とよばれているころ、webアプリケーションの開発にはプログラミング言語 Perl が活用されることが多く CGI と呼ばれる手法でほとんどの web アプリケーションが開発されていました。

最近(2021年現在)では CGI という手法で開発されることは少なくなり、web アプリケーション自体も複雑化し、 web アプリの作り方を説明、指導する方もなにから説明するべきなのか大変難しくなりました。言語の選択肢として Perl 以外の選択肢も沢山用意されており Perl を活用した事例の紹介も少なくなったような気がします。この資料では言語自体の特性より、web アプリを開発する場合の進め方に着眼点を置き解説とサンプルコードを紹介しています。

1.1.2 この記事の対象者

  • 基本的な web アプリケーションの仕組みは理解できている
  • ある程度のプログラミングの素養がある
  • PC の環境が Mac である

1.1.3 目次

  • 第１回目: やることを整理しておく
  • 第２回目: 開発環境を構築
  • 第３回目: 仕様案を参考に実装
  • 第４回目: 完成品に対しての課題をまとめる
  • 第５回目: 完成品に対してテストコードを実装
  • 第６回目: テストコードと機能追加実装を同時にすすめる
  • 第７回目: 保守と拡張性が高い構造体に変更する準備
  • 第８回目: Mojolicious ベースにリファクタリングをする
  • 第９回目: 新しい機能を追加する

1.2 やることを整理しておく

ソフトウェアの開発を始める時に「要件定義をする」という言葉がでてきます。この要件定義というものがくせものでどういう要件定義が良いのかという話をはじめるとそれだけで一冊の本ができてしまいます。要件定義のやり方もさまざまで作ろうとしているものから具体的な作り方、必要な端末の種類まで事細かに指示がある場合もあり、要件定義をするだけで何ヶ月もかかることもあります。また、要件定義を完璧にやりだすととても時間がかかるので開発作業を進めながらその都度口頭で要件を指示しながら作っていくということが実際の現場でも行われることがあったりします。

要件定義をどこまで細かくやるのかはいろんな意見がありなかなか結論がでませんが、今回は具体的なコーディングの手法などに挑戦したいので、ざっくりとした内容でおさえておきましょう。

1.3 箇条書きにしてイメージをまとめる

  • なにをつくるか
    • 簡易的な掲示板 web アプリ
  • どうつくるか
    • アプリの仕様案
    • 開発環境の案
      • サーバーサイド
        • システム Linux を想定
        • プログラミング言語: Perl
        • web フレームワーク: mojo
      • クライアント
        • web ブラウザ google chrome のみを想定
        • 今回は JavaScript による画面の装飾はしない
      • 開発環境(手元のPC)
        • システム MacOS
        • プログラミング言語: Perl
        • web フレームワーク: mojo
        • docker 環境を活用
    • 実装について参考になりそうな資料を用意

1.4 画面遷移

画面の遷移についてはテキストだけではイメージがやりにくいので手書きのイラストや図形を作成するようなアプリで草案を作っておくとイメージが伝えやすいです。

今回は google スライドで作って jpg で出力してみました。

ここで作っている画面の遷移図と一般的にいうフローチャートとは違うので注意してください。

1.5 アクセスURLと最低限のデータベース設計

  • アプリ名: bulletin
  • URL:
    • GET - `/` - index 掲示板の紹介画面
    • GET - `/list` - list 掲示板の一覧表示
    • GET - `/create` - create 掲示板への書き込み入力画面
    • POST - `/store` - store 掲示板への書き込み実行
  • 公開環境のドメイン: 今回は準備しない
  • データベース: sqlite3
  • スキーマー: 下記を参照
DROP TABLE IF EXISTS bulletin;
CREATE TABLE bulletin (                                 -- 掲示板
    id              INTEGER PRIMARY KEY AUTOINCREMENT,  -- ID (例: 5)
    comment         TEXT,                               -- コメント (例: '明日は晴れそう')
    deleted         INTEGER,                            -- 削除フラグ (例: 0: 削除していない, 1: 削除済み)
    created_ts      TEXT,                               -- 登録日時 (例: '2021-02-26 17:01:29')
    modified_ts     TEXT                                -- 修正日時 (例: '2021-02-26 17:01:29')
);

1.6 まとめ

  • 実装を始まる前に最低限度のやることを書き出しておいたほうが結果的に実装も早く終わる
  • 仕様に関するメモは簡潔にまとめて README.md という名前のファイルに残しておくとよい
  • 今回の仕様のまとめは下記の github の参考資料でみれます
  • https://github.com/Becom-Developer/beginning-mojo/tree/master/chapter1

1.7 次回

実装を始める前になにをするのか、最低限度のことをテキストにまとめておく作業は面倒かもしれませんが、やっておく習慣をつけておくと良いと思います。

次回は今回の開発をすすめるためのローカル開発環境の構築を進めたいと思います。