Coding on your Android smartphone

Developer on the go, you may want to code projects offline on your Android device. In this article, we will use a terminal emulator, install a tiny Ubuntu distro, and suggest a file manager and nice code editors for Android. In addition, we will see how to use developer tools on the browser.

Termux

The terminal emulator we will use is Termux, which works with no rooting required. You can either install the version from F-Droid or GitHub.

I do not recommend the Google Play version because it is outdated (latest release on 2020-09-29).

The first thing I recommend is to open Termux and upgrade the packages by running the following command.

pkg upgrade

By default, Termux can only access to its own file system. You can configure it to access the files from the internal storage using termux-setup-storage.

termux-setup-storage

This command creates a ~/storage/ folder containing symlinks to dcim, downloads, movies, etc. The latter provide read and write access to the files if you grant storage access permission to Termux in the Android settings.

To revert this configuration, revoke the storage access permission and run rm -r ~/storage.

Numerous tools are available on Termux, such as curl, git, etc., by just running pkg install <package-name>. You can query the database via the pkg search <keyword> command.

Ubuntu

While it is possible to develop on Termux directly, there are limitations. For example, I could not use pnpm to build NodeJS projects.

proot-distro is a utility to easily install Linux distros on Termux. It supports popular distros such as Ubuntu, Debian, Fedora, Arch Linux and so on. First, we open Termux and install the proot-distro package.

pkg install proot-distro

Now, it is possible to install Ubuntu.

proot-distro install ubuntu

To enter the Ubuntu terminal, run:

proot-distro login ubuntu

This opens a terminal session as root. I recommend to upgrade the Ubuntu packages:

apt update
apt full-upgrade

The distro is extremely lightweight: even tools like nano or wget are not installed by default.

The Termux home directory can be accessed from the path /data/data/com.termux/files/home. You can also mount the Termux home directory to /root directly when starting a session:

proot-distro login ubuntu --termux-home

To end the session, just:

exit

File manager

One of my favorite file managers for Android is Material Files. It is available on F-Droid as well as on Google Play.

Material Files can be configured to access to the Termux file system.

  1. Tap on the hamburger icon (☰) on the top left corner.
  2. Tap on Add storage….
  3. Choose External storage.
  4. Tap again on the hamburger icon (☰).
  5. Choose Termux.
  6. Tap on the Use this folder button.
  7. Allow file access.

A new storage named home should appear, you may want to rename it as Termux.

Code editors

In this section, we review a selection of open-source code editors working with Termux.

Acode

Acode is probably the most user-friendly editor in this list. It has many features and plugins, yet it is still lightweight. I recommend to install the F-Droid version instead of the Google Play version, because it has all the premium features without ads.

Configuring Acode to access the Termux file system is a little bit tricky. Follow the recipe:

  1. Tap on the hamburger icon (☰) on the top left corner.
  2. If a folder is already open, close it.
  3. Tap on Open folder.
  4. Go to the root by taping on / in the breadcrumb.
  5. Tap on the + icon on the top bar.
  6. Choose Add path.
  7. Choose Select folder.
  8. Tap on the hamburger icon (☰).
  9. Choose Termux.
  10. Tap on the Use this folder button.
  11. Allow file access.
  12. Eventually rename home to Termux and tap OK.

code-server

code-server can run VS Code on a server, so it can be accessed via a browser.

To install it on Termux:

pkg install tur-repo
pkg install code-server

Then, run:

code-server

To install it on Ubuntu:

curl -fOL https://github.com/coder/code-server/releases/download/v$VERSION/code-server_${VERSION}_amd64.deb
sudo dpkg -i code-server_${VERSION}_amd64.deb
sudo systemctl enable --now code-server@$USER

Then, visit http://127.0.0.1:8080. Your password is in ~/.config/code-server/config.yaml.

Micro

Micro is a terminal text editor, so it can run directly on Termux or Ubuntu.

To install it on Termux:

pkg install micro

To install it on Ubuntu:

apt install micro

Emacs

GNU Emacs is a popular terminal text editor.

To install it on Termux:

pkg install emacs

To install it on Ubuntu:

apt install emacs

Neovim

Neovim is another terminal text editor, fork of Vim.

To install it on Termux:

pkg install neovim

To install it on Ubuntu:

apt install neovim

Then, run:

nvim

Developer tools

Unfortunately, developer tools are not available on the official mobile versions of Firefox and Chrome. Don’t worry, we will review two solutions to bring developer tools to your Android device.

Kiwi Browser

Kiwi Browser is one of the only Chromium-based browsers on Google Play to include native developer tools.

In the app, simply tap on the three vertical dots (⋮) on the top right corner, then Developer tools. This will open a new tab, which is not convenient because the original tab is hidden in the background. However, it is possible to display both tabs simultaneously thanks to the multi-window feature from Android.

  1. Open the developer tools tab in the Kiwi Browser.
  2. Enable the multi-window mode from Android. This process might differ depending on the Android flavor of your device. On my phone, I tap on the square button (■) at the bottom of the screen, then Multi-window switch, and I select a random app. The screen should be split in two, with the Kiwi Browser on the top area.
  3. In the Kiwi Browser, tap on the three vertical dots (⋮).
  4. Choose New window. The new window should appear on the bottom area.
  5. Tap again on the three vertical dots (⋮).
  6. Choose Move to other window.
  7. Select the newly opened window (New tab).
  8. Tap the Move tab button.

Eruda

Eruda is an open-source Javascript library adding developer tools on top of a web page. When Eruda is loaded, a gear button should appear on the bottom right, enabling access to the developer tools. This library can be used in your project during development, but should be removed in production. An alternative is to use a browser app that loads Eruda automatically on every page. The app is open-source and the apk file can be found on GitHub.

Conclusion

Coding on a smartphone or tablet is possible, thanks to Termux and numerous compatible code editors. An alternative for installing Linux distros on Android is UserLAnd, which can be found on Google Play. I didn’t try it yet, so I don’t know how it integrates well with editors such as Acode. However, terminal text editors should work out-of-the-box. Happy coding!