CSVを使って数万件の項目を10分でHTMLに変換する裏技

Programming

今回は1000件、何万件の項目があろうが一瞬で綺麗なHTMLに変換する裏技を紹介します。

こういった技は、小難しいプログラミング技術が必要と思われがちですが、今回紹介する方法はCSVとテキストエディターのみを使った方法なので非常に簡単な方法かと思います。

理解出来れば、業務の効率化に使える技なので是非活用下さい。

CSVを使って1000件の項目を10分でHTMLに変換する方法

今回紹介する方法は、以下のようなエクセルの表で1000名分の「名前」や「電話番号」などをまとめたファイルをクライアントから渡されて、この内容をWEBサイトに入れ込む事を想定します。

クライアントからのExcel

一つ一つの項目は、最終的にWEB上で以下のような感じで表示される事を想定します。

想定する表示

貰ったデータは上記のエクセルだけです。

ExcelをHTMLにするための準備をする

ではHTMLに変換する作業を説明します。

まずは上記のExcelをCSVに変換して保存し直して下さい。今回の作業はCSVでなければ不可能です。

先ほど、見せた「想定する表示」のHTMLは以下のようになっています。

想定する表示のHTML

上記のHTMLで、CSVに入力されている可変部分となる項目は除いた、必要な文字列を考えます。

この場合は、「<table> <tbody> <tr> <tb>」「</tb><tb>」「</tb> </tr> <tr> <tb>」…と言った感じです。(後で見本のDLリンクがあります。)

CSVには項目として可変する箇所は入っています。その間の行にHTMLで必要な文字列を入れていきます。

CSVに文字列を入力

全ての列にHTMLで必要な文字列を入れたら、それを全ての行に複製します。するとこんな感じになります↓

文字列を全てに入れる

実際の上のCSVは以下のDLリンクのファイルで確認出来ます。

これをテキストエディタ(visual studio code)で開いて下さい。すると以下のような文字列が出来上がっています。

CSVをテキストエディタで開く

ここからはvisual studio codeでHTMLで不要な文字列を削除/置換作業を行います。置換についての方法は以下の記事で詳しく書いているのでわからない方はこちらを先に読んで下さい。

まずはHTML「”,」の文字列は必要ないので「 」と空白に置換します。それと同じように「,”」と「”」を空白に置換します。

文字列の置換

全て置換が済んだらHTMLで必須な<head>タグの要素を記述して完成です。

完成HTML

実際にCSVの全項目を入れ込んだWEBの表示は以下のようになっています。装飾は一歳加えていないので見た目は寂しい感じですが、この方法を使えば何万件あろうが簡単に一覧をWEBページにする事が出来ます。


以上が「CSVを使って数万件の項目を10分でHTMLに変換する裏技」でした。

何も専門知識がなくても大幅な効率化が出来るので、覚えておいて損はないかと思います。

この記事を書いた人
KEITO

AI × IT × WEB3|関東在住。本職はディレクター 。AIを活用してビジネス開拓。仕事の依頼はTwitterからお願いします。YouTube、Twitter、Instagramもお願い致します。

Programming
この記事を共有する
スポンサーリンク
スポンサーリンク
KT LIFE
スポンサーリンク

暗号資産投資するなら以下

Bybit

国内人気No.1!屈強なサーバー/信頼性抜群!トレーダー御用達の取引所。

通貨数338種以上
レバレッジ最大100倍
現物取引手数料Maker:0%〜0.1%
Taker:0.02%〜0.1%
先物取引手数料Maker:0%〜0.01%
Taker:0.03%〜0.06%
操作性スマホでも取引・入金できる
口座開設簡単に口座開設できる
日本語対応日本語対応あり・JPY利用可
特典下記から登録で初回ボーナスあり
登録リンクBybitへの登録は こちら
招待コード22295
レビュー記事レビュー記事は こちら
BigBoss&CRYPTOS

最大レバレッジ1111倍・日本円換金ルート

通貨数BigBoss:15種以上
CRYPTOS:15種以上
レバレッジ最大1111倍
スポット手数料Maker:0.02%〜0.18%
Taker:0.05〜0.20%
先物取引手数料
操作性スマホでも取引・入金できる
口座開設少し敷居が高い
日本語対応日本語対応あり
特典下記から登録で初回ボーナスあり
登録リンクBigBossへの登録は こちら
招待コード6690951
レビュー記事レビュー記事は こちら
Nexo

高APYでのステーキング&レンディング

通貨数60種以上
レバレッジ
スポット手数料Maker:0.04%〜0.20%
Taker:0.03%〜0.20%
先物取引手数料
操作性スマホでも取引・入金できる
口座開設簡単に口座開設できる
日本語対応日本語対応あり
特典下記から登録で初回ボーナスあり
登録リンクNexoへの登録は こちら
招待コード
レビュー記事レビュー記事は こちら

他おすすめ取引所はこちら

タイトルとURLをコピーしました