Custom components in React Native - Cheat Sheet & Quick Revision

Recall & Review

beginner

What is a custom component in React Native?

A custom component is a reusable piece of UI built by combining React Native elements or other components. It helps organize code and reuse UI parts easily.

beginner

How do you create a simple functional custom component in React Native?

You create a function that returns JSX. For example: <br><pre>function MyButton() {<br>  return (<br>    <Button title="Click me" /> <br>  );<br>}</pre>

beginner

Why use props in custom components?

Props let you pass data or settings into a component, so it can show different content or behave differently each time you use it.

beginner

What is the benefit of breaking UI into custom components?

It makes your app easier to read, maintain, and test. You can reuse components in many places without rewriting code.

beginner

How do you use a custom component inside another component?

You import or define the custom component, then use it like a tag in JSX. For example: <br><pre>&lt;MyButton /&gt;</pre>

What does a React Native custom component return?

A Database queries

B Plain text only

C CSS styles

D JSX elements

Custom components return JSX elements that describe the UI to render.

How do you pass data to a custom component?

A Using CSS classes

B Using global variables

C Using props

D Using HTML attributes

Props are the way to pass data into custom components in React Native.

Which of these is a correct way to define a custom component?

A var MyComp = 5;

B function MyComp() { return <View></View>; }

C const MyComp = 'Hello';

D let MyComp = true;

A custom component is a function returning JSX, like a View element.

Why should you create custom components?

A To reuse UI parts and keep code clean

B To make the app slower

C To avoid using props

D To write more code

Custom components help reuse UI and organize code better.

How do you include a custom component named MyButton in JSX?

A <MyButton />

B <mybutton />

C <button />

D <Mybutton />

Component names must start with uppercase and used as .

Explain how to create and use a custom component in React Native.

Think about making a small reusable UI piece.

Why is breaking your app UI into custom components helpful?

Imagine building with Lego blocks.