React100本ノックやってみた

はじめに

この記事は以下の【Reactアプリ100本ノック】を参考に作成しました。

問題

"Hello World" React コンポーネントの作成

目的

Reactを使用して、画面中央に"Hello World"というメッセージを表示するコンポーネントを作成します。

達成条件

1. Reactの新しいプロジェクトが正しくセットアップされていること。
2. 画面に"Hello World"というテキストが中央に表示されていること。

実際に解いてみた

利用技術

• React
• TypeScript
• Cursor
• TailWindCSS
• Next.js

結果

コード

export default function HelloWorld() {
  return (
    <div className="flex justify-center py-80">
      <a>hello,world!</a>
    </div>
  );
}

感想

中央に表示する際、justify-items-centerとitems-centerの違いの復習になりました。