Angularを使ってボードゲームの得点計算ツールを作った話
#Angular
Angular v21とSignals・Tailwind CSSで、ボードゲーム「世界の七不思議」の得点計算ツールを作った記録。状態管理の設計と、使って得られた知見、AIフレンドリーな雛形への驚きをまとめている。
生成AIのコード品質とレビュー負担について考える
#生成AI生成AIが書くコードの品質とレビュー負担について整理した考察。レビューが重くなる理由と品質の捉え方の違いを分析し、出力が安定するドキュメントを共有して仕様を明確にしてからAIに書かせる進め方を提案している。
Figma MCP試してみる
#生成AIFigma MCPのデスクトップサーバを有効にしてClaude Codeに接続し、Figmaのデザインから実装させる手順を試した記録。AngularとTailwind CSSのプロジェクトで見た目の修正も試し、使用感をまとめている。
styled-componentsからTailwindCSSに移行する際に困ったこと
#作業ログstyled-componentsがメンテナンスモードになったため、Next.jsのプロジェクトをTailwind CSSへ移行した際に困った点の記録。tailwind.cssが404になる問題やテキスト指定が効かない問題の原因と対処をまとめている。
MCPについて調べてみる
#生成AIMCP(Model Context Protocol)とは何かを調べ、MCPサーバを実際に作ってClaudeから使ってみた記事。発生した問題と動作確認の結果を含め、思ったより簡単にサーバを立てられたという感想をまとめている。
VSCode拡張機能「Cline」を試してみる
#VSCode#生成AIClaudeをVSCode内で使える拡張機能Clineを試した記事。インストールとAPIキーなどの事前準備、コード生成・修正やドキュメント作成の使い方、実際に記事を書かせた結果と利点・制限をまとめている。
生成AIについて調べてみる
#作業ログ生成AIについて、ChatGPT・Claude・GeminiなどのテキストAI、DALL-E・Midjourneyなどの画像AI、VALL-Eなどの音声AIの代表的なサービスをざっくり調べてまとめた記事。
Next.jsでbetterなディレクトリ構成を考える
#Next.jsNext.jsアプリのディレクトリ構成を、Bulletproof Reactや4層Layered Architectureを参考に検討したメモ。pages・features・componentsなど各ディレクトリの役割と配置ルールを整理している。
Tauriを試してみる
#Rust#AngularRust製フレームワークTauri 1.0を試した記録。create-tauri-appとAngularでプロジェクトを作成して起動し、ウィンドウサイズの変更やRustの関数をJSから呼び出す方法、開発ツールのエラーを試している。
Next.js+linariaを試してみる
#Next.jsNext.jsとCSS-in-JSライブラリlinariaを組み合わせて試した記事。インストール時に発生したエラーの原因と対処、linariaでのスタイリング、styled-componentsとの比較やIE11対応の注意点をまとめている。
Reactでa11y検証ツールを試してみる
#ReactReactでa11y検証ツールを試した記事。eslint-plugin-jsx-a11y、@axe-core/react、storybook-addon-a11y、Lighthouseの導入方法と所感をまとめ、定期的な計測にはLighthouseが良さそうと結論している。
JSで画像を扱うときのメモ
#JavaScript#ReactReactで画像ファイルを扱う方法のメモ。input要素のファイル選択から値の取得、FileReaderを使ったbase64(データURL)への変換、取得時の注意点までをサンプルコード付きでまとめている。
