ひょんなことから、とある団体の中国支部のWeb担当をお引き受けすることになりました。勿論、無報酬のボランティアとしてです。ホームページ作成にあたっては、ホームページビルダーなどの有償アプリは使わないで、テキストエディターのみでゴリゴリ書いていく手法です。こんな方法でも、Bootstrap5の恩恵によりシンプルでレスポンシブルなWebデザインが作成できて、追加や修正などの編集が簡単にできます。しかし、年間行事予定表や役員名簿などの表を作成する時、テキストエディターだけで入力するのは大変手間がかかる作業です。いちいちtrタグやtdタグなどを付けなければならないからです。こんな面倒なことを辛抱強くやっていると間違いの元なので、CSVファイルからHTMLファイルに変換するソフトがあれば便利なのになぁ・・・と思いました。
ネットでググってみると、そういうサービスを提供しているサイトが幾つか見つかりました。しかし、外国のサイトのためか、日本語(Shit-JISによるカナ漢字)のデータは化けてしまいました。仕方がないので、自分で作ることにしました。作成にあたり、仕様を次のように設計しました。
プロジェクト名:
csv2html
機能:
表計算ソフトで作成したcsv形式のデータをhtmlファイルに変換する。
使用目的:
ホームページを作成する際に、表を手入力で作成するのは手間がかかるので、一括で変換して、コピペしてホームページを作成する。
仕様:
csvファイルを入力とし、htmlファイルを出力する。
入力ファイル名の拡張子はcsvとし、出力ファイル名は入力ファイル名の拡張子をhtmlに付け替えたものとする。
htmlファイルには、ブラウザで表示し確認できるようにBootstrap5に対応したヘッダを付ける。
csvファイルには、Shift-JISのカナ漢字が含まれることとする。(Winddows標準)
htmlファイルは、utf-8形式のデータに変換されることとする。
csvファイルのカラムはコンマで区切られることとし、それ以外(;やスペース)はデリミタとして認識しないこととする。
csvファイルのカラムはダブルクオーテーションで囲まないこととする。
csvファイルの1行目には、カラム名がカラム数だけ記述されていることとする。
開発環境:
Visual Studio Community 2022 VB.netを使用する。
デバッグし易いように次のようなフォームにしました。スクロール可能なテキストボックスに変換後のhtmlファイルが表示されます。デバッグ時には、ここで内容を確認しました。
上の図は実際に動作させた時のスナップショットですが、入力ファイルである「表のサンプル.csv」はOpenOfficeで作成したものです。OpenOfficeでは次のように表示されています。
変換後の「表のサンプル.html」をEdgeで表示すると次のようになりました。
実際にホームページを作成する時には、htmlファイルの一部(表の部分)をコピーしてターゲットのhtmlファイルにペーストします。
VB.netのソースコードを、このブログに掲載しようと試みたところ、ダブルクオーテーションで囲んだ部分が消失するなどのトラブルがあったので、代わりに私のHPのプログラミングチャンネルに記事を作成して掲載しました。製作メモの中にソースコードを掲載しています。宜しければご覧ください。なお、exeファイルを含むプロジェクトファイルもダウンロードできるように掲載していますが、お使いのブラウザがダウンロードをブロックするかもしれませんので、悪しからず。
※コメント投稿者のブログIDはブログ作成者のみに通知されます