フロントエンド– tag –
-
Column
EJSとは? LaravelのBladeを知ってる人向けに30秒で理解するNode.jsテンプレートエンジン
「Node.jsでBladeみたいにHTML書きたいんだけど」 LaravelでBlade(.blade.php)を使っていた人がNode.jsに来ると、「HTMLにサーバー側の変数を埋め込むやつ、Node.jsだと何使うの?」と迷いますよね。 答えの一つがEJS(Embedded JavaScript)です。やっ... -
Column
Chrome検証ツールの文字が小さい(大きい)? Cmd+0でズームを一発リセットする方法
「検証ツールの文字、なんか小さくない…?」 Chromeの検証ツール(DevTools)を開いたら、パネル内の文字がやたら小さい。あるいは逆に巨大になっている。Elements、Console、Networkタブの中身が読みづらくて作業にならない。こんな経験、ありませんか? ... -
Column
JestとVitest、どっちを選ぶ?プロジェクト別おすすめテストフレームワークの選び方
「テスト入れたいけど、JestとVitestどっちがいいの?」 新しいプロジェクトにテストを導入しようと調べたら、Jestの記事もVitestの記事も出てくる。「Vitestの方が速いらしい」「でもJestの方が情報が多い」「結局どっち?」と迷って、テスト導入自体が後... -
Column
useCallbackとは?Reactの再レンダリング地獄を防ぐメモ化フックの使いどころ
「子コンポーネントが毎回再レンダリングされるんだけど…」 Reactで開発していて、React DevToolsのプロファイラを開いたら子コンポーネントが毎回光ってる。React.memoで囲んだのに効いてない。「なんで?」と調べてみたら、親から渡しているコールバック... -
Product Research
Vite+ – Web開発の統合ツールチェーンでランタイムとパッケージ管理を一元化
Vite+は、ランタイム、パッケージマネージャー、フロントエンドスタックを統合管理する新しいWeb開発ツールチェーン。複雑な開発環境のセットアップをシンプルなコマンド1つで実現し、開発者の生産性を飛躍的に向上させます。 -
Column
Next.jsとVercelならサーバーいらない?サーバーレスの仕組みを解説
「Next.jsとVercelならサーバーいらない」と聞いたけど、本当にサーバー管理が不要なの?サーバーレスの仕組みと実際の構成、従来のサーバーとの違いを具体例で解説します。 -
Column
BFFは本当に便利?フロントエンドエンジニアがサーバサイドを触る危険性
「フロントエンドしか分からない人がサーバサイドをさくっと弄れてしまうBFFが健全とは全く思わないんですよね」 BFF(Backend For Frontend)パターンは、フロントエンドとバックエンドの橋渡し役として注目されていますが、この発言は現場で起きている重... -
Column
MUI(Material-UI)の使い方がわからない?3ステップで理解する導入ガイド
「Reactでアプリを作っているけど、CSSを自分で書くのが面倒…」「デザインに統一感がなくて、なんだか素人っぽい見た目になる…」そんな悩みを抱えていませんか? Reactの開発では、機能実装だけでも大変なのに、それに加えてデザインまで考えるのは本当に... -
Product Research
thefrontkit – AI・SaaS開発に特化したデザイン+コードUIキット
thefrontkitは、デザインとコードが一体化したAI・SaaS向けUIキット。Next.js+Tailwindで実装済み、トークン駆動のテーマシステムとアクセシビリティを標準装備。AI UXとSaaS Starterの2つのフルキットで、プロダクトを迅速に構築できます。 -
Column
Motion(旧Framer Motion)で作る!Reactマイクロインタラクション6選【コピペで実装】
Reactで動きのあるUIを作りたいけど、「アニメーションの実装って難しそう…」「CSSだけだと複雑な動きができない…」と悩んでいませんか?そんな課題を解決するのがMotion(旧Framer Motion)です。 Motionは、Reactアプリケーションに滑らかなアニメーショ...
12