@niftyメールデコード活用CGI

フローチャートの書き方

 それがたとえどんなに簡単なプログラムであっても、フローチャートを書いてとりかかることはとても重要です。
 私がプログラムを書き始めた当初は、なんどもテストしては書きなおす作業の 繰り返しでプログラムを作っていましたが、それではどうしてもバグが紛れ込むので、最近は、 相当細かい段階までフローチャートを書くことが多くなりました。
 いったん、フローチャートに書き出しておくと、実際のプログラム作成が効率的になり、それにかかる時間が大幅に節約されるだけでなく、ミスが少なくな り、かつ他の言語に移植するのも簡単になります。

 フローチャートには、JISで決まった書き方が決まっているので、他人と開発を共有する場合は、そのルールに従わなければならないのですが、自分で書く 時はあまりこだわらなくて良いでしょう。主に使う記号は次のようなものです。(背景がこの色のもの は重要!!)
重要度1
重要度2
重要度3
重要度4
重要でない
 自分だけがわかれば良いのなら、最低限重要度1だけでもフローチャートは書けます。
Terminal
端末
フローチャートの最初と最後など
Preparation
準備(前処理)
Input/Output
入出力
 ファイルへの書き出しや読みこみ
Connector
結合子(コネクター)
ページ内での接続に
Process
処理
計算や代入など
Display
画面
(ディスプレイ)
Off-Page_Connector
他のページコネクタ
Subroutine
定義済み工程
Manual_Input
手動入力
キーボードからの入力など
Decision
判断
Begin_Loop
ループの開始
Document
文書


End_Loop
ループの終わり
OnlineStorage
オンライン記憶
 フローチャートの書き方は、このページの目的ではないのでより知りたい方は、下記のページなどを参考にしてください。

自分のしたいことを整理する。

 まず、「送信前に確認画面を表示するCGI」について、それが何をするものなのかを正しく理解しておきましょう。
  1. 訪問者にフォームに記入して送信してもらう。
  2. それを受け取ったら、そのデータを検証しエラーの有無を確認する。
    • エラーがあれば、元のフォームを出力する。
    • エラーが無ければ、
      1. そのデータを元に実際に送信するメールの形に整形し画面に表示する。
      2. 同時に、[@nifty:@homepage:メールデコード]用のフォームを隠しフィールドで作成する。

利用者から見た操作

処理
説明
処理のフローチャート
  1. ブラウザのURL欄にURLを入力、またはリンクをクリック

    3
  2. 入力用フォームが表示される。


  3. 入力

    送信ボタンをクリック

  4. 画面が表示される。



  5. それが、最初の登録用フォームなら(3)に戻る。
    確認画面なら、次へ



  6. 内容を確認して
  7. 書きなおしたければ[戻る]をクリック
    よければ[送信]をクリック

  8. 完了画面が表示される。

プログラムの処理

フォームを利用する立場から見た処理の流れを元に、プログラムの処理をフローチャートに書き出して見ます。
処理
説明
プログラムのフローチャート(概要)
  1. HTTPサーバーから起動される。



  2. 標準入力・QUERY_STRINGの値を$bufferに格納



  3. $bufferの有無
    • $bufferが何も無ければ初期画面用データの作成(6)へ
    • $bufferがあれば、エラーチェック(5)へ

  4. エラーチェック
     訂正の場合もエラーとして処理する。
     入力をチェックし、エラーの数をカウントする。

  5. エラーがあれば、初期画面用データの作成(6)ヘ、なければ、確認画面用データの作成(8)へ

  6. 初期画面用のデータを作成

  7. 初期画面(フォーム)を表示。


  8. 確認画面用データの作成

  9. 確認画面の表示
    確認画面のHTMLは、@nifty:メールデコードへの送信フォーム
 
copyright: Iruka