Summary - React Native basics
- React Native course
- Beginner
- Lesson 6/116
- 5 min
Combine View, Text and App.js to write your first mobile app.
Summary - React Native basics
In this group you learned what React Native is, how to create a project with Expo, the View and Text components, the App.js skeleton, and the npx expo start command.
You can now open an Expo project, write a basic screen, start the server, and view it on a phone with Expo Go.
Let us combine all of this in a single app.
Practice Write a complete App.js
Write a complete App.js: import View and Text from react-native, and with export default function App() return <View> containing <Text>React Native</Text>.
Starter code
// import line
// export default function App() {...}Sample solution
import { View, Text } from 'react-native';
export default function App() {
return (
<View>
<Text>React Native</Text>
</View>
);
}Practice Two-line welcome
Write an App component; inside a <View> place two <Text> elements: the first says Welcome, the second says React Native. Do not forget the import.
Starter code
// import line
// function App() {...}Sample solution
import { View, Text } from 'react-native';
function App() {
return (
<View>
<Text>Welcome</Text>
<Text>React Native</Text>
</View>
);
}
export default App;Questions and answers
Review the lesson questions together with their answers. To test yourself, solve the lesson interactively.
1 Which file is the app entry point?
- App.js Correct answer
- package.json
- app.json
- index.html
Explanation: App.js holds the entry component.
2 Match all the basic concepts
| Term | Meaning |
|---|---|
react-native |
Core package |
Expo |
Framework |
App.js |
Entry component |
npx expo start |
Server |