hacomono-tech https://blog.hatena.ne.jp/hacomono-tech/ hacomono TECH BLOG https://techblog.hacomono.jp/ こんにちは、フィーチャー部でエンジニアをしている あおさん です。 最近、フロントエンドの実装を行う機会が増えてきました。新しい画面を作るのは楽しいのですが、一つ大きな悩みがありました。それは、実装が進むにつれて1つのコンポーネントファイルがどんどん肥大化していくことです。 気づけば500行、600行……。script / template / styleタグが肥大化し、「さっき直したコードはどこだっけ？」とスクロールを繰り返す時間は、お世辞にも効率的とは言えませんでした。 そんな時、テックリードのみゅーとんさんに設計の相談をしたところ、コンポーネント設計についてのアドバイスをいただきました。… 190 <iframe src="https://hatenablog-parts.com/embed?url=https%3A%2F%2Ftechblog.hacomono.jp%2Fentry%2F2026%2F01%2F27%2F110000" title="巨大なコンポーネントを作らないために - hacomono TECH BLOG" class="embed-card embed-blogcard" scrolling="no" frameborder="0" style="display: block; width: 100%; height: 190px; max-width: 500px; margin: 10px 0px;"></iframe> https://cdn-ak.f.st-hatena.com/images/fotolife/h/hacomono-tech/20260123/20260123115644.png Hatena Blog https://hatena.blog 2026-01-27 11:00:00 rich https://techblog.hacomono.jp/entry/2026/01/27/110000 1.0 100%