Wednesday, January 22, 2014

Create Maven project from command line

This post shows how to create a Maven project from command line. Creating a Maven project from command line is note a difficult task. Following are the steps.

  1. Create a directory "testApp" and move into that directory
  2. Run the following command, which will do some downloading from the repository
    mvn archetype:generate
    
  3. Then you will be asked to select a preferred configuration from the given list. It will prompt with a default archetype "org.apache.maven.archetypes:maven-archetype-quickstart" selected. No need to enter a value. Just press enter for the moment.
  4. It will prompt you to select the version of the archetype. By default the latest is selected. No need to enter a value. Just press enter.
  5. It will prompt you for several other inputs
    • Define value for property 'groupId': : com.example.testapp
      
      • This will be the package id
    • Define value for property 'artifactId': : mytestapp
      
      • This will be the name of the final .jar file and whole project will be created inside a directory having this name
    • Define value for property 'version':  1.0-SNAPSHOT: :
      
      • No need to give any input, just press enter
    • Define value for property 'package':  com.example.testapp: :
      
      • No need to give any input, just press enter
    • Confirm properties configuration:
      groupId: com.example.testapp
      artifactId: mytestapp
      version: 1.0-SNAPSHOT
      package: com.example.testapp
       Y: : Y
      
      • Confirm the given information by entering 'Y'
  6.  You will see the following out put or similar
    [INFO] ----------------------------------------------------------------------------
    [INFO] Using following parameters for creating project from Old (1.x) Archetype: maven-archetype-quickstart:1.1
    [INFO] ----------------------------------------------------------------------------
    [INFO] Parameter: groupId, Value: com.example.testapp
    [INFO] Parameter: packageName, Value: com.example.testapp
    [INFO] Parameter: package, Value: com.example.testapp
    [INFO] Parameter: artifactId, Value: mytestapp
    [INFO] Parameter: basedir, Value: /home/<custom-path>/testApp
    [INFO] Parameter: version, Value: 1.0-SNAPSHOT
    [INFO] project created from Old (1.x) Archetype in dir: /home/<custom-path>/testApp/mytestapp
    [INFO] ------------------------------------------------------------------------
    [INFO] BUILD SUCCESS
    [INFO] ------------------------------------------------------------------------
    [INFO] Total time: 2:58.495s
    [INFO] Finished at: Wed Jan 22 01:29:20 IST 2014
    [INFO] Final Memory: 13M/981M
    [INFO] ------------------------------------------------------------------------
    
  7. A new directory structure along with a pom.xml file is now created. This directory structure and the configurations inside the pom.xml is selected by the archetype. As we didn't specify any archetype, the default "org.apache.maven.archetypes:maven-archetype-quickstart" is used and project is configured according to that.
  8. At this stage you have success fully created a new Maven project using command line.

How to Install Maven (Apache Maven)

Installing Maven on your system is a trivial task. Fully functional ready to use distributions are available at http://maven.apache.org.

  1. You can download the latest Maven distribution from the following link http://maven.apache.org/download.cgi
  2. Then extract the downloaded tar ball. You can do this by the following command
    tar zxvf apache-maven-<version>-bin.tar.gz
    
  3. Add maven bin directory to the PATH environment variable
    export PATH=<maven-location>/bin:$PATH
    
  4. Set M2_HOME environment variable
    export M2_HOME=<maven-location>
    
Now maven is ready to run on your system

Try the following command from any location to confirm Maven is working properly.


mvn –version

Thursday, January 16, 2014

Address Book (Jaggery Application)


This is a very simple application written in Jaggery. It is basically a address book which supports adding new record to the book and deleting records from the book. This application is purposely restricted to those functionalities to keep the code simple to make it easier for the newbies.

Prerequisites
Jaggery should be downloaded and the server should be running. http://jaggeryjs.org/howto.jag

Step 1
Create directory “addressbook”, inside the 'apps' directory. ({JAGGERY_HOME}/apps/)
So your new directory should look like, {JAGGERY_HOME}/apps/addressbook

Step 2
Create a file called “index.jag” inside the directory “addressbook”

Add the following code snippet to the file “index.jag”
NOTE: This is not a part of the Address Book application. But this will help you to see that your application is working.


1
2
3
<%
    print(“Address Book”);
%>

Wait a while until the server automatically deploy your new application.
Goto the below link via your web browser. It should show “Address Book” in the page.
Link http://localhost:9763/addressbook/index.jag


Step 3
Create a file called “jaggery.conf” inside the directory “addressbook”
This one of the most important files in the Jaggery application. It contains application level configurations. For more information please refer http://jaggeryjs.org/apidocs/jagconf.jag

Add the following basic configurations to the jaggery.conf file.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
{
    "displayName":"Address Book", 
    "welcomeFiles":["index.jag"],
    "urlMappings":[       
        {
            "url":"/records/*",
            "path":"/controller/records.jag"
        }
    ]
}

This is need to see the correct display name in the management console. To see please follow the link below
https://192.168.184.1:9443/admin/carbon/

Step 4
Add the following code to the index.jag file

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
<html>
    <head>
        <title>
            AddressBook
        </title>
        <link href="css/styles.css" rel="stylesheet"></link>
  
    </head>
    <body onload="AddressBook.viewAllRecords()">
        <div class="main_container">
            <div class="row">
                <div class="header">
                    <span class="title">Address Book</span>
                </div>
            </div>
            <div class="row">
                <div class="inputForm">
                    <form action="" id="addNewRecordForm" name="addNewRecordForm">
                        <table>
                            <tr>
                                <td>Name</td>
                                <td>: <input id="name" type="text" /></td>
                            </tr>
                            <tr>
                                <td>Address</td>
                                <td>: <input id="address" type="text" /></td>
                            </tr>
                            <tr>
                                <td>Telephone</td>
                                <td>: <input id="telephone" type="text" /></td>
                            </tr>
                            <tr>
                                <td></td>
                                <td class="add_record_button"><a class="#" onclick="AddressBook.addNewRecord();">Add Record</a></td>
                            </tr>
                        </table>
                    </form>
                </div>
            </div>
            <div class="row">
                <div id="records">
                </div>
            </div>
            <div class="footer">
                JD&copy
            </div>
        </div>
        <script src="js/jquery.min.js"></script>
        <script src="js/mustache.js"></script>
        <script src="js/addressbook.js"></script>
    </body>
</html>

Step 5
Create a directory called "js", and a file called "addressbook.js" inside it. And copy latest versions of "jquery.min.js" and "mustache.js"

Add the following code in to addressbook.js

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
AddressBook = new function() {

this.addNewRecord = function () {
    console.log("Function called addNewRecord");

    var name = $("#name").val();
    var address = $("#address").val();
    var telephone = $("#telephone").val();

    if(name == null || name == ""){
        alert("Name is null");
        return false;
    } else if(address == null || address == ""){
        alert("Address is null");
        return false;
    } else if (telephone == null || telephone == ""){
        alert("Telephone is null");
        return false;
    }

    if(!AddressBook.validateTelephone(telephone)){
        return false;
    }

    AddressBook.resetInptForm();

    //console.log("Name:" + name);
    //console.log("Address:" + address);
    //console.log("Telepone:" + telephone);

    var data = {"name":name, "address":address, "telephone":telephone};

    AddressBook.makeRequest("POST", "/addressbook/records/", data, function(hmtl){AddressBook.viewAllRecords();});
}

this.resetInptForm = function(){
    $("#name").val('');
    $("#address").val('');
    $("#telephone").val('');
}

this.validateTelephone = function(telephone){
    var stripped = telephone.replace(/[\(\)\.\-\ ]/g, '');
    if(isNaN(parseInt(stripped))){
        alert("Invalid telephone number");
        return false;
    }else{
        return true;
    }
}

this.makeRequest = function (type, url, data, callback){
    console.log("Function called makeRequest");

    $.ajax({
        type: type,
        url: url,
        data: data,
        dataType: "json",
        success: callback
    });
}

this.viewAllRecords = function () {
    console.log("Function called viewAllRecords");

    // Requsting all the records
    AddressBook.makeRequest("GET", "/addressbook/records/", null, function(html){AddressBook.loadRecords(html);});
}

this.loadRecords = function(data) {
    console.log("Function called loadRecords");

    // Updating the display with new records
    $.get('template/record.html', function(templete) {var html = Mustache.to_html(templete, data); $("#records").html(html);});
}

this.deleteRecord = function(id){

    var answer = confirm("Are you really want to delete?");

    if(answer){
        var data = {"id":id};
        AddressBook.makeRequest("POST", "/addressbook/records/", data, function(hmtl){AddressBook.viewAllRecords();});
    }
}

}

Step 6
Create a directory called "controller", and a file called "records.jag" inside it.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<%
include("../model/recordQuery.jag");

var verb = request.getMethod();
var name = request.getParameter('name');
var address = request.getParameter('address');
var telephone = request.getParameter('telephone');
var id = request.getParameter('id');

if(verb == "POST" && name != null && address != null && telephone != null) {

    var log = new Log();
    log.debug("Adding new record. [Name=" + name + ", Address=" + address + ", Telephone=" + telephone + "]");

    addRecord(name, address, telephone);

} else if(verb == "POST" && id != null ) {
    var log = new Log();
    log.debug("Deleting record. [Id=" + id + "]");

    deleteRecord(id);

} else if(verb == "GET") {
    listAllRecords();
}

%>

Step 7
Create a directory called "model", and a file called "recordQuery.jag" inside it.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<%

function addRecord(name, address, telephone){

    var records = session.get("records");
    if (records == null){
        records = new Array();
        session.put("records", records);
        session.put("id", 0);
    }
    
    var id = session.get("id") + 1;
    session.put("id", id);

    var record = {"id":id, "name":name, "address":address, "telephone":telephone};
    records.push(record);

    //var log = new Log();
    //log.info(session.get("records"));
}

function listAllRecords(){
    var records = session.get("records");

    //var log = new Log();
    //log.info(records);

    if (records != null){
        records.sort(sortRecords);
        print({"records" : records});
    }else {
        print("No records");
    }
}

function sortRecords(first, second){
    if (first.name < second.name){
        return -1;
    }
    else if(first.name > second.name){
        return 1;
    }
    else {
        return 0
    }
}

function deleteRecord(id){
    var records = session.get("records");

    for (var index = 0; index < records.length; index++){
        var record = records[index];
        if(record.id == id){
            var temp_record = records[records.length - 1];
            records[records.length - 1] = records[index];
            records[index] = temp_record;

            records.pop();

            break;
        }
    }
}

%>

Step 8
Create a directory called "template", and a file called "record.html" inside it.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<div>
<table class="record_table">
    <tr class="table_header">
        <td>
            Name
        </td>
        <td>
            Address
        </td>
        <td>
            Telephone
        </td>
        <td>
        </td>
    </tr>
{{#records}}
    <tr class="table_row">
        <td class="column_name">
            {{name}}
        </td>

        <td class="column_address">
            {{address}}
        </td>

        <td class="column_telephone">
            {{telephone}}
        </td>

        <td class="column_delete">
            <a href="#" class="delete" onclick="AddressBook.deleteRecord({{id}})">Delete</a>
        </td>
    </tr>

{{/records}}
</table>
</div>

The AddressBook is now ready with adding records and deleting records.
Try yourself to add the update functionality to this.