Say “Hello world” using React Native in Linux

Start the journey of developing native apps now.

Roselle Gabuya
Code Like A Girl

--

Hi everyone.

So far I’m beginning to learn React Native and I’m very happy to share my way of starting.

This tutorial will focus on setting up your react native development environment on Linux as well as running your “Hello World” app on your mobile android device.

Alright, let’s keep going!

Requirements :

Before proceeding, be sure to install the latest version of the following on Linux (Ubuntu 20.04):

  • npm (version 6.14.8 as of this writing)
  • node (version 12.19.02 as of this writing)
  • android SDK (command-line tools only — for android)
  • Yarn
  • Watchman
  • Git

Others :

  • a USB cable
  • a mobile android phone ( Android 9.0)

1. Verify the installation of npm and node.

You may check if npm and node are installed in your system using the following command:

> npm -v
> 6.14.8
> node -v
> 12.19.0

2. Install the React Native CLI.

You may install this using the following command :

> npm install -g react-native-cli

3. Create a new React Native project.

To start a new project, type the following command :

> react-native init <project name>

4. Connect your mobile android device.

We will build our application on a physical mobile device. To verify if your device is connected, type the following command :

> adb devices

note: you need to authorize your mobile device and enable USB debugging by going to “Settings>Developer Options>USB debugging”

5. Run the react native app

Run and build the app using the following command:

for android :

> cd <project name>
> npx react-native run-android && react-native start

After a successful build, the following will appear on your mobile phone :

Congrats! now you have successfully created and build your first react native app.

To modify the welcome message, let’s edit the App.js file :

Save changes, then the text will change in real-time.

You can also press R on your keyboard to reload your code.

We will now be able to see the changes.

Hello World!

There you go, we made a basic setup of react native on our local machine.

Let’s start coding. ^_^

Conclusion

React native makes mobile development fun and easy by enabling developers to use the same JS codebase for building both android and ios native apps.

I’m really looking forward to building my own mobile apps using React native soon. ^_^

--

--

a Writer by heart and a Software Developer by passion | reach me out on instagram : @awriterbyheart