Final Project Assessment INTRODUCTION

FINAL COURSE QUIZ: REACT NATIVE

1. Observe the code below and select the statement that best describes it.

<Text style={{ fontWeight: 'bold' }}>
I am bold
<Text style={{ color: blue }}>and blue</Text>
</Text>

2. Select the performant components that are used for the lazy rendering of items on the screen.

3. Which of the following values to the resizeMode prop repeats the image to cover the frame of the view? Select the correct option.

4. Which of these are React Navigation’s minimum requirements to be set up successfully? Select the correct option.

5. Select all the keyboard types that are supported cross-platform by the TextInput component.

6. Which options would you use to configure where the drawer opens from in Drawer Navigation? Select the correct answer.

7. Which of these statements about React Native are true? Select all that apply.

8. On the iOS platform, TextInput provides an option to provide a delete or clear button within the text input box, which can be used to clear the text within it, as shown below. 

Which of the following props can achieve that?

9. Observe the emulator below. Which component would produce this output on the emulator? Select the correct option.

10. Which of these hooks are part of the core React Native package? Select all that apply.

11.  Which of the following statements are true about the Pressable component? Select the correct option.

12.  Observe the code below and select the statement that best describes it.

import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import WelcomeScreen from './Screens/WelcomeScreen';
import MenuScreen from './Screens/MenuScreen';


const Stack = createNativeStackNavigator();


export default function App() {
  return (
    <NavigationContainer>
      <Stack.Navigator
        <Stack.Screen name="Welcome" component={WelcomeScreen} />
        <Stack.Screen name="Menu" component={MenuScreen} />
      </Stack.Navigator>
    </NavigationContainer>
  );
}

13. The View component is a core component of React Native; it can have many children of any type. Select the correct option.

14. If you are using Expo CLI, you need not touch native code or install tools like XCode or Android Studio. True or false?

15. You have been given the following array of items:

const DATA = [
 {
  title: "Main dishes",
  data: ["Pizza", "Burger", "Risotto"]
 },
 {
  title: "Sides",
  data: ["French Fries", "Onion Rings", "Fried Shrimps"]
 },
 {
  title: "Drinks",
  data: ["Water", "Coke", "Beer"]
 },
 {
  title: "Desserts",
  data: ["Cheese Cake", "Ice Cream"]
 }
 ];

Which components will you use to render this list of items sorted by title?

16. Which one of the following methods is triggered when the user leaves their finger longer than 500 ms and then removes their finger? Select the correct option.

17. Observe the code below and select the statement that best describes it.

import MenuScreen from './Screens/MenuScreen';
import WelcomeScreen from './Screens/WelcomeScreen';
import { createBottomTabNavigator } from '@react-navigation/bottom-tabs';


const Tab = createBottomTabNavigator();


export default function App() {
 return (
   <Tab.Navigator>
     <Tab.Screen name="Welcome" component={WelcomeScreen} />
     <Tab.Screen name="Menu" component={MenuScreen} />
   </Tab.Navigator>
 );
}

18. You are asked to display an alert to the user when a text input box is in focus. Which of the following methods would you use to achieve that?

19. Which hook will you use to update the width and height values of the screen automatically? Select the correct option.

20. Drawer Navigation in React Navigation has additional dependencies on react-native-gesture-handler and react-native-reanimated packages. True or false?

21. Which category of components include Text, ScrollView and Image? Select the correct option.

22. Which hook will provide you with the current device orientation and automatically update it when it changes? Select the correct option.

23. Which of the following values to the resizeMode prop scales the image uniformly so that both dimensions of the image will be equal to or less than the corresponding dimension of the view? Select the correct option.

24. By building apps using React Native, you would have the title of __________ in the tech industry. Select the correct option.

25. Which of the following values to the resizeMode prop scales the width and height of the image independently? Select the correct option.