Archive for the ‘Uncategorized’ Category

Survival Guide for Mac Users

September 26, 2016

1.  Command-line “Terminal”

Programmers uses a Command-line Shell to issue commands, this is because command-line is much more flexible and powerful than graphical interface.

The Terminal is an application that runs a shell program. By default, the Terminal in Ubuntu and Mac OS X runs the so-called bash shell.

To launch a Terminal:

  • In Mac OS X: Open “Finder” ⇒ Go ⇒ Utilities ⇒ Select “Terminal”. Drag the “Terminal” to your dock since you need to use it frequently or command + space bar and search for terminal and select
  • In Ubuntu: Open “Dash” ⇒ type “Terminal”; or choose “Applications” lens ⇒ Installed ⇒ Select “Terminal”. Drag the “Terminal” to your Launcher since you need to use it frequently.

A Terminal displays a command prompt ending with a “$” sign, in the form of:

  • In Mac OS X: “ComputerName:CurrentDirectory Username$
  • In Linux: “Username@ComputerName:CurrentDirectory$

You can enter commands after the command prompt. For example, enter “pwd” to print the current working directory:

$ pwd

In this article, I shall denote the command prompt simply as “$“.

2.  File System

Files and Directories (Folder)

Files are organized in directories (aka folders). The directories are organized in a hierarchical tree structure, starting from the root directory. A directory may contain sub-directories and files. A sub-directory may contain sub-sub-directories and files.

Root Directory (/)

A file is identified via the directories and filename, e.g., “/usr/lib/jvm/jdk1.7.0_07/bin/javac“. The leading/” (forward slash) denotes the root directory. The sub-directories are also separated by a “/“.

There is only one root directory for the entire Unix’s file system. Hard drives are mounted somewhere under the root directory.

Notes: Windows use “\” (back slash) as the directory separator, and may contain multiple root directories – one for each drive (e.g., c:\, d:\).

Home Directory (~)

Unix is a multi-user operating system (although most of you, in particular the Mac users, use it as a single-user personal computer). Each user on the system is allocated a directory for storing his files, known as home directory. The users’ home directories are allocated under /Users (for Mac OS X), or /home (for Ubuntu), with a sub-directory name the same as the username, e.g. /Users/peter, /Users/paul in Mac OS (or /home/peter, /home/paul in Ubuntu).

Your home directory (/Users/<yourname>) contains sub-directories such as Downloads, Documents. Their full filenames are /Users/<yourname>/Downloads, /Users/<yourname>/Documents, respectively.

You can use a special notation “~” to denote your home directory. In other words, ~/Downloads is the same as /Users/<yourname>/Downloads.

Pathname and Filename

To reference a file, you need to provide the pathname (directory and sub-directories names) and the filename. For example, in “/usr/lib/jvm/jdk1.7.0_07/bin/javac“, the pathname is “/usr/lib/jvm/jdk1.7.0_07/bin/” and the filename is “javac“.

The pathname can be specified in two ways:

  1. Absolute Pathname: An absolute path begins from the root directory. That is, it starts with a “/” followed by all the sub-directories, separated with “/” leading to the file, e.g., “/usr/lib/jvm/jdk1.7.0_07/bin/“.
    An absolute path can also begin with the current user’s home directory (starts with “~”). For example, “~/Downloads/jdk/” is the same as “/Users/<yourname>/Downloads/jdk/” in Mac OS.
  2. Relative Pathname: A relative path is relative to the so-called current working directory. A relative path does NOT begin with “/” or “~“. For example, if the current working directory is “/usr/lib/jvm/“, then the relative pathname “jdk1.7.0_07/bin/” refers to “/usr/lib/jvm/jdk1.7.0_07/bin/“.

Unix system is case sensitive, a rose is NOT a Rose, and is NOT a ROSE.

3.  Basic Commands

3.1  pwd (Print Current Working Directory)

The Terminal session maintains a so-called current working directory. All relative pathnames/filenames are relative to the current working directory. To display the current directory, issue command “pwd” (print working directory):

// Print Current Working Directory
$ pwd

When a Terminal is launched, it sets the initial working directory to the home directory of the current login user (denoted as “~“).

The current working directory is often included as part of the command prompt.

3.2  cd (Change Working Directory)

To change the current working directory, issue command “cd <new-pathname>“. You can specify new-pathname in two ways: absolute or relative. As explained earlier, an absolute path begins with a “/” (root directory) or “~” (home directory); whereas a relative path is relative to the current working directory and does NOT begin with “/” or “~“. For example,

$ cd /                // Change directory (absolute) to the root
$ cd /usr/local       // Change directory (absolute) to "/usr/local"
$ cd mysql            // Change directory (relative) to mysql of the current directory
$ cd myproject/bin    // Change directory (relative) to myproject/bin of the current directory

You can cd in multiple stages (e.g., one cd for each sub-directory – recommended), or cd in a single stage with the full pathname.

$ cd /         // "/"
$ cd usr       // "/usr"
$ cd local     // "/usr/local"
$ cd mysql     // "/usr/local/mysql"
$ cd bin       // "/usr/local/mysql/bin"
// Same As
$ cd /usr/local/mysql/bin

You can use “/” to denote the root; “~” to refer to your home directory; “..” (double-dot) to refer to the parent directory; “.” (single-dot) to refer to the current directory; and “-” (dash) to refer to the previous directory. For example,

$ cd ~            // Change directory to the home directory of the current user
$ cd              // same as above, default for "cd" is home directory
$ cd ~/Documents  // Change directory to the sub-directory "Documents" of the home directory of the current user
$ cd ..           // Change directory to the parent directory of the current working directory
$ cd -            // Change directory to the previous working directory (OLDPWD)

Setting proper working directory can greatly simplify your work. For example, to compile a Java program called “” in “~/myproject/java/“:

  1. Set the working directory to “~/myproject/java/“, and reference the file with filename only (without the path):
    $ cd ~/myproject/java  // Set the working directory
    $ javac     // Filename only, in current directory
  2. You can also refer to a file with its full pathname in any working directory:
    // Any working directory
    $ javac ~/myproject/java/   // Using fully-qualified filename

3.3  ls (List Directory’s Contents)

You can use command ls to list the contents of the current working directory, e.g.,

// List contents of current working directory in short format
$ ls
Desktop    Downloads         Music     Public     Videos
Documents  examples.desktop  Pictures  Templates
// List in long format
$ ls -l
total xx
drwxr-xr-x 2 myuser myuser 1024 Mar 22 21:32 Desktop
drwxr-xr-x 2 myuser myuser 1024 Mar 22 21:32 Documents
drwxr-xr-x 2 myuser myuser 1024 Mar 22 21:32 Downloads
-rw-r--r-- 1 myuser myuser 8445 Mar 22 17:30 examples.desktop
Wildcard *

You can list selected files using wildcard *, which matches 0 or more (any) characters. For example,

$ ls *.java     // List files ending with ".java" in short format (default)
$ ls -l *.java  // List files ending with ".java" in long format
$ ls -ld my*    // List files and directories beginning with "my" in long format
Graphical Interface

You could, of course, view the contents of a directory using a File Manager (such as “Finder” in Mac, or “Home Folder” in Ubuntu) more conveniently.

3.4  less (Viewing File Contents)

You can use commands less to display the contents of a text file on console. For example,

$ less /proc/cpuinfo
  // Display one page of the file
  // Use Up|Down|PgUp|PgDown key to scroll, and type "q" to quit

3.5  Shortcut Keys – IMPORTANT

Previous Commands in Command History: You can use the up/down arrow keys to retrieve the previous/next command in the command history.

Auto-Complete: You can type the first few characters for the pathname or filename, and press TAB key to auto-complete.


  • In Mac OS X: use Cmd+C and Cmd+V.
  • In Ubuntu: use Shift+Ctrl+C and Shift+Ctrl+V. (The Ctrl+C is used as interrupt signal to break a program, by default.)

4.  Processes

You can use GUI applications to view all running processes and terminate a particular process (similar to “Task Manager” in Windows).

  • In Mac OS X: launch “Activity Monitor” (Under /Applications/Utilities) and select “All Processes”.
  • In Ubuntu: launch “System Monitor” (search from Dash) and select “Processes”.

5.  If you need to Install Software or Perform System tasks as Administrator

These require so-called administrator right. To enable a user to perform system task (i.e., with Administrator right):

  • In Ubuntu: System Settings ⇒ User Accounts ⇒ Select the user ⇒ Unlock ⇒ Set the account type to “Administrator” (instead of “Standard User”), which adds the user to “sudo” group.
  • In Mac OS X: System Preferences ⇒ Users and Groups ⇒ Select the user ⇒ Unlock ⇒ Check “Allow users to administer this computer”.

To run a command with administrator right, prefix the command with sudo (superuser do). For example,

$ cd /var/log
$ mkdir temp
mkdir: cannot create directory ‘temp’: Permission denied
   // You have no permission to create sub-directory here!
$ sudo mkdir temp
[sudo] password for <yourname>:
   // Enter YOUR password 
   // Now running this command as the administrator
$ rmdir temp
rmdir: failed to remove ‘temp’: Permission denied
   // Again, you have no permission to remove sub-directory here!
$ sudo rmdir temp
   // YOUR password is cached for 15 minutes 
   // Now running this command as the administrator

6.  Programming Text Editors

A program editor (or source code editor) is programming language sensitive and context-aware. It highlights the syntax elements of your programs; and provides many features that aid in your program development (such as auto-complete, compile/build/run, help menu, etc.). On the other hand, a plain text editor is not language-sensitive and, therefore, is NOT suitable for writing programs. For full-scale software development, you should use an appropriate IDE (Integrated Development Environment).

It is important to use a mono-space font (such as “Courier”, “Consola”) for programming, so that the columns are properly aligned.

6.1  Mac’s Default Editor – TextEdit

To use the Mac’s default text editor “TextEdit” for programming, you need to choose the option “Make Plain Text” (under “Format”), before editing/saving your file.

TextEdit is NOT a programming text editor, as it does not provide syntax highlighting. You are strongly advise to install a programming editor (to be described in the following sections).

6.2  Graphical Programming Text Editors – gedit, jedit, Sublime Text, and others

A good graphical programming text editor, which provides syntax highlighting, is crucial in programming and development.

  • In Mac OS X, you could try installing Sublime Text, gedit, jedit, among others.
  • In Ubuntu, the default “gedit” is an excellent programming text editor. You might consider Sublime Text.

6.3  nano – A lightweight Console-based Text Editors

You should use graphical text editor if possible. Use console-based text editor as the last resort.

nano is small, simple and easy-to-use text editor. nano is available for Mac and Unix Systems, and is really handy to create/edit small configuration files.

To start nano, open a Terminal and issue:

$ nano                // Create a new file
$ nano <filename>     // Edit an existing file

To exist nano, press Ctrl+X, followed by “y” (yes) to save the file.

You can run nano with sudo (as administrator) for editing restricted system files, as follows:

$ sudo nano <filename>  // Run nano with superuser to edit an existing system file

GTAC 2009 – JsTestDriver

May 3, 2010

Rounder corner with help of image and css

March 7, 2010

The simplest way to make your rounder corner for the web pages. Below is the solution:

Create four images for your corners. With the help of Abode photoshop or any graphic tool create these four images . I’ll be using this square here…

the place where I want to show the box, create a container div to hold the box, a div for the top row and a div for the bottom row. Between the top and bottom rows, I add my content. In the top and bottom row divs, I add the left corner image and set the inline style to read display: none;. This makes the image invisible unless I make it visible through the stylesheet. That way, I can hide the effect from incompatible browsers by not showing them the stylesheet.

<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>