rn-7-1. ViewとTextの基本

ViewとTextコンポーネントの基本を学びます

React Native - 第1章: React Native基礎 - コンポーネントとスタイリング

📚

課題：ViewとTextの基本を学ぼう

React Nativeでは、ViewとTextが最も基本的なコンポーネントです。 Viewはコンテナ（箱）、Textはテキスト表示に使います。

やること

1.Viewでコンテナを作る
2.Textで「Hello, React Native!」を表示
3.追加で2つのTextを表示する

ViewとTextの使い方

React Nativeのコンポーネントをインポートします：

import { View, Text } from 'react-native';

Viewはコンテナ、Textはテキスト表示に使います：

<View>
  <Text>こんにちは</Text>
  <Text>React Native</Text>
</View>

ポイント：React Nativeでは<div>の代わりに<View>、テキストは必ず<Text>で囲みます。

期待される出力

Hello, React Native!
これは私の最初のアプリです
React Nativeは楽しい！

import { View, Text } from 'react-native';

export default function App() {
  return (
    <View>
      {/* ここに3つのTextを追加してください */}
      {/* 1. Hello, React Native! */}
      {/* 2. これは私の最初のアプリです */}
      {/* 3. React Nativeは楽しい！ */}
      
    </View>
  );
}

Open Sandbox

← 前のレッスン: 6-4. フォームの型を総合的に定義する

次のレッスン: rn-7-2. StyleSheetの使い方 →