Getting started with React Native

Hi everyone, today we gonna step into a brand new tutorial series in React Naive. So, this is the first one of it as usual Getting started with react native. First of all I’ll give you a basic introduction about react native and what it is used for. React is a front-end framework which is used in web and mobile technologies. React native is the mobile app front-end development framework. Important thing is it has components to build the app in both iOS and android platforms and you just have to code once. You just have to do some configurations for both platforms separately to install the app in both platforms. You just need a basic javaScript knowledge to get started with react native.

Okay. Enough of the introduction. You’ll get to know more about it when we continue this tutorial.

Installing React Native

To get started, you need to set up react native in your machine. In this tutorial, we focus mainly on windows set up. To set up react native, first set up java in your machine. So, download java jdk and install it and set the java path.

https://www.oracle.com/technetwork/java/javase/downloads 

Then download and install node js into your machine.

https://nodejs.org/en/download

It is better to use the recommended version of node than latest version.

You have few more things to do to set react native up completely. Now download and install a recommended version of python in your machine

https://www.python.org/downloads

After you installed node in your machine, you can use npm command. npm command is very useful, when you develop react native apps. You gonna need Python to compile your source code and serve it during development mode.

Now download android studio latest version and install it in your machine

https://developer.android.com/studio

You have one more thing to do to set all up. You need to install react native CLI. Otherwise, react native command will not work. Open command line as administrator and run this command “npm install -g react-native-cli“. Make sure you have an internet connection when you run this command.

Install React Native

 

Building the App

Now you are all set up. So, let’s build our first app. Go to a folder where you want to place your project in your machine and open CLI there. Now, run this command “react-native init ProjectName“.

Create project

Here, you can add any name you want for the part ‘ProjectName‘. It is going to be the name of your app. When you install the app in your mobile, that name is going to be displayed as the name of your app. You can change that name after you built your app. You’ll learn about it in a later tutorial. Make sure you have an internet connection when you run this command as well because you have some components to be downloaded when you build your app. After few minutes, your app will be built completely and you will have a folder with the same name of your project name. Inside that folder, there are some folders and files.

Project directory

You’ll learn about them in the next tutorial.

You can install this app install in your mobile after some more tasks are done. That app is the default app which react native provides us and and it has a welcome user interface. To create your own UI, you have to use an editor to edit the files inside the project folder. You’ll learn how to do that, in the next tutorial.

Thank you.

Food for thought: Zip and download files directory from Amazon S3 with Laravel

2 comments

  1. It’s a nice work which is encouraging the people who are interested in React Native. Carry on!

Leave a Reply

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