オフラインイベントといったらネームプレートだ！というわけで、Chatgptさんを使いつつ、今度のイベント用名刺カードを作った。

完成系

手順

名刺テンプレートのデザインが必要だったので、下記で掲載codepenを利用させてもらった。

HTML/CSS3/JSだけで(名刺|名札カード)を量産するテンプレートを作った #JavaScript - Qiita

Codepenをサインアップして、https://codepen.io/kohki-shikata/pen/NBBZyVをForkする。

一番右ペインにあるdata = をTechplayの入場者データに置き換えればよいので、入場者リストをCSVでダウンロードする。

徐ろにChatgptを開いて上記のdata = のフォーマットに合うようにデータ抽出をして、クリップボードにコピペしてもらうコードを生成する。

結果が下記。今回はTechplayのアンケートで氏名所属名職種などをきいたので、それをpersonのところで選択して抽出する。

import csv
import subprocess

# CSVファイルからデータを読み込む関数
def read_csv(filename):
    data = []
    try:
        with open(filename, newline='', encoding='CP932', errors='ignore') as file:
            reader = csv.DictReader(file)
            for row in reader:
                person = {
                    "name": row.get('氏名', ''),
                    "position": row.get('所属名', ''),
                    "email": row.get('職種', ''),
                    "phone": row.get('受付番号', '')
                }
                data.append(person)
        return data
    except FileNotFoundError:
        print(f"Error: {filename} not found.")
        return []

# CSVファイルのパス
csv_file = 'data.csv'

# CSVファイルからデータを読み込む
data = read_csv(csv_file)

# JavaScriptの変数dataの文字列を作成
js_data = "var data = [\n"
for person in data:
    js_data += "  {\n"
    js_data += f"    name: '{person['name']}',\n"
    js_data += f"    position: '{person['position']}',\n"
    js_data += f"    email: '{person['email']}',\n"
    js_data += f"    phone: '{person['phone']}'\n"
    js_data += "  },\n"
js_data += "]"

# クリップボードにデータを保存
process = subprocess.Popen('pbcopy', env={'LANG': 'en_US.UTF-8'}, stdin=subprocess.PIPE)
process.communicate(js_data.encode('utf-8'))

print("Data has been copied to the clipboard.")

pythonで上記コードを実行するとクリップコードに保存されるので、dataの部分だけ上書きすれば良い。 dataの配列データが多い場合は表示がきれいにできないので、適当な数に減らして何回か分けてください。

CodepenをDebugモードで開き、印刷をすればできあがり。