Rirekisho Studioを公開しました｜履歴書をブラウザで作り、PDFで保存する

Rirekisho Studioは、日本向けの履歴書をブラウザで作成するWebアプリです。氏名や学歴・職歴を入力し、プレビューを確認しながら、A4縦2ページまたはA3横1枚のPDFにできます。登録なしで使えます。

アプリ： https://resume.nuconeko-garden.com/

入力から提出用PDFまで

履歴書には、基本情報、学歴・職歴、資格、志望動機、本人希望欄など、整理する項目がいくつもあります。Rirekisho Studioでは入力画面とプレビューを行き来できるようにし、書いている内容が紙面でどう見えるかを確かめながら進められるようにしました。

西暦・和暦、明朝・ゴシック、項目ごとの文字揃えを切り替えられます。証明写真はJPG・JPEGを取り込み、切り抜きや回転をアプリ内で行えます。必要な人には、就労上の配慮事項をまとめる別紙も用意しました。応募先に合わせて書類を複製し、内容を調整することもできます。

PDFは画面の見た目をそのまま保存するだけではありません。A4の固定ページから内容がはみ出す場合には出力を止め、途中で切れた書類を作らないようにしています。紙にしたときの読みやすさまで、入力体験の一部として考えました。

入力した個人情報の行き先

氏名、住所、電話番号、写真、配慮事項を運営者のサーバーへ保存しない設計です。入力と写真の処理、PDFの生成は利用者のブラウザで行います。Cloudflareから配信されるのはアプリを動かすファイルです。

端末保存は利用者が明示的に有効にした場合だけ使い、履歴書のデータをブラウザのIndexedDBへ保存します。localStorageには保存への同意などの設定を置き、履歴書本文は入れません。ただし、郵便番号から住所を調べる操作を選ぶと、7桁の郵便番号を外部サービスのzipcloudへ送ります。この操作には通信が必要です。

編集を続けるためのバックアップ

PDFは提出する書類、JSONは後から編集を再開するためのデータとして使い分けられます。現在の書き出し形式はschema v2で、従来のschema v1も読み込めます。JSONの書き出しでは、証明写真は標準では含まれません。必要なデータが揃っているか、書き出し時に確認してください。

JSONは暗号化されていない平文ファイルです。保存先や共有相手には注意が必要です。また、ブラウザ内のデータはサイトデータの削除や端末の故障で失われる可能性があります。継続して使う書類は、必要に応じてPDFとJSONを手元に残してください。

作り方と確かめ方

画面はReact 19、TypeScript、Viteで構成し、プレビューからhtml2canvasとjsPDFでPDFを生成しています。入力、保存と読み込み、PDF出力、画面幅に応じた表示に加え、個人情報の保存・通信の境界を自動テストで確かめています。

まず基本情報を入力し、A4とA3のプレビューを切り替えてみてください。保存を続ける場合は端末保存の説明を読んで有効にし、PDFとJSONの役割を確認すると、書類を作って管理するまでの流れを試せます。

使い方： https://resume.nuconeko-garden.com/manual/
作品紹介： https://nuconeko-garden.com/works/