We will be creating the simplest app we can build with Django and ReactJs frameworks. This tutorial aims to give aspiring coders who don’t have access to a computer starting point if they want to code on their phone. Steps and procedure explained here should be practised on Android phone.
1. What is Termux and Termux API?
Termux is an Android terminal emulator and Linux environment app that works directly with no rooting or setup required. Termux API work with Termux to provides an interface to access Android and Chrome hardware features. We will be using termux, to run the terminal commands on the device. learn more on how to use termux here
2. Installation of Termux and Termux API.
We will need to install both Termux and Termux API they can both be downloaded on google play
3. Installation of Python
In order to install and run the Django server, we will need to have Python programming language installed first on our device. Read more about python here.
When you have finished installing the Termux and Termux API application,
- open Termux.
pkg install pythonto install python.
- When python has finished installing you can run
pythonon Termux to confirm the version of python installed.
Congratulations!! you have just installed python on your phone.
Creating a virtual environment
We will use the virtual environment to manage our project packages. If you are not familiar with the virtual environment in python, this great tutorial is for you.
- Exit the python CLI by running
exit()on your Termux terminal.
python -m venv my_venvon your Termux terminal to create a virtual environment named
venvthat we will be using for this tutorial.
lson your termux terminal and notice that a new folder has been created named
my_venv— that folder will hold our environment packages i.e Django.
source my_env/bin/activateto activate the virtual environment.
Now let us install the Django framework
- Install Django by running
pip install djangoon termux terminal.
When Django has finished installation the below message will appear.
Run Django Server
It’s time to run our Django application and test it but in order to run the Django server, we need to start a Django project. I will recommend you read more about Django and how to make a more comprehensive application with it here if you are unfamiliar with it.
django-admin startproject myappto create a Django project called
lsand notice there is an additional folder created named
cd myappto switch to our project folder.
lsand notice there is a file named
manage.pywe will be using it to run the server.
python manage.py runserverto run the Django server. The following screen should appear.
Congratulations!! you have just created mobile Django app.
Open your mobile browser and use
localhost:8000as the url, you should see content similar to the image below.
4. Installation of Nodejs and React.
The Nodejs and React installation procedure isn’t that much different from python and Django installation, but we will need a different session to create the react server app. I assume by now you are already familiar with termux so I won’t be posting a lot of screenshots please observe it from your terminal.
- Slide the screen from left to right to open Termux navigation drawer.
new sessionoption a new window of Termux session will be opened.
We will create the ReactJs server in this session. Just like Django and python in order to run ReactJs server we need nodeJs to be installed first. If you are not familiar with NodeJs please read more about it here
pkg install nodejsto install
nodejson your phone.
node -vto check if
nodejshas been properly installed and also to know the version of
npm install create-react-appafter Nodejs has finished installing. We will use this library to create react app. You can learn more about Reactjs here
create-react-apphas finished installing. This command will create a new folder project that we will use to build the react server app.
cd reactappto switch to the newly created folder named
npm init react-app myappthis command will set up and install everything you need to run a react app on your phone.
cd myappto switch to your react project
npm startto start the react server, wait for the server to build and open your phone browser enter
localhost:3000on your URL address field.
You will see a beautiful react log similar to the screenshot below rotating
Congratulations you have just created a Reactjs app.
5. Conclusion and Recommendations
Termux is a cool terminal emulator, you can use git and clone projects from GitHub and run them on your phone. Termux can also be used with Vim as the text editor. Now the power in your hand has been unlocked I want to see what you will build with your phone. 😀 😀