Monday, July 9, 2012

Client side templating


Client side templating


I am working for some time with javascript and jQuery and in all project I found my self in need of a small script that does a simple thing:
I have a small html template like this
<span>The is a text from {source} and the author {author}</span>
and an object {'source' : 'Journal of medicine', 'author', 'John Doe'}. 
The javascript should replace the placeholders {source} and {author} with the key values from the given object. The result would be the following:
<span>The is a text from Journal of medicine and the author John Doe</span>


Because I needed this script in a couple of projects I wrote a small jQuery plugin called jquery-template.
It is simple to use:
var str = "<span>The is a text from {source} and the author {author}</span>";
$('<div>').template(str,{'source' : 'Journal of medicine', 'author', 'John Doe'}).apendTo('body');
The above code will process the string, will replace the content of the div and it will appended it to the body.
Other examples on how to use the jquery-template can be found here.
Enjoy using it.

Thursday, April 5, 2012



Part 3: Play Application - Code analysis with Sonar

In CI Part 1 I have shown you how to configure Play Framework, how to configure the Jenkins Play Plugin.
In CI Part 2 I have shown you how to post your modules to a Nexus server, how to use the repository in the dependencies file, chained dependencies, continuous integration and auto deploy.
In this post I will show you how to do code analysis with Sonar for a !Play application.

Intro

The Play Framework is new around the block so the written is "not so pure OO code"(lots of static methods or POJOs with public fields) so the default sonar rules are violated. Because of this you will need to customize the sonar rules.
I have checked the web for sonar play plugin but didn't found anything so I have used the sonar-ant-task v.1.3.

Before going ahead check if you have the !Play framework installed. If not read CI Part 1 to see how to install it. Also you will need Ant installed on your machine.


Configure Ant on your machine

If you already have Ant installed then you can skip this section.

Download ant from here. Next follow the installation steps:

1. Unzip ant
    tar apache-ant-1.8.2-bin.tar.gz /destionation (hope this command is ok)
2. Create symbolic link to ant (this will help you at version upgrades)
    ln -s /destination.apache-ant-1.8.2 ant
3. Add ant to path. You will need to edit the profile file(usually is located in /etc folder)
    vi /etc/profile
    Add this to at the end of the file:
    ANT_PATH=/destination/ant
    export ANT_PATH

   PATH=$PATH:$ANT_PATH/bin
   export PATH
4. Logout so the paths are updated.

There you are, ant is installed and added to path; ant is ready to use.

Install sonar-ant-task

Download the sonar-ant-task from here.
Copy it in ant libs folder /destination/apache-ant-1.8.2/lib

Configure ant build with sonar task

Bellow is the basic build.xml for your play app and it should be located in your play app root folder.

<project basedir=".">
<property environment="env" />
<!-- We need the play path in the path -->
<property name="play.path" value="${env.PLAY_PATH}" />
<!-- We need the ant path in the path -->
<property name="ant.path" value="${env.ANT_PATH}"/>
<!-- Use the default play build.xml -->
<import file="${play.path}/resources/application-build.xml" />
<!-- Use sonar ant task -->
<taskdef uri="antlib:org.sonar.ant" resource="org/sonar/ant/antlib.xml" >
       <classpath path="${ant.path}/lib/sonar-ant-task-1.3.jar"/>
</taskdef>
<!-- The sonar task code analysis -->
<target name="sonar">
       <!-- Project name -->
       <property name="sonar.projectName" value="MyProjectName" />
       <!-- Location of the compiled classes -->
       <property name="sonar.binaries" value="precompiled/java/controllers"/>
       <!-- Source folder -->
       <property name="sonar.sources" value="app"/>
       <!-- Sonar hist -->
       <property name="sonar.host.url" value="localhost:9000"/>
       <property name="sonar.jdbc.url" value="jdbc:derby://localhost:1527/sonar"/>
       <property name="sonar.jdbc.driverClassName" value="org.apache.derby.jdbc.ClientDriver"/>
       <property name="sonar.jdbc.username" value="sonar" />
       <property name="sonar.jdbc.password" value="sonar" />
       <property name="sonar.dynamicAnalysis" value="reuseReports" />
       <property name="sonar.surefire.reportsPath" value="test-result" />
       <property name="sonar.cobertura.reportPath" value="test-result/code-coverage/coverage.xml" />
       <!-- This will create a project in sonar -->
       <sonar:sonar key="org.example:MyProjectName" version="0.1-SNAPSHOT" xmlns:sonar="antlib:org.sonar.ant"/>
</target>
<!-- Cleanup test results task -->
<target name="clean-tests-results">
    <delete dir="test-result" />
</target>
<!-- Run play auto-test comand -->
<target name="autotest">
     <exec executable="play">
         <arg value="auto-test" />
     </exec>
</target>
<target name="compile">
     <exec executable="play">
         <arg value="precompile" />
     </exec>
</target>
<!-- Run play auto-test comand -->
<target name="quality" depends="clean-tests-results, compile, autotest, sonar" />
</project> 

You are ready to do some code analysis, just run this command:
> ant quality

Code analysis takes some time but does the job.

Configure Jenkins job

I am a lazy person and I don't want to run what ever command to do the code analysis so I'll configure a Jenkins job so it will do all the hard work for me. 
If you don't have Jenkins CI installed check the my previous two post about continuous integration to see how it's done.

To configure a Jenkins job with ant is simple:

1. Create a new Jenkins job with and build
2. Fill in the targets field with: quality
3. Fill in Build file field: MyProjectName/build.xml
4. Save and you are done.


Conclusion

So there you are boys and girls: continuous integration with code analysis using sonar. I still have to customize the sonar rules.

Tuesday, February 28, 2012


Part 2: Continuous Integration (CI) with Jenkins for a application using Play Framework 

In CI Part 1 I have shown you how to configure Play Framework, how to configure the Jenkins Play Plugin. In this post I will show how to post your modules to Nexus server, how to use the repository in the dependencies file, chained dependencies, continuous integration and auto deploy.

Intro

When working on an application in the early stage you will go on and build the requirements. But as the application grows you find necessary to split your application in different components. In time after you build more and more applications you realize that those components can be used across different applications.
To achieve this Play framework provides us with modules. A play module is nothing more than a play application with a small difference that it doesn't have an application.conf file and it is not meant to run on its own, it needs to be included in a containing application. You can read more details about pay modules and how to use them in this fine article: Divide and conquer play framework modules.

Modules and Apps

Usually when working with play you will have a play application and several modules. In the bellow diagram you can see and example. The "MyWebApp" applications depends on three modules:
MyWebApp and its dependencies

To create a play application I'll use the following command:
    > play new MyWebApp

Then I will create my modules:
   > play new-module Module1
    > play new-module Module2
    > play new-module Module3

Then folder structure would look like this:
/myProjects/
    /yoda/Module1-1.0
    /yoda/Module2-2.1
    /yoda/Module3-3.0
    /MyWebApp
  
So this is it. You have a web app ready and a couple of modules, but how to use those modules in your application? Check the next chapter.

Configure dependencies

Each Play application, in conf folder has a file called dependencies.yml used to dependency management for your application. 
For MyWebApp the dependencies.yml should look like this:

# Dependencies

require:
 - play

This is simple, but I still don't have the the modules in dependencies, so I can define repositories. Because my modules are in the local files system I will define a local repository, so the dependencies.yml will look look this:

# Dependencies

require:
 - play
 - yoda -> Module1 1.0
 - yoda -> Module2 2.1
 - yoda -> Module3 3.0
repositories:
 - MyLocalRepo:
    type: local
    artifact: ${application.path}/../[organization]/[module]-[revision]
    contains:
      - yoda -> *

When running the play deps --sync --clearcache command, when resolving the dependencies the dependency resolver will search in folder /myProjects/ for organization yoda/ for modules Module1, revision 1.0, Module2 revision 2.1 and Module3 revision 3.0, as declared in the dependencies.yml require section. 
I have only explained the basic and practical stuff, the play dependency mangement has more details on dependency management.

Post to Nexus

So far so fine, but you need to have the modules in the local file system. Probably you will work with a SCM  like GIT or SVN and you will need to checkout all modules in your file system and create all the folder structure. On top of all you will need to constantly update your code. That is a lot of overhead if you ask me:  Nexus to the rescue.

Before showing you how can you post to Nexus I will explain how the dependencies.yml file should look for a play module.

# Module dependencies file

self Module1 1.0

require:
    - play 1.2.4

The first line is the module name declaration with the module revision number, then we have the required section where I have declared play and play version. The play version is optional but when running the play build-module command, it will ask for play version.

A couple of days ago I have found this snippet. Its a play command that posts a module to a repository. This play command requires the python library poster. After you have installed that python library the command is easy to install and use. Download the nexus.py file in ${play.path}/framework/pym/play/commands/ and that is it, you can use just like any other play command.

How to use Nexus command:

First you need to add in the module application.conf a couple of nexus configurations:

nexus.server.url=http://myNexus.server.org/repo/artifact-group
nexus.server.user=MyUser
nexus.server.password=password

Run the following commands:

play build-module //creates [module]-[version].zip in folder [module]/dist

Next run command:

play nexus-commit [-a] // -a: pushes the file without confirmation

The command will look for the [module]-[version].zip file in dist folder and post the file to nexus at address http://myNexus.server.org/repo/artifact-group/[module]/[version]-SNAPSHOT/[module]-[version]-SNAPSHOT.zip

Configure a chained repository

With that nice nexus play command I have posted my module to a repository and now I can configure the dependencies for MyWebApp to use the nexus to retrieve the module dependencies, so I don't need all my modules in my file system(only the ones I work on) and I don't bother with doing constant updates on modules that I don't work(We will see why in the next chapter when I'll show you how to configure Jenkins).
So the dependencies.yml will look like this now:

# Dependencies

require:
 - play
 -  artifact-group -> Module1 1.0
 -  artifact-group -> Module2 2.1
 -  artifact-group -> Module3 3.0

repositories:
 - MyChainedRepo:
    type: chain
    using: 
      - LocalModules:
          type: local
          artifact: ${application.path}/../[organization]/[module]-[revision]
      - MyNexus:
          type: http
          artifact: http://myNexus.server.org/repo/artifact-group/[module]/[version]-SNAPSHOT/[module]-[version]-SNAPSHOT.zip
    contains:
      - artifact-group -> *

This chain dependency will look for the required modules in the local file system and if are not found then it will download them from nexus.

Continuous Integration

In CI Part 1 I have explained you how to create a Jenkins job for a play application and a play module. I want to post all my modules to nexus using Jenkins. 
The solution is very simple, I will create a Jenkins for each of my modules and besides the standard commands:

play deps --sync --clearcache
play precompile
play auto-test
play build-module

I will add the nexus command to post the module to nexus

play nexus-commit -a

This is it, your latest changes are available on Nexus.

Auto-deploy for MyWebApp:

I want all my changes to be available for testing as soon as possible so you can configure autodeploy  for your web app. You just need to create a Jenkins job, and add this commands:

play deps --sync --clearcache // clear all my cached dependencies and synchronize them
play precompile // If it's a problem in the java classes then the job will fail
play auto-test
play restart --http.port=<port>

When working on a application that uses Play you will notice that all your modifications are available just after you've saved the file you have modified. Well, almost all modifications because after a modification in application.conf, you will need to restart the server.

Conclusions

Well, this is about it related with continuous integration. I hope it helps and I am waiting for feedback.

P.S. I am also working on some code analysis with sonar but because Play Framework doesn't follow the "Java Best Practices" rules, sonar rates are small for the code.

Sunday, February 19, 2012

Part 1: Continuous Integration (CI) with Jenkins for a application using Play Framework 

Intro

A few months ago I have found Play Framework and I started using it to develop a web project. Before using play I was used with Struts, Spring MVC or other web frameworks and also I was using maven to build and pack my applications.
In a large scale project it is a need to have CI configured and automatic deployment. The CI server I use is the open source server Jenkins. If you don't have Jenkins installed and configured check this link for help.

Install play framework

You need to download Play unzip and add the play location into path. If you know how to add a folder to the path then skip the next lines and check how to install the play plugin for Jenkins.
I did the configuration as root:
  1. Unzip play:
    unzip play-1.2.4.zip /destination
  2. Create symbolic link to play(This will help us at version upgrades):
    ln -s /destination/play-1.2.4 /destination/play
  3. Add play to path:
    vi /etc/profile
    The command above will open the profile file for edit.
    Add the following at the end of the file:
    PLAY_PATH=/destination/play
    export PLAY_PATH
    PATH=$PATH:$PLAY_PATH
    export PATH
  4. Logout so the paths are updated.
There you are, play is installed and added to path; it is ready to use

Install Play plugin for Jenkins

Got to Manage Jenkins -> Manage Plugins - > Available Plugin, check on playframework-plugin and install. Restart webserver or Jenkins server (depending if Jenkins is deployed in a webserver or is started as a service). Or you can install it manually by downloading the Jenkins Play plugin.

Configure Jenkins job

Ok, we have installed Play! Framework and configured in path, we’ve installed the Play Plugin for Jenkins, let’s see how we create a Jenkins job for a play project in a few easy steps:
  1. Click on ‘New Job’ in Jenkins dashboard.
  2. Choose a name for your project then click on ‘Build a free-style software project’.
  3. Configure the Play! Application path.
    Jenkins checks out the code from a repository into a working directory. Usually the working directory will be /root/.jenkins/jobs/MyPlayProject/workspace but I have changed the location because when trying to zip the play module using the play build-module command, for some reason when creating a zip file in a hidden directory nothing is written in it. So because of the above motives I have changed the Job working directory to /jenkinsjobs/MyPlayProject/workspace.
    In the workspace folder you will have:
    workspace
    api
    my-play-project

    Check Play! Application path and fill in the path field wih ‘my-play-project’.
  4. Configure source code management GIT/SVN.
  5. Configure Build. From dropdown ‘Add build Step’ choose Play.
  6. Configure play commands:
    I usually add the following commands when building my play modules:
    deps --sync --clearcache
    auto-test
    build-module
    Check this cheat sheet to test other play commands.
  7. save and you are done.

Coming next...

Next I'll show you how you can configure code analysis with Sonar, how to upload your modules to a Nexus and create a dependency chain for your projects.

Check Part 2: Continuous Integration (CI) with Jenkins for a application using Play Framework.