Git branch in Ubuntu terminal

This is the code I added to ~/.bashrc around line 59. It affects the CLI prompt in the Ubuntu terminal in a number of ways.

1. It removes the username and computer name.
2. It adds the open Git branch, if one exists.
3. It adds a new line at the end, because some path's get very long, and don't give you much room to add your commands. 

parse_git_branch() {

 git branch 2> /dev/null | sed -e '/^[^*]/d' -e 's/* \(.*\)/(\1)/'

}

if [ "$color_prompt" = yes ]; then

 PS1='${debian_chroot:+($debian_chroot)}\[\033[01;32m\]\[\033[01;34m\]\w\[\033[01;32m\] $(parse_git_branch)\[\033[00m\]\n$ '

else

 PS1='${debian_chroot:+($debian_chroot)} $(parse_git_branch)\n$ '

fi

How to keep your Ubuntu laptop running with the lid closed

 I wanted to keep using my laptop running but use my external screens, mouse and keyboard.

To achieve this, you need to make the following changes to your /etc/systemd/logind.conf file:

Change the line

#HandleLidSwitch=suspend

to

HandleLidSwitch=ignore

then, change the line

#LidSwitchIgnoreInhibited=yes

to

LidSwitchIgnoreInhibited=no

You will then need to restart, and hey presto!

How to add a directory to your path in Ubuntu

Open up the terminal
Type the command
echo $PATH
This gives you the current path.
Let's say you want to add the directory /home/mick/temp to the path...
Copy the current path you have just echo'd. Lets's say it's
/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin
First make sure you are in your home directory by typing
cd ~
Open the file .bashrc using an editor such as gedit using
gedit .bashrc
Go to the bottom of the file and add a line
PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin
Where the existing path is just pasted in.
Now add a colon followed by the path you'd like to add so that it reads
PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/home/mick/temp
Save the file and restart your computer.
Now any excecutable placed in can also be available wherever you are on your installation.
This will be useful in following blog entries.

The 2018 Web Developer : Adding node_modules to a project using npm

In the last post, I prepared the ground for adding node_modules to my project. In my simple, learning project I'm going to add 3 modules:

• bootstrap
• jquery (which bootstrap needs)
• popper.js (which bootstrap 4 also needs)

First open the project within the atom browser. Then I open the terminal within the browser (which sets the current working directory to my project). Within the terminal I type:
npm install bootstrap
npm install jquery
npm install popper.js
Job done! Well not quite. The start page for my project is taken from the Twitter Bootstrap starter template. So I now need to change the paths of the scripts and CSS links to :
<link rel="stylesheet" href="node_modules/bootstrap/dist/css/bootstrap.min.css">
<link rel="stylesheet" href="scss/custom.css" />

<script src="node_modules/jquery/dist/jquery.min.js"></script>
<script src="node_modules/popper.js/dist/umd/popper.min.js"></script>
<script src="node_modules/bootstrap/dist/js/bootstrap.min.js"></script>
Now I'm cooking with gas. I can also start employing the SASS elements of Twitter Bootstrap.

What next?

There is much greater power in using node.js, nvm and npm, but it's a good start.

The 2018 Web Developer : Preparing a project for node_modules using npm

To prepare my project for node modules, I must initialise node within it's root directory.
First change to the project directory, using:
cd /myproject
Then type:
npm init -f -y
This will avoid me answering awkward questions that I'm not sure of, and provide me with a package.json file.
I'm also going to use the opportunity to make sure I'm got some tools in place such as the atom text editor, the slimjet browser and the LiveStyle plugins for atom and Chrome (which we can use in Slimjet).

atom

I won't go through the reasons for using atom, you can get that from many places, but needless to say I'm convinced. To install on Ubuntu:
sudo add-apt-repository ppa:webupd8team/atom
sudo apt update; sudo apt install atom
I had a graphic problem on an old laptop. It kept flashing. To remedy this I changed the command of my Atom launcher to:
/opt/atom/atom --disable-gpu

I installed the platformio-atom-ide-terminal package. This will open up a terminal inside the editor. It's quite useful because some commands, such as node-sass.

I also installed the livestyle-atom package.

Slimjet

Slimjet is a slim, fast browser which will give me all the benefits of Google Chrome browser by using its engine, but without telling Google everything I'm doing. To install:

wget http://www.slimjet.com/release/archive/8.0.4.0/slimjet_amd64.deb

sudo dpkg -i slimjet_amd64.deb

Now to add the livestyle extension. Within the browser:

More tools->Extensions->Get more extensions

Type livestyle

LiveStyle

LiveStyle is a tool for live CSS editing. It means I'll be able to edit my SASS file and see the changes in real-time within the Slimjet browser.

What next?

I now have some good tools in place for my project. I have a fast browser. I have an editor which allows me to make SASS changes and see them in real-time. I can do this by opening a terminal and starting the node-sass package. I can also use the terminal to compile changes to my .js files using node. I can also use the terminal to initialise my project to be node ready.

Now I can start adding local node_modules to my project in the next post.

The 2018 Web Developer : Adding node-sass globally

In the previous post I installed node.js (node). This also came bundled with the Node Package Manager (npm). npm allows me to install many packages created by the JavaScript community, both open-source and commercial. Examples include Twitter bootstrap, ReactJS, etc.
In this example I'm going install use node-sass, globally. This will allow us me develop CSS for any project using SASS on my system using.
From the command line type:
npm install -g node-sass
I then test that it has installed using:
node-sass -v

Using node-sass

In this first example, I have a terminal window open and I'm in a directory containing my custom.scss which will need compiling to custom.css in order to be used by my web pages.
node-sass -w custom.scss custom.css
In this second example, I'm in the root directory of my project with a subdirectory of /scss. Here, I am compiling all .scss files to their .css equivalents, in the same directory.
node-sass -w scss/ -o scss/

What next?

Now that I have used npm to install a package globally. I've applied a package, namely node-sass, which will improve my productivity. Now, in the next post, I need to begin a new project and prepare the ground for project specific packages.
I'm also going to use the opportunity to make sure I'm got some tools in place such as the Atom text editor, the slimjet browser and the livestyle plugins.

The 2018 Web Developer : Install node.js (node) on Ubuntu

In the last entry of this series, I installed Node Version Manager (nvm). This was important in order to give me the flexibility I need in this entry.

What is node.js (node)?

According to wikipedia "Node.js is an open-source, cross-platform JavaScript run-time environment for executing JavaScript code server-side".

How will node help me?

The first pleasure I got for using node.js was in testing JavaScript I'd written through the terminal. This meant, I could edit a file such jimmy.js, then test it on the command-line through:
node jimmy.js
No need to keep refreshing a browser. It also provided me with warning and error messages like any other compiler.
node also opens the door to much bigger things, particularly through the Node Package Manager, which I'll discuss in future posts. So it's well worth having.
Now to install node.js using nvm
nvm install node
Test that it has installed using:
node -v
If, for any reason, this call returns an error; node may not be in your PATH variable. To rectify this, open your .bashrc file, and at the bottom, add the line.
PATH=/usr/bin/node:$PATH

What next?

Now that I have nvm, npm and node installed what can I do?
Well I can begin by using node as a compiler for .js files. I mention this in the section titled "How will node help me?". I use the atom editor, which I'll be referring to in this series. So if I install the platformio-ide-terminal in atom, you can imagine how quick I'll be editing .js files now.
However, it's also good to know that I will face other, better improvements in my productivity with this new tool set. In the next post, I'll use npm to install node-sass globally. This will allow me to develop using SASS on all my projects.

The 2018 Web Developer : Install nvm on Ubuntu

In the introduction to this series I wrote about the value of learning JavaScript technologies such as node.js (node), in order to avail myself of more work. In order to install node I should first install nvm. This will allow me to control the versions of I install.

What is nvm?

Node Version Manager (nvm) is a tool for applying node to an installation.

How will nvm help me?

Let's say you're involved in a project which began and continues to be running using an older version of node. You, as a developer need to be in a position to install that older version in your project. You would obviously, also want to install newer versions for other projects.

OK, I'm convinced. Let's install stuff

Let's begin with nvm.
From your home directory, create a directory called .nvm
mkdir .nvm
sudo apt-get install build-essential libssl-dev curl git-core
curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/install.sh | bash
Check the latest version from https://github.com/creationix/nvm
Now reboot and check that it works using:
nvm --version
A new directory should have been added to you home directory called .nvm
And the following should have been added to your .bashrc file
export NVM_DIR="$HOME/.nvm"
[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"  # This loads nvm
[ -s "$NVM_DIR/bash_completion" ] && \. "$NVM_DIR/bash_completion"  # This loads nvm bash_completion

What next?

I haven't achieved much here, other than installing a piece of software, but I have opened the door to the possibilities which node brings. In the next instalment I'll take another baby step. I'll use my newly installed piece of software to install node.

How to install less css on Ubuntu

sudo apt install npm
sudo npm install -g less
sudo ln -s /usr/bin/nodejs /usr/bin/node

Introduction to the PHP5 Command Line Interface (Ubuntu version)

So you'd like to write and run your PHP5 code without using a web browser. Where you run it from the command-line....

First make sure that the php5 cli is installed by typing this on the command line (terminal, shell, whatever you want to call it) :

sudo apt-get install php5-cli

Now it's time to create your first command line script to test. Use your favourite editor to create the following program and save it as hello.php:

<?php
echo 'hello world!';
?>

Now back to the command line. Make sure you are in the same directory as hello.php was saved. Now type:
php5 hello.php

You should see that hello world! is echo'd to the command line.

Now the following program:

• Takes the first number
• Assigns it to a variable ($first)
• Takes the second number
• Assigns it to a variable ($second)
• Adds the two numbers together and assigns them to the variable $answer
• Echo's the value of the variable $answer, then adds a line break.

<?php
echo 'Enter first number ';
$first = fgets(STDIN);
echo 'Enter second number ';
$second = fgets(STDIN);
$answer = $first + $second;
echo 'And the answer is '.$answer.PHP_EOL;
?>

Now you're ready to go.

How to configure your Ubuntu localhost for PHP MVC URL routing

Step 1. Open a terminal and type
sudo gedit /etc/apache2/sites-available/default
or whatever text editor you like using to open up your apache configuration file for editing.
Step 2. Under the sections headed  <Directory /> and <Directory /var/www/>:
Change the line 'AllowOverride none' to 'AllowOverride All'.

Step 3.  Open up a terminal and type
hostname
This will display your hostname.

Step 4. Open up a terminal and type
sudo gedit /etc/hosts
or whatever text editor you like using to open up your hosts file for editing.
Step 5. Modify the first line so it reads
127.0.0.1    localhost localhost.localdomain yourhostname
Step 6. Open up a terminal and type
sudo a2enmod rewrite

Restart your computer.
It will now work.

How to set up sendmail on your Ubuntu LAMP localhost

This is beautifully simple:
Step 1. Open up a terminal and type

sudo apt-get install sendmail
This will install the complete sendmail application. It will take a minute or so to complete.

Step 2.  Open up a terminal and type

hostname

This will display your hostname.

Step 3.  Open up a terminal and type

sudo gedit /etc/hosts

or whatever text editor you like using to open up your hosts file for editing.

Step 4. Modify the first line so it reads

127.0.0.1    localhost localhost.localdomain yourhostname

Restart your computer.

It will now work.

Install and use LESSCSS on your ubuntu server

LESSCSS is an excellent progression in the development of stylesheets, but how do you install and use it on your ubuntu server?
The first thing we do is to install node-less. To do this through the terminal, use the command:
sudo apt-get install node-less
Right, that's the installation done. Yes, that easy.
Now let's create our LESSCSS stylesheet. Here is my simple example, which we'll put into a file named styles.less:

@blue:#00c;
@white:#FFFFFF;
body
{
background:@blue;
color:@white;
}

There are two ways of using LESSCSS.
The first way is to download, the less.js library from http://lesscss.org/, then simply refer to a LESSCSS stylesheet we created and subsequently call the library thus:.

<!DOCTYPE html>
<html lang="en">
<head>
<title>less test</title>
<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>
</head>
<body>
<p>Hello World!</p>
</body>
</html>
The second way is to compile our LESSCSS stylesheet into a normal CSS. To do this, again go to the terminal, change to the directory containing your page e.g.
cd /var/www/test/less
Then compile the LESSCSS stylesheet into a normal CSS like this:
lessc styles.less > mystyle.css
Now you can just call your newly created CSS in your page, but this time without the need for the less.js library thus:

<!DOCTYPE html>
<html lang="en">
<head>
<title>less test</title>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>
<body>
<p>Hello World!</p>
</body>
</html>

From gtk-recordmydesktop to youtube in one line

It's good to be back to being a GNU/Linux and in particular Ubuntu, home user.

When you record your screencast using gtk-recordmydesktop the ouput is an ogg file. Your file still needs to meet the needs of youtube if you are to vodcast. For this you will need a line like this....

mencoder oo1.ogg -oac mp3lame -ovc lavc -ofps 30 -vf scale=320:240 -o oo1.mpg

If you don't have mencoder, then you can install it using:

sudo apt-get install mencoder