To set up React development server on your phone follow the steps given below to install react in android.
Required Applications For React In Android
As I told you guys earlier we’ll be using the Termux application to run react on android, so make sure you have installed termux in your phone. If it is not installed on your phone click the button below to download it and then install it.
What is Termux ?
A termux is an android terminal emulator that you can use to run so many Linux packages on an android phone without root. You can download termux by clicking here. To know more about the termux application click here.
Another recommended application that you can use is Acode editor to write code for your react application conveniently or you can use nano text editor, but nano text editor is not that convenient for writing code.
Installing React In Termux
Now that you’ve installed the termux application. Open your termux application and follow the commands given below to set up react in android.
- Update the list of packages.
- Upgrade upgradeable packages.
apt upgrade -y
- Install nodejs.
apt install nodejs -y
- Install create-react-app.
npm -i create-react-app -g
- After the execution of above command is completed now, you can create your own react app using
npx ceate-react-appand then app name. For example I’ll create a app named ‘amanbytes‘.
npx create-react-app amanbytes
Note : If you get error while creating a react app then execute
npm install -g [email protected]command in your terminal and after the execution of that command is completed then you can create react app using the above command without any errors.
Starting React Development Server
You can run the development server of react application by typing the command
npm start in your react app directory. For example, I have an app called amanbytes so I’ll get inside that directory using
cd amanbytes command, and then I have to type
npm start to run the development server.
In most cases, the server is hosted on localhost:3000 but sometimes it can vary. Anyway, after the react development server is started it will ask you which browser to use to visit the development server and from there you can see the address of your development server.
Using Acode Editor To Write React Code
In termux, one can use text editors like nano text editor to write code. Writing a few lines of code using these types of text editors is fine but, when one has to write so many lines of code it can be a pain in the ass to write code using text editors like nano text editor. So I’ll recommend you to use Acode editor, which you can use to write code for your react in android.
Follow the steps given below to setup your react application with Acode editor:
- Open Acode editor.
- Swipe from left to right and then click on open folder.
- Click on the top plus (+) buton and select Add Path option.
- Now name your path anything you want like amanbytes react app and then click on select path.
- File manager will open, swipe from left to right and click on Termux.
- Advertisement -
- Click on your react app folder and then click on Use This Folder button.
- Allow Acode to access files.
- Now you’ll be back to Acode app, here click on OK.
- You’ll see your folder now, click on it and then click on select folder.
- Now you can directly edit all the files of your react app directly from Acode editor. All you have to do is to swipe from left to right and then click on your react folder and then you can edit code of your react on android.
So this is how you can set up react in android, if you get stuck somewhere watch the video given below in which I’ve demonstrated all the steps.