Saturday, October 8, 2016

How to run maven

mvn command

The syntax for running Maven is as follows:

mvn [options] [<plugin:goal>] [<phase>]

The order of execution depends on the order in which the goals and the build phases are invoked.

Running maven phases

Example: build a Maven project with the package phase of the default life cycle

mvn package

Example: install in local repository

mvn clean install

Above you see the most common build invocation for a Maven project. The command mvn clean install creates the package and install it in the local repository for re-use from other projects. This command executes each default life cycle phase prior to install, in order, before executing install.

Example: deploy to shared repository

mvn clean deploy

In a build environment, the call mvn clean deploy clean, build and deploy artifacts into the shared repository. When the command is used in a project with one or more sub-projects, Maven traverses every subproject to clean, build and then executes deploy.

Introduction to maven

What is Maven ?

Maven is a project management tool, based on the concept of a project object model (POM).
Maven includes a project lifecycle, a dependency management system and execution of plugin goals at defined phases in a lifecycle.

Convention over configuration

Maven uses convention over configuration. Convention over configuration means that the system assume resonable defaults and the user is not required to do the configuration of the system.

Maven's conventions apply to build phases:

  • a maven project is assumed to produce a JAR file.
  • maven defines a default lifecycle and a set of common plugins that know how to build and integrate software.
  • maven core plugins apply conventions for many common processes.

Maven provides default location of directories:

  • the source code is assumed to be in basedir/src/main/java
  • the tests are assumed to be in basedir/src/test/java
  • the resources are assumed to be in basedir/src/main/resources
  • the compiled code is in basedir/target/classes
  • the JAR is in basedir/target

When you use maven, you write your source code and if you follow the conventions, you only have to put the code in the predefined directory, maven will take care of the rest.

Wednesday, September 7, 2016

How To Install Tomcat In OS X

Tomcat Installation

Download the latest binary distribution of tomcat, in my case apache-tomcat-8.0.37.tar.gz, from apache

Extract the file from the tar archive and move the tomcat folder to /opt:

cd Downloads/
tar -xvf apache-tomcat-8.0.36.tar.gz 
mv apache-tomcat-8.0.36 /opt

Set CATALIA_HOME and PATH Environment Variables

$ nano ~/.bash_profile

# Set Catalina Home
export CATALINA_HOME=/opt/apache-tomcat-8.0.36
# Export Catalina/bin to path

Common Tomcat Commands

To start tomcat, open a shell Terminal window in any directory and issue the command:


Test Tomcat installation by pointing your browser to: http://localhost:8080

To stop tomcat, type on the shell:


To read the log file:

cd /opt/apache-tomcat-8.0.36/logs
tail -f catalina.out

Manager Web Application

The Manager App is an application that comes with Tomcat and allows you to start, stop, reload and undeploy web applications installed in Tomcat

To allow the access to the Manager App add a manager user to the tomcat users configuration file.

Edit the tomcat-users.xml file:

$ nano /opt/apache-tomcat-8.0.36/conf/tomcat-users.xml

add the following two lines:

<role rolename="manager-gui"/>
<user username="manager" password="password" roles="manager-gui"/>

Friday, September 2, 2016

How To Install Maven In OS X

Maven Installation

Download Apache Maven from its website:
Copy the archive file to /opt directory and extract it:
$ cd Downloads
$ cp apache-maven-3.3.9-bin.tar.gz /opt
$ cd /opt
$ tar -xvf apache-maven-3.3.9-bin.tar.gz 

Set M2_HOME and PATH Environment Variables

$ nano ~/.bash_profile

# Set Maven Home
export M2_HOME=/opt/apache-maven-3.3.9

# Export Maven bin to path
export PATH=$PATH:$M2_HOME/bin
You can check the PATH by issuing the commands:
$ echo $PATH
You can check Ant installation by issuing the command:
$ mvn -version
Apache Maven 3.3.9 (bb52d8502b132ec0a5a3f4c09453c07478323dc5; 2015-11-10T17:41:47+01:00)
Maven home: /opt/apache-maven-3.3.9
Java version: 1.7.0_79, vendor: Oracle Corporation
Java home: /Library/Java/JavaVirtualMachines/jdk1.7.0_79.jdk/Contents/Home/jre
Default locale: en_US, platform encoding: UTF-8
OS name: "mac os x", version: "10.11.6", arch: "x86_64", family: "mac"

How to Install Ant in OS X

Ant Installation

Download Apache Ant from its website:

Copy the archive file to /opt directory and extract it:

cd Downloads
cp apache-ant-1.9.7-bin.tar.gz /opt
cd /opt
tar -xvf apache-ant-1.9.7-bin.tar.gz

Friday, August 19, 2016

How To Install JBoss AS 7 in Ubuntu

This guide is aimed at developers wanting to set up their development environment.

First, you should have a JDK-7 installed on your machine. If you have a JDK-8, JBoss AS 7.x will not start.
Then, in your .profile file, set the JAVA_HOME environment variable pointing to java installation.

To download JBoss 7 application server issue the following command on terminal:


Untar the archive:

tar -xvf jboss-as-7.1.1.Final.tar.gz 

Copy the directory to /opt/redhat-jboss-as-7:

sudo cp -r jboss-as-7.1.1.Final /opt/redhat-jboss-as-7

You don't want the jboss process to run as root on your machine, so you need to change the owner and owner group of jboss. Assume you are logged as the user max, to set the owner user and owner group on the jboss directory, issue the following command:

sudo chown -R max:max /opt/redhat-jboss-as-7

To start JBoss type on the shell:

max@ubuntu-host:/opt/redhat-jboss-as-7/bin$ ./

Monday, August 15, 2016

How To Install Tomcat in Ubuntu

Install Oracle's JDK

Install Java, see here

Set the JAVA_HOME, CATALINA_HOME and PATH environment variables

The JAVA_HOME variable is used by Java Servers such as Tomcat and JBoss, and by build tools such as Ant and Maven, and by other Java applications.

The CATALINA_HOME variable is required by when running Tomcat from command line to locate the files stored in $CATALINA_HOME/conf and $CATALINA_HOME/logs directories.

To set user environment variables edit the ~/.profile:

max@ubuntu-host:~$ nano ~.profile

Append the following lines to the ~.profile file:

export JAVA_HOME=/usr/lib/jvm/java-8-oracle
export CATALINA_HOME=/opt/apache-tomcat-8.0

Thursday, August 11, 2016

How to Install Java In Ubuntu

Which Version of Java to Use?

  • JavaSE 7 supports:
    • eclipse mars
    • JBoss AS 7 with Java EE 6 features
    • Tomcat 7-8 with WebSockets
  • JavaSE 8 supports:
    • eclipse neon
    • JBoss WildFly with Java EE 7 features
    • Tomcat 9 with Java EE 8 features

Java SE Development Kit 7 (JDK-7) Installation

To install Oracle's Java, use PPA personal repositories by WEB UP8. Ubuntu public repositories only support OpenJDK.

Copy and paste the following lines into terminal, one-by-one:

sudo add-apt-repository ppa:webupd8team/java
sudo apt update
sudo apt install oracle-java7-installer

You can check Java installation by issuing the java -version command:

user@host:~$ java -version
java version "1.7.0_80"
Java(TM) SE Runtime Environment (build 1.7.0_80-b15)
Java HotSpot(TM) 64-Bit Server VM (build 24.80-b11, mixed mode)

Monday, July 25, 2016

jQuery and forms

Selecting form controls with jQuery selectors

jQuery selector working with forms are not always the fastest option to select elements: when you use them remember to reduce the number of elements jQuery needs to look through. Orthewise, use common CSS selectors

Example of use of jQuery selectors for forms

/* to start, select all form descendants,
   then, use the filter() method on the initial selection */
var $formDescs = $('form *');

/* :input selects all button, input, select and textarea */
var $inputs = $formDescs.filter(':input');
/* :text selects input type="text" and input */  
var $text = $inputs.filter(':text'); 

/* :password selects input type="password" */
var $password = $inputs.filter(':password');   

/* :button selects button and input type='button' */
var $button = $inputs.filter(":button");  

/* :checked selects all checked inputs from group of radio and check inputs */
var checked = $inputs.filter(":checked");

/* :selected selects all selected options from drop boxes */
var selected = $inputs.filter(":selected"); 

Wednesday, July 13, 2016

jQuery Effects


jQuery effects includes transitions and movements

  • show and hide elements
  • animate elements with fade in and fade out
  • animate elements with slide up and slide down
jQuery method method meaning
Basic Effects $('selector').show() set the display CSS property to element's default value
$('selector').hide() set the display CSS property to none
$('selector').toggle() toggle between showing and hiding elements
Fading Effects $('selector').fadeOut() make element disappear by changing both opacity and display CSS properties
$('selector').fadeIn() make element appear by changing both opacity and display CSS properties
$('selector').fadeTo() change the opacity CSS property
$('selector').fadeToggle() hide or show the element
Sliding Effects $('selector').slideUp() hide the element with sliding movement
$('selector').slideDown() show the element with sliding movement
$('selector').slideToggle() hide or show the element
Custom Effects $('selector').delay() delay the execution of the following method
$('selector').stop() stop the animation
$('selector').animate() create a custom animation

Monday, July 11, 2016

jQuery Traversing and Filtering

DOM Traversing

The jQuery methods for traversing the DOM allow to access other element nodes relative to the initial selection.

jQuery methodmethod meaning
$('selector').find('selector2') all the elements in the current selection matching selector2
$('selector').closest('selector2') the nearest ancestral element matching selector2
$('selector').parent() the direct parent element of current selection
$('selector').parents() all the parents of current selection
$('selector').children() all the children of current selection
$('selector').next() next sibling of current element
$('selector').prev() previous sibling of current element

Monday, July 4, 2016

jQuery and events

Checking When a Page is Ready For Your Code

The ready() method executes its function argument when the page is ready to work

  // function body
  • Behind the scenes, the ready() method add a listener for DOMContentLoaded events or for load events (in browsers that do not support HTML5 events a load event is fired instead)

There is a shorthand code for the ready() method:

  // function body

If you do not wish to use jQuery but still run your code when the page is ready to work, place your script before the body closing tag.

Friday, July 1, 2016

Scripting DOM and CSS with jQuery

Getting and Setting Element Content

The .html() and .text() methods retrive and update the content of elements.

How To Retrieve Element Content

jQuery methodmethod meaning
html = $('selector').html() get the HTML content of the first element in the jQuery selection
text = $('selector').text() get the textual content from every element in the jQuery selection and any descendant

Saturday, May 28, 2016

Introduction to jQuery Library

What is jQuery

jQuery is a javascript library you include in your web pages.
jQuery allows you to select elements using a CSS-style selector and do something with those elements by calling a jQuery method.

Selecting HTML elements with jQuery

$('p');  /* a jQuery object */
  • $() works as short invocation to the jQuery() function
  • $() creates a jQuery object which stores references to the selected elements

Friday, March 11, 2016

CSS Selectors Level 3

1. Selector Syntax


A selector is one or more sequences of simple selectors separated by combinators, an optional pseudo-element may follow the last sequence of simple selectors

selector = sequenceOfSimpleSelectors [combinator1 sequenceOfSimpleSelectors1 ... ] [::pseudoElement]

A sequence of simple selectors

  • it is a chain of simple selectors that are not separated by a combinator
  • it always begins with a type selector or a universal selector. No other type selector or universal selector is allowed in the sequence
  • simple selectors are: type selector, universal selector, attribute selector, class selector, ID selector, pseudo-class.
  • combinators are: whitespace, > "greater-than sign", + "plus sign", ~ "tilde"

The subjects of a selector are the elements of a document tree that are represented by the selector.

Thursday, February 18, 2016

Types of JavaScript Events

W3C DOM Events

DOM Level 2 UIEvent: user interface events occur for interactions with browser's window
type event description target
load Fires when HTML and all resources of a web page have finished loading document, window
unload Fires when web page is unloading for a new page requested body, window
error Fires when browser encounter a JS error or resource does not exist (inconsistent support)
resize Fires repeatedly as browser's window is being resized window
scroll Fires repeatedly as user scrolls web page document, element


  • The load event is commonly used to trigger scripts that access the content of a page. It can cause the page to look slow, because it is raised only when all images are fully loaded.
  • As resize and scroll events fire repeatedly, do not use them to trigger complicated code.

Thursday, February 11, 2016

JavaScript Events

Types of Events

In a browser events are dispatched to objects to signal that something has happened, such as network activity or user interaction.
  • W3C DOM Events Interfaces
    • UIEvent: user interface events occur for an interaction with browser's window
    • FocusEvent: occur when an element (link or form field) gains or loses focus
    • MouseEvent: occur when user uses mouse, touchscreen, trackpad
    • KeyboardEvent: occur when user uses keyboard
    • [deprecated] MutationEvent: occur for a modification of DOM structure or DOM node
    • MutationObserver: occur for a modification of DOM structure or DOM node
  • W3C HTML5 Events Interfaces
    • FormEvent: occur for an interaction with form element
    • Various Interfaces: occur for an interaction with web page
  • Vendor Specific BOM Events
    • Events that deals with touchscreen and accelerometer

Friday, January 15, 2016


Browsers come with a set of built-in objects that model data used and operations performed by your applications:
  • The Browser Object Model API (BOM) features Window object that models browser's windows and tabs.
  • The Document Object Model API (DOM) features Document object that models web pages displayed in browser's windows.

The DOM API specification serves two purposes:

  • how browser should make a model of HTML documents using objects:
    When a browser loads a web page, it creates a structure, a DOM tree, that is a live representation of the web page. The DOM tree is made of Node objects and each node represents an element that is part of the web page.
  • how JS programs can access this model for changing HTML documents:
    JavaScript program can access the DOM tree for modifying the HTML document. This does not change the HTML code, but only the DOM, the representation of the document.

Friday, January 1, 2016

HTML attributes and DOM Element properties

HTML Global Attributes

An HTML element consists of a tag and a set of attributes, an attribute being a pair name="value".

HTML Global attributes are attribute common to all HTML elements. They are divided in three subtypes: core attributes, event-handler attributes and xml attributes

HTML 4.1 Core Attributes
  • id: a unique identifier for the element
  • class: classifies similar elements, for semantic purposes or for presentation purposes.
  • style: adds presentational properties to the element
  • title: attaches textual explanation to the element
  • lang: defines the language of the element
  • dir: the reading direction
  • accesskey: indicates a keyboard shortcut key
  • tabindex: specifies the tab order index
HTML 5 Core Attributes
  • contenteditable: specifies whether a user can edit the content of the element
  • contextmenu: specifies a <menu> for the element
  • data-*: custom attribute for the element
  • draggable: specifies whether a user can drag the element
  • hidden: hides the element
  • spellcheck: specifies whether the element should be checked for spelling and grammar or not
  • translate: specifies whether content of the element is to be translated or not when page is localized

HTML Attributes as DOM Element Properties

In the DOM an HTMLElement object represents an element of an HTML document. The attributes of an element become properties of the corresponding DOM HTMLElement object.

For example, you may set up google analytics for your web site, in that case you have to include in the home page a script like the one below, where you create a <script> element and then you set the attributes type, async and src using the dot notation.

var _ga = document.createElement('script'); 
 _ga.type = 'text/javascript'; 
 _ga.async = true;
 _ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '';