Web制作の実務でコーディングをしています。WordPress でのサイト構築が中心で、 いまは React / TypeScript / Next.js で個人開発をしながらフロントエンドへ領域を広げているところです。

• 制作会社との業務委託で、コーポレートサイト・LP・WordPress サイトを 30 件以上担当
• CSS 設計は FLOCSS / BEM。全案件でレスポンシブ対応
• 2026 年から React / TypeScript を学習し、個人開発アプリを公開しました

パワーリフティング向けの重量計算アプリ。目標重量から、バーベルの片側に着ける プレート構成を計算します。自分が競技をしていて、実際に困っていたことから作りました。

▶ 使ってみる

React 19 / TypeScript / Vite / Tailwind CSS v4 / Vitest / GitHub Actions / Vercel

企画から公開まで 7 日。設計上の判断とその理由は README に書いています。

• 計算ロジックを UI から分離した純粋関数として実装し、Vitest で 32 ケースをテスト
• 入力の刻みを固定値ではなく在庫から導出し、設備が違うジムでも正しい答えを出す設計
• 仕様は IPF Technical Rulebook（英語・44 ページ）を直接読んで確定
• Lighthouse 4 項目 100 点 / 初回ロード約 68.5kB

個人サイト（ハブ）。Bento Grid レイアウト・ダークモード対応・JavaScript なし。

ポートフォリオサイトの自作 WordPress テーマ。FLOCSS 設計 / SCSS / ACF。

実務 — HTML / CSS / Sass(SCSS) / JavaScript / PHP / WordPress（オリジナルテーマ・ACF・CPT UI）

個人開発 — TypeScript / React / Next.js(App Router) / Tailwind CSS / Vite / Vitest / Vercel

開発環境 — Git / GitHub Actions / ESLint / Prettier / husky

Next.js の App Router と Supabase を使った、認証つきのアプリを制作中です。 学習の記録は Zenn とブログに残しています。