Use create-react-native-app to Set Up a Simple React Native App

  • React Native requires a lot of initial set up to get an app going.
  • After creating the project we will run the development server which will print a QR code on the terminal.
  • We will install the app called on our mobile phone and use it to scan the QR code.
  • This will load our app on our mobile phone in development mode.
  • When make adjustments to our project the changes will be reflected on our phone.

React Native requires a lot of initial set up to get an app going. In this lesson, we will use create-react-native-app to do this initial setup for us. We will install create-react-native-app globally and create a new project.
After creating the project we will run the development server which will print a QR code on the terminal. We will install the app called Expo Client on our mobile phone and use it to scan the QR code.
This will load our app on our mobile phone in development mode. When make adjustments to our project the changes will be reflected on our phone. If we use console.log the messages will be printed in our terminal.
Download the Expo Client from App Store (https://itunes.apple.com/app/apple-store/id982107779?pt=17102800&ct=www&mt=8) or Google Play (https://play.google.com/store/apps/details?id=host.exp.exponent&referrer=www)


@eggheadio: Use create-react-native-app to Set Up a Simple React Native App – #React lesson by @beeman_nl #free #new

Unlock this lesson and all 986 of the free egghead.io lessons, plus get React content delivered directly to your inbox!

React Native requires a lot of initial set up to get an app going. In this lesson, we will use create-react-native-app to do this initial setup for us. We will install

create-react-native-app

globally and create a new project.

After creating the project we will run the development server which will print a QR code on the terminal. We will install the app called

Expo Client

on our mobile phone and use it to scan the QR code.

This will load our app on our mobile phone in development mode. When make adjustments to our project the changes will be reflected on our phone. If we use

console.log

the messages will be printed in our terminal.

Member comments are a way for PRO Members to communicate, interact, and ask questions about a lesson.

Here are some basic guidelines for commenting on egghead.io.

Comments are for discussing a lesson. If you’re having a general issue with the website functionality, please contact click here.

Is your comment resembles:

It will likely be deleted as “meta”.

Should be accompanied by code! JSFiddle, Plunker, CodePen, etc all provide a way to share code and discuss it in context.

Vague question? Vague answer. Any details and context you can provide will lure more interesting answers!

React Native requires a lot of initial set up to get an app going. In this lesson, we will use create-react-native-app to do this initial setup for us. We will install

create-react-native-app

After creating the project we will run the development server which will print a QR code on the terminal. We will install the app called

Expo Client

on our mobile phone and use it to scan the QR code.

This will load our app on our mobile phone in development mode. When make adjustments to our project the changes will be reflected on our phone. If we use

console.log

We install Create React Native App globally, then we will create our app by running Create React Native App with our app name, my-app. This will create the base project in the my-app folder, and it will install the project dependencies.

When the project is created, we CD into our project directory, and start the project by running “npm start.” This will start the development server. Once the server is started, it will print a QR code that can be used to load the app on your mobile.

On your phone, you need to download Expo Client from the App Store or Google Play. In the Expo client we select “scan QR codes,” and we scan the code in our terminal. Our application will now be loaded. We open the project in our IDE and open app.js.

When we edit the content, we will see the app refresh, and it shows us the updated content. We can debug our application by adding a console log message in the component. This will be printed in the terminal.

Use create-react-native-app to Set Up a Simple React Native App