In this Termux tutorial we will be creating a simple app using Django and ReactJs platforms. The purpose of this article is to show coders who want to learn outside the framework of a computer how they can use some simple and downloadable programs to create on their phones. This particular tutorial will utilize an Android device to facilitate all of the coding.
The Termux tools we’ll be using
The simplest way to build an Android app is by using Termux because it is an Android terminal emulator and Linux environment that allows the user to build without additional rooting or setup. In addition, we will use the Termux-API to link an interface to both Android and Google Chrome hardware. The Termux app will be running the terminal commands on the device for our purposes. To access more information about Termux terminal before we begin check out this link.
Termux and Termux-API installation
You can download both Termux and the Termux-API by accessing them on the Google Play store.
Installation of Python
The Python programming language will be required in order to utilize and run the Django server. To learn more about Python, find additional information here.
Once you have successfully installed Termux and Termux-API, follow these steps:
– Open Termux
– Install Python by running
pkg install python.
Once installation is complete, run
Python on Termux to make sure that Python has installed correctly.
Congrats! You have successfully completed the first step by installing Python on your phone.
Making a virtual environment
For this tutorial, you will need to create a virtual environment to work on your project packages. In case you don’t know the specifics of a virtual environment in Python, here is a great tutorial which explains everything. On the Termux terminal run
exit() to leave Python CLI.
Create a virtual environment called
venv by running
python -m venv my_venv on your Termux terminal.
ls within the Termux terminal and you should see that new folder called
my_venv has been created. Your environment packages (ie Django) will be contained within this folder.
Start your virtual environment by running the following:
The next step we will tackle is installing the Django framework.
To install Django, run the following command:
pip install django on your Termux terminal. Once Django has installed you should see the message below.
Run Django server
A best practice is to test run the Django application by running the Django server, but to run a test you must first start a Django project. If you are unfamiliar with Django or how to create a comprehensive app, you can read more about the process here.
To create a Django project named
django-admin startproject myapp.
ls and after you complete this task there should be a new folder called
To change the project folder, run
ls. Take notice of the file named
manage.py. You will use this file to run the server.
pythonmanage.py runserver and you should see the following screen.
You did it! You used Django to make a mobile app. To see it use
localhost:8000 and you will be able to see something like the image below.
React and Nodejs installation
The process for installing React and Nodejs is very similar to installation of Python and Django, except that you will need to create a different session for the React server app. Because we have already gone through Termux several times, I won’t be including the screen shots for this part of the project, just follow along with the instructions on your personal screen.
Open the Termux navigation drawer by sliding the screen from left to right.
Create a new window of Termux session by selecting
Much like with Python and Django, to create a React Js server for this session, we will need NodeJs to be installed first. If you need a tutorial on how to install NodeJs there is a great lesson here.
node.js to your phone run
pkg install node.js.
You will need to know which version of
node.js has installed to your phone, so first run
node-v to check if
node.js has been properly installed and you should also be able to view the version that was installed.
npm install create-react-app after Nodejs has finished installing. You will be using the library to create a React app. If you would like to learn about ReactJs, check out this tutorial.
mkdir reactapp after
create-react-app has finished installing. By doing so you will be creating a new folder project that will be used to create the React server app.
Switch to the new
reactapp folder by running
npm init react-app myapp to set up and install all the tools and commands you need to run and build the new react app on your device.
Switch to your React project by running
npm start to start the React server. Once the server has been built, open your browser and enter
localhost:3000 in the URL field.
You should see a React log similar to the image below on your screen (it should be rotating).
Wow, you did it! You have now created a ReactJs application on your phone!
Conclusion and Recommendations
Termux and Termux-API are very versatile and exciting emulators. You may consider utilizing git to recreate projects that can be found on GitHub using your phone. Another option is to pair Termux with the text editor Vim for creative new projects. By mastering these early skills, the sky’s the limit on the apps you can create. Don’t forget to share future projects with me, I love to see the apps you can build with your phone.