Software



HTML on your Phone

You can write and review html right on your smartphone with Termux, emacs, and impatient-mode


All you need to do is go to the GooglePlay Store and download Termux, open it, then write

$ apt install emacs

Boom....emacs is installed on you phone.

Now, write the following to start emacs on your phone

$ emacs

You have now entered the curious world of emacs, a very extensible text editor. Just trust me and hit the following keys without much thought. It'll clean up the window and lower your stress level. Your phone is still OK!

Ctrl-x 1
Ctrl-x Ctrl-f 

If you get any grief, hit Ctrl-g over and over until you see "Quit" in the mini-buffer(at the bottom of the emacs window). Then you get to start again. Once you have the Ctrl-x Ctrl-f done, the minibuffer will be asking you what file. Type in...

.em Tab

You should auto-complete to ".emacs". Even if you don't type in ".emacs" and copy the following into the file.


(when (>= emacs-major-version 24)
(require 'package)
(add-to-list 
 'package-archives
 '("melpa" . "http://melpa.org/packages/")t)
(package-initialize))
         

Now save by writing:

Ctrl-x Ctrl-s

Whew... OK, Stay with me, we're close. Let's keep going in the minibuffer

Alt+x list-packages
Ctrl-s impatient-mode

Install impatient-mode. You can just point an click the package name with your finger. You're so close.

Next, you need to find the file you're planning to write. If the file you're looking for doesn't exist, emacs will make it for you.

Ctrl-x Ctrl-f

And give the minibuffer the name of your file. I chose "impatient-modeExample.html".

Start writing HTML

If you are anything like me, I can't just start writing html off the top of my head. For sake of example, type the following in your blank .html file.

<!DOCTYPE html>
 <h1>Hello there, you lovely Person!</h1>

There, some html will be written in your browser (but you can't see it yet). Open your browser. It shouldn't matter which browser you are using. I like Opera on Mobile myself.

Type in the following url:

http://localhost:8080/imp

You should see the following:

Screenshot_20170822-205922.png

The link that is being displayed is your current file. You can have multiple buffers running impatient-mode at once. (You may have some issues with extensions like images and videos. To get them to update, link through to them from your index.html page which should also be running impatient-mode).


Screenshot_20170822-205929.png

I chose impatient-mode as a development extension to speed up my website development (from 0 to something more than that). It's pretty amazing you can use it on your phone. Check it out:

Screenshot_20170823-212720.png
Screenshot_20170823-212745.png

So, that's it. I hope you can see that emacs and impatient-mode are pretty cool tools to help you get your website up and running in a little less time.

This is all much easier on your computer. Emacs and its extensions are available for basically all flavours of operating system, so don't be afraid to try them on your pc, macbook, or linuxbox.