fbpx

Beginners Guide to Learn React Native CLI

blog_detail_img

June 19 , 2020 Posted by Creatix9

React Native comes with its own built tools that are popular among the developer’s community. It is known as React Native Command Line Interface that is quite useful when creating an amazing react native app. This React Native CLI gives more options of customization and offers a wide range of native features especially for iOS applications. It requires the use of Android Studio or XCode to start using the React Native CLI. You can initialize your projects using the command of React Native CLI. If you are familiar with the development environment of Android Studio or XCode, CLI is the perfect way to create React Native applications. 

Learning the use of React Native CLI is easy as a beginner, you can start creating your first app by using the CLI tool. Have a look at the complete guide for beginners to learn React Native CLI.

 

Install React Native CLI

Beginners Guide to Learn React Native CLI
Install React Native CLI

Start by installing the Android Studio and Node Js to quickly begin the creation of your first React Native app. If you are using React Native windows, then download the Android SDK which might be tedious as it requires a list of utilities to be installed. If you are a macOS developer and want to develop an iOS application, then download XCode. After all the necessary installations and tools, finish the development environment setup and install react-native-cli mac. Now open your terminal and enter the command ‘npm install -g react-native-cli’. This command will install the npm package with all the dependencies inside the node-module folder. You can check react-native-cli version by using command ‘react-native-version-check’. If you feel the need for react-native-cli upgrade, enter the command ‘npx react-native upgrade’. If it doesn’t show the successful installation, you can uninstall react-native-cli using ‘npm uninstall -g react-native-cli’ and install it again. 

 

Initiate The Project

Beginners Guide to Learn React Native CLI
Initiate The Project

You can install react-native-cli yarn after the installation of react-native-cli. Use the command ‘npm install -g yarn’ and then init your first project. Create the project directory by opening your terminal and typing the command ‘react-native init myproject’. Through this command, the cli tool will contain everything you need to have for the creation of a react native project. You will find a few items in the created folders including the node_modules which contains React Native framework. Other files like index.js, app.js, android and ios folders containing every necessary thing for the app. You can start building your app with react native cli typescript by adding ‘—template react-native-template-typescript’ on the same command line.

 

Running The Project On Simulator

Beginners Guide to Learn React Native CLI
Running The Project On Simulator

The React Native CLI tool comes with some snippets of code that are default. You can use Android emulator or iOS simulator to run the application. If you are a windows developer, ignore the iOS part and in case of iOS developer, ignore the Windows part. Trigger the command of ‘npm start’ to run yours react mobile app. It will allow the metro bundler to watch for file changes in.js file. Ensure the command runs in a separate window when building your ios or android app. Run the command ‘react-native run-ios’ for iOS simulator. In case of an android application, use the command ‘react-native run-android’ on the terminal to open the app. 

 

EXPO vs React Native CLI

Beginners Guide to Learn React Native CLI
EXPO vs React Native CLI

Expo is also a set of tools built to React Native apps which are considered the easiest way to start mobile development. If you are a beginner in creating React Native apps, Expo might be useful for you. It helps in creating Android and iOS projects that use React and JavaScript for development. Apps created with Expo are robust and flexible, however, there are some issues that make CLI better than React Native Expo. You can’t add modules written in any other language like Swift, Java, Kotlin etc. It doesn’t allow you to use native language packages that need linking. The app’s size increases when made with Expo SDK solutions and some issues may occur in standalone react native app. While creating an app with React Native CLI offers the ease of cost in development and provides great flexibility. You can add multiple packages for image or video compressing improving the performance of your application.

 

Conclusion

React Native CLI is an own built tool available in React Native that makes the development process easier for developers. You can start creating your React Native using the CLI tool with few simple steps. Using Expo is now not highly preferred by most of the mobile app developers as it raises some major issues. React Native Cli has become the new norm for app developers as it doesn’t take much of the time or efforts to create an app.

 

Also Read: What Is React Native Paper & How to Use It?

Leave a Reply

Your email address will not be published. Required fields are marked *