# Intro to JSX

## Basics

Consider the following:

```jsx
const element = <div>Hello World</div>;
```

It looks like a mix of javascript and HTML, and it is called JSX, which you will see a lot in React based applications. It contains an opening tag and a closing tag.

In React Native, the idea behind it the same, except the syntax might be slightly different:

<pre class="language-jsx"><code class="lang-jsx"><strong>import { Text } from 'react-native';
</strong>
const element = &#x3C;Text>Hello World&#x3C;/Text>;
</code></pre>

In this example, we declare a variable name and embed it inside the JSX element with curly brackets:

```jsx
import { Text } from 'react-native';

const name = "Justin";
const element = <Text>Hello {name}</Text>;
```

JSX can contain children:

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

const name = "Justin";

const element = (
    <View>
        <Text>Hello {name}</Text>
        <Text>Nice to meet you!</Text>
    <View>
);
```

## Components

Components are independent and reusable bits of code.

<pre class="language-jsx"><code class="lang-jsx">import { Text } from 'react-native';

const TestComponent = () => {
<strong>    const name = "Justin";
</strong><strong>
</strong>    return (
        &#x3C;View>
            &#x3C;Text>Hello {name}&#x3C;/Text>
        &#x3C;/View>
    );
}
</code></pre>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://wiki.nushackers.org/orbital/react-native/intro-to-jsx.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.