Skip to content

Repository files navigation

Excel VBA ポートフォリオ

副業でのExcelマクロ(VBA)案件——修正・解読(文書化)・新規開発——の受注に向けて制作した、VBA専用ポートフォリオです。 「マクロが動かない」「エラーが出る」「作った人が退職した」という発注者の困りごとを入口に、納品の約束(不安つぶし)→ 事例 → 納品文書の実物見本 → 料金 → 進め方の順で構成しています。

トップ(ハブ)ページ index.html から、各コンテンツへ相対パスでアクセスできます。 公開URLの正は https://portfolio.tegumi.dev/ です(旧URL hayaboosan.github.io/portfolio/ は301リダイレクトで維持)。

⚠️ VBAの事例・納品文書サンプルの題材は、すべてポートフォリオ用に自作した架空のマクロです。掲載している画面・数値は見本・想定値であり、実際の取引実績ではありません。実際のお客様のファイル・データは一切使用していません。


ハブページの構成(VBA-first)

  1. ヒーロー:事故ワード導線(マクロが動かない/エラーが出る/作った人が退職した)→「コードを読んで、壊さず直します」
  2. 納品の約束(最重要):①ソースはロックなし・コメント付き ②既存機能は変更せず追加のみ ③納品後14日間の同一原因不具合は無償対応 ④操作手順書つき(動画は準備中) ⑤マクロ警告(Mark of the Web)の解除手順書つき
  3. 事例:修正・復旧(vba-case-fix/)/新規開発(vba-case-build/)/解読・文書化(vba-docs/sample-report.html
  4. 納品文書見本:納品5点セットの実物見本(vba-docs/
  5. 料金の目安:解読10,000円〜・修正5,000円〜・新規開発は規模見合い(内容確認のうえ無料見積もり)
  6. 進め方:非同期テキストのみ・購入前に見積もり確定・仮払い後着手・機密データはダミー化依頼
  7. Python 業務自動化:提案可能スキルとして納品文書サンプル(python-docs/)への導線

Excel VBA コンテンツ

事例 — vba-case-fix/vba-case-build/vba-works/

  • vba-case-fix/:修正・復旧のデモ事例。実行時エラーで止まった架空の請求書作成マクロを、原因特定 → 修正 → 動作確認の流れで復旧するまでを見せる
  • vba-case-build/:新規開発のデモ事例。CSV取込 → 集計 → 帳票出力をボタン1つにまとめる架空の月次売上集計ツール
  • vba-works/:事例で使用する自作マクロ一式(架空題材)

納品文書サンプル — vba-docs/

「直して終わり」にしない納品スタイルを示す納品文書の実物見本を収録しています。

  • 解読レポートsample-report.html):「作った人が退職して誰も中身が分からない」マクロを読み解き、ボタンと処理の対応・処理の流れ・変えてよい設定/触ってはいけない箇所・気づいたリスクを日本語1枚に文書化
  • 変更内容書sample-changelog.html):エラー修正の納品時に添えるA4 1枚の報告書。原因を非エンジニア向けの言葉で説明し、変更箇所・影響範囲・スコープ外を明記
  • 題材は見本用に自作した**架空の「請求書作成マクロ」**で、実際の顧客ファイル・データは一切使用していません
  • 文書ページは印刷用CSS(@media print)つきで、そのままA4のPDFとして出力できます

Python 業務自動化の納品文書サンプル — python-docs/

Excel/CSVの集計・レポート作成などの定型作業をPythonスクリプトで自動化する際の、仕様書spec.html)と実行手順書run-guide.html)の見本2点です。題材は見本用に自作した架空の「複数店舗 日次売上集計スクリプト」で、実際の顧客ファイル・データは一切使用していません。 (ハブページの「Python — 業務自動化」セクションからリンクしています)


アーカイブ

  • 実在サイトの改修事例:case-study-petit-chaton/(Vue/Vite SPA → Astro 静的HTML化。実測でLighthouse改善。Web制作時代の実施内容として、フッターの「アーカイブ」からのみリンク)
  • 旧Web制作作品(LP5作品・架空の改修事例2件・小修正/検索対応デモ・見積もりシミュレーター・検索一覧UI)は、2026-07-02のVBA専用化に伴いリポジトリから削除しました(gitの履歴には残っています)。

技術構成

  • 言語 / 構成: HTML5 + CSS3 + 素の JavaScript(ES5〜ES6相当)
  • フレームワーク / ライブラリ: 不使用(React・Vue・jQuery・Bootstrap 等は一切なし)
  • ビルドツール: なし(バンドル・トランスパイル工程なし。ファイルを開けばそのまま動作)
  • CSS設計: BEM風のクラス命名、CSS カスタムプロパティ(変数)でテーマ配色を管理、clamp() による流体タイポグラフィ
  • 配色: アクセントは vba-docs/ と同系のExcelグリーン(#1d6f42 系)
  • レイアウト: CSS Grid / Flexbox によるレスポンシブ対応(スマートフォン〜ワイド画面)
  • アクセシビリティ: スキップリンク、ARIA属性、キーボード操作対応、prefers-reduced-motion への配慮
  • フォント: Google Fonts(Shippori Mincho B1 / Zen Kaku Gothic New / Noto Sans JP など)
  • テーマ: ハブページはダーク/ライトの配色切り替え(localStorage 保存・OS設定連動)に対応

ディレクトリ構成

portfolio/
├── index.html                 ← VBA専用ポートフォリオのトップ(ハブ)ページ(単一ファイル完結)
├── README.md                  ← このファイル
├── sitemap.xml                ← サイトマップ(正URL=portfolio.tegumi.dev)
├── CNAME                      ← カスタムドメイン設定(portfolio.tegumi.dev)
├── assets/og/                 ← 各ページの OGP 画像(自作PNG)
├── vba-case-fix/              ← 事例①:修正・復旧(架空の請求書作成マクロ)
├── vba-case-build/            ← 事例②:新規開発(架空の月次売上集計ツール)
├── vba-works/                 ← 事例で使う自作マクロ一式(架空題材)
├── vba-docs/                  ← Excel VBA 保守の納品文書サンプル
│   ├── index.html             ← サンプル一覧・納品パッケージの全体像(単一ファイル完結)
│   ├── sample-report.html     ← 見本①:解読レポート(架空の請求書作成マクロ)
│   └── sample-changelog.html  ← 見本②:変更内容書(A4 1枚・印刷CSSつき)
├── python-docs/               ← Python 業務自動化の納品文書サンプル
│   ├── index.html
│   ├── spec.html              ← 見本①:仕様書(架空の日次売上集計スクリプト)
│   └── run-guide.html         ← 見本②:実行手順書(セットアップ〜トラブル対処)
└── case-study-petit-chaton/   ← アーカイブ:実在サイトの改修事例(Web制作時代)

ハブページ index.html は CSS / JS をすべて <style> / <script> に内包した単一ファイル完結です。vba-docs/ python-docs/ 内の各文書サンプルも同様に単一ファイル完結です。


ローカルでの見方

方法A:ファイルを直接開く(最も手軽)

portfolio/index.html をダブルクリック、またはブラウザにドラッグ&ドロップするだけで表示できます。 各コンテンツへのリンクは相対パス(./vba-docs/ など)のため、そのまま遷移できます。

方法B:ローカルサーバーで開く(推奨)

file:// ではなく http:// で開くと、より本番に近い挙動で確認できます。portfolio フォルダの中で以下のいずれかを実行してください。

# Python(標準で入っていることが多い)
python -m http.server 8000
#  → ブラウザで http://localhost:8000/ を開く

# Node.js(npx 経由・インストール不要)
npx serve .
#  → 表示された http://localhost:3000/ などを開く

# VS Code を使う場合
# 拡張機能「Live Server」を入れ、index.html を右クリック →「Open with Live Server」

PowerShell(Windows)でも同じく python -m http.server 8000 で起動できます。


デプロイ手順

ビルド不要の静的サイトとしてそのまま公開できます。現在は GitHub Pages + カスタムドメイン(CNAME=portfolio.tegumi.dev)で運用しています。

GitHub Pages

  1. main ブランチへ push すると自動で反映されます。
  2. 初回設定は GitHub リポジトリの Settings → PagesDeploy from a branchmain / / (root))を選択。
  3. カスタムドメインは Settings → Pages → Custom domainportfolio.tegumi.dev を設定(リポジトリ直下の CNAME ファイルと一致させる)。
  4. 旧URL https://hayaboosan.github.io/portfolio/ はカスタムドメインへ301リダイレクトされます。

各コンテンツは https://portfolio.tegumi.dev/vba-docs/ のようにサブディレクトリ配下で公開されます。本ポートフォリオのリンクはすべて相対パス(./vba-docs/ など)なので、そのまま動作します。


ライセンス / 注意事項

  • 本リポジトリはExcelマクロ(VBA)の修正・解読・開発のスキルを示すためのポートフォリオです。
  • vba-case-*/ vba-works/ vba-docs/ python-docs/ に掲載しているマクロ・スクリプト・データはすべて見本用に自作した架空の題材であり、実際の顧客ファイル・データは一切使用していません。掲載している数値は見本・想定値です。
  • アーカイブ内の case-study-petit-chaton/ は実際に公開・運用されているサイトでの実施内容です。
  • フォントは Google Fonts の規約に従います。

About

Web制作ポートフォリオ(架空ブランドのLP4本+ハブ+サイト改修事例 / バニラHTML・CSS・JS)

Topics

Resources

Stars

0 stars

Watchers

0 watching

Forks

Releases

Packages

Contributors

Languages