Setting Development Environment Up for Mobile Application Development

Hi everyone, today in this blog post, i would like to share with you knowledge related to Mobile application development. it is broad area to discuss but i will only be discussing Android, iPhone and iPad application development using Titanium Studio.

First of all, in any programming project all us face a common problem it is how to set up the development environment. Therefor we will first learn how to set up the development environment for Android , iPad and iPhone application development.

Setting up development environment for iPad application development.

1) First you need to have MacOS with you to start developing applications for iOS

2) Apple don't want you to install MacOS on any computer than what apple develops. So how do you start developing iPad application or iPhone application if you have IBM computer running windows operating system. Frankly speacking this is the case for may people how are starting to develop applications for iPhone, iPad devices.

Maven Web Application Development

You need to have Java 1.6 or higher version, eclipse IDE for J2EE developers , Maven 2.2.1 or higher version and Apache Tomcat 6.0 or higher version installed on your system to follow this tutorial.

Step1 : Integrate m2eclipse plugin into eclipse 

Get the m2eclipse url from the following site (figure 1)

http://eclipse.org/m2e/download/

Figure 1

Open up your eclipse ->  Help -> Install New Software -> Click Add

Put m2eclipse under Name field and Copy the url to Location box (figure 2)

Figure 2

Click Ok and it will  list m2e under plugins to be installed (figure3). 

Figure 3

Select it then click next -> next -> finish.

wait till it is finished downloading required dependencies in to your eclipse instance.

When it is done restart your eclipse IDE. 

Now you have completed installing m2e on your eclipse instance...!

Step2 : Create New Maven Project

Open up your eclipse instance.

File  ->  New -> Other ->  Expand Maven -> Select Maven Project -> Click Next ->
Select Workspace Location (figure 4) Click Next

Figure 4

Select maven-archetype-webapp (figure 5) Click Next 

Figure 5

Set GroupID, ArtifactID and Package name as given below (Figure 6), Leave Version to the default value given.

Figure 6

Click Finish

Step 3: Add maven-compiler-plugin and maven-eclipse plugin in to pom.xml

Figure 7

Add following configuration under <build></build> section of the project pom.xml

<plugins>

     <plugin>

     <groupId>org.apache.maven.plugins</groupId>

     <artifactId>maven-eclipse-plugin</artifactId>

     <configuration>

     <wtpversion>1.5</wtpversion>

     </configuration>

     </plugin>

     <plugin>

     <groupId>org.apache.maven.plugins</groupId>

     <artifactId>maven-compiler-plugin</artifactId>

     <configuration>

          <source>1.6</source>

          <target>1.6</target>

        </configuration>

     </plugin>

    </plugins>

After adding above configuration it will look like as follows... ( figure 8 )

Figure 8

Step 5: Applying the changes made to the project and download the dependencies [This step is important]

Following Guide is for Windows Users...

Windows7 ships with a command prompt named as Windows PowerShell in which you get the freedom to use linux shell commands.

use that command prompt change to the directory where your project is located using

cd 

command.

then follow the Linux and Mac Users guide where you can use same commands on Windows power shell and even in windows command prompt.

Following Guide is for Linux, Mac Users...

Open up a Terminal and change to your project directory.

Type  $ mvn  clean install

Then Type  $ mvn eclipse:eclipse

This will download required libraries in to maven repository.

Go back to eclipse and refresh your project

Then your project structure will be changed as shown below ( figure 9 )

Figure 9

Step 6 : Add source directory to your project

right click on main directory and create new  folder named java as shown below ( figure 10 )

Figure 10

Get back to your Terminal (for mac and linux users) or command prompt (for windows users) and type 

$ mvn clean install 

and then

$ mvn eclipse:eclipse

as earlier

this will change the project structure to the following look ( figure 11 )

Figure 11

At this stage you won't understand why we need src/main/java folder, but when you follow struts2 and tiles examples , you will understand the necessity of this source folder.

Step 7 : Run your project

Right click on your project

Select Run As option

Select Run on Server ( figure 12 )

Figure 12

Select Apache Tomcat Server version ( i user Tomcat 7 since i have downloaded it, you can use 6 if you have downloaded it) click finish.

This will take you to the HelloWorld Message on eclipse browser ( figure 13 )

Figure 13

Congratulations, you have successfully created your simple application with maven

Structs2 HelloWorld web Application

To follow this tutorial you need to have installed following applications on your computer.


1) Eclipse IDE : Eclipse Java EE IDE for Web Developers

2) Add m2eclipse Plugin to your Eclipse instance

3) Maven Automated build environment

4) Apache tomcat server 6

when you have those applications running on your computer you will be able to follow the instructions given below to create java web application using Struct2 framework.

First start eclipse IDE and create Maven Project. To create Maven Project follow following steps.

File -> New -> Other

This will open select a wizard window.

Selce Maven and then selcet Maven Project and then click next.

Then it will ask for project name and project location

From this window tic on default workspace location.

Click next

Now you need to select project archetype.

select maven-archetype-webapp. or type maven-archetype-webapp under filter section.

Click next

Provide Artifact ID. For this project i use  Structs2XMLConfigurationExample
provide Group ID. For this project i use com.vaanila.action


Now click finish.

Now you should be able to see the newly created project in the Project Explorer window.

Now , you have to add few plugins to pom.xml file created by maven automated tool for your project.

you need to add following configuration to the build element of the web application


<build>
    <finalName>Struts2Example</finalName>
    <plugins>
    <plugin>
    <artifactId>maven-eclipse-plugin</artifactId>
    <version>2.8</version>
    <configuration>
    <wtpversion>1.5</wtpversion>
    </configuration>
    </plugin>
    <plugin>
    <artifactId>maven-compiler-plugin</artifactId>
    <version>2.3.2</version>
    <configuration>
          <source>1.6</source>
          <target>1.6</target>
        </configuration>
    </plugin>
    </plugins>
  </build>

After adding this configurations run from the command line

mvn clean install

This command will download the required jars for the project to your project location.

then run

mvn eclipse:eclipse

This will import the configuration to eclipse IDE.

Maven + Eclipse + JSP How To and How NOT To create web application

Points to observe during this tutorial

Directory Structure that eclipse creates (Figure 1) when dynamic web project is created without using maven build tool is different from that of created using Maven.It is true that different IDE's use different structure, but at last when war is build they follow same structure.This is main point that i came across when developing web applications with maven and eclipse. And, when you are making web application using maven, you have to walk through following steps carefully to become successful. but i would like to discuss some wrong paths that you may be following if you are trying to get families with maven and eclipse.

You should have following Software installed on your system to follow this tutorial.

First you should have following downloaded in order to follow this tutorial. You should have java1.6 installed o,Eclipse WTP and Maven2.2 installed on your computer. in addition to that, if you are expecting your eclipse to provide facility run maven commands , then you need to have m2eclipse plugin installed on your system. I am not going to discuss how to set these configurations on your system.

Now , you have it all :). Oky, if not , i would assume you have it all.

So, Since your goal is to use Maven as a build tool for your project. i believe you might have this doubt that, what should be the first stop.

if you are using Maven, you should follow below step first , no matter what type of project you are developing.

There are two ways to generate web project with maven automated build tool.

1. Using Command Prompt

2. Using IDE like eclipse or Ideas with maven plugin integrated in to it.

Using Command Prompt

On your command line, execute the following Maven goal:

mvn archetype:generate -DgroupId=com.mycompany.app -DartifactId=my-webapp -DarchetypeArtifactId=maven-archetype-webapp

You will notice that the generate goal created a directory with the same name given as the artifactId. Change into that directory.
cd my-app 
Under this directory you will notice the following standard project structure.
Now , you have created maven web application, Very important point to notice here is that, web application project structure created by maven is different form project structure created for a web application using eclipse IDE without using Maven. Keep this point in mind, i will later come to this point and explain how this difference could affect development activities. 
Same project structure can be created if you are using m2eclipse plugin.




 



.

How to customize magnolia Standard Templating Kit(STK)

Magnolia STK demo website gives the idea how websites can be implemented using STK. Have a look at STK demo website found at this url. In regards to previous blog posts about magnolia has explained how magnoliaAuthor and Public instances are configured along with STK. Some of the basics of magnolia which have been keyed in with previous posts don't really need explaning so we don't discuss those.

The easiest way to develop custom websites is through customizing demo websites to suit specific requirements. websites can not be developed from the scratch with STK as, it has many constrains. it would be important to explain why new websites can not be developed from the scratch with STK. Still you can find workarounds if you are expert having in-depth knowledge of STK.( Reading this para is not mandatory to follow rest of the post as it contain insight information of magnolia which may seems daunting to newbies). Each magnolia webpage is constructed combining different Areas( refer magnolia STK terminology) such as platformArea, extrasArea, TeaserArea, MainArea , Stage, Header , Footer , navigation (vertical and horiontal) etc. if you want to add new Area to your website with stk , THAT CAN NOT BE DONE. You are restricted to the number of areas provided by magnolia. Also configuration elements of each of these areas are specific to each. If you consider one Area such as main area, you can add new features to that area by adding new paragraphs under paragraph node. you have that freedom to write your own paragraph template scripts and then to define your own paragraphs and dialogs. But when it comes to templates , you can only edit template script that ships with STK but no new template scripts can be added.

Lets start studying magnolia AdminCental interface to customize magnolia demo project.

Above figure depicts initial window will be opened after installing magnolia STK. Configuration of demo project templates and paragraphs are done through Templating Kit side menu.Demo project's CSS and java script files are also edited through the features provided under this menu. Now lets try understand how different elements presented under Templating Kit wire up together to build up professional website. At first , organization of different configuration elements of the demo project looks daunting in it's complexity.

Lets have a look at configuration elements available when Templating Kit side menu is opened.

As you can see, it provides

1. Site Configuration

2. Thems

3. Template Definitions

4. Paragraph Definitions

5. Dialog Definitions

6. Templates

7. Resources

All together 7 configuration elements. When i was facing these elements at first, my initial dough was , how each of these elements are working together. when i am changing one element , how does it affect whole website.

Most important part is to understand the job done by each of these configuration elements when building professional website. As you can see, i have highlighted the first menu item which is Site Configuration. it is the HEART of the all the configuration elements and whole site is derived from the prototype defined under site configuration.

Now lets study how home page of demo website has been built using site prototype.

Above figure tries to explain how to Home page of demo project is derived from the site prototype. As you can see, Home page has several parts such as Header, Stage , MainArea , Promos Area etc. Site prototype also has those areas define. if you remove header form the site prototype , it will not be displayed on the final output. To demostrate

How to set up Magnolia Author and Magnolia Public instances on eclipse

In this tutorial i am going to demonstrate how to set up magnolia Public and Author instances on eclipse using maven automated build environment.So , how do we start , yes that is a good question because official magnolia documentation does not provide such a information directly. So what do we do, what we can do is we can search for Google to find if someone else on this planet has faced the similar situation before. likely as expected someone else on this planet has faced this problem.

When i was searching the Google for magnolia + eclipse key words , oh, unfortunately i hit with following page.it is about retrieving magnolia source to our environment. But here what i need is not magnolia source. it is magnoliaAuthor and magnoilaPublic war files. those files should be set up on our eclipse environment as a project with the use of mvn automated build environment.Requirement of such a set up is this. say, you are developing a module for eclipse then each time when you want to test your module you have to build your module jar and upload that in to magniliaAuthor or public applications lib location. But since we are using mvn we can automate this process if we have magnoliaAuthor and public instances running on our workspace as a project. for this propose we don't need magnolia source.

Then i changed key works in to magnolia module development + eclipse. yes! that is what i was looking for. This mail discussion contains the information i was searching for.

This page contains two url's regarding to magnolia module development.

http://www.mail-archive.com/user-list@magnolia.info/msg08267.html

Hello World Application Using Magnolia CMS

This tutorial is for building simple website with database functionality to demonstrate it's functionality.

(how to install magnolia CMS with stk will be discussed later for those who are new to magnolia CMS)

As a first step to change the look of the demo site of standard templating kit , i started editing style.css file through admin central.

Yes, it gave me feeling that, any change i am making to the template script or css file or JavaScript file will be reflected in the demo site. But is that the correct way to do that. That is the question should be answered. when i was looking for the stranded method of creating won web page with stk, i found following resources.

All web pages created in magnolia based on templates. these are not template scripts. templates are created are join by merging template scrip with template definition. so when you are looking at web page created using magnolia, that page is created using template with the content in the JCR repository. numerous web pages can be created by using single template by mergin different content with the same template.

Here magnolia ppl says that what they are referring to as templates. they are referring to as templates not for the template scripts, it is the output of template script and definition.

Now they are talking about magnolia webpage. so let's have look at it. each magnolia web page is created using number of distinct areas. Most areas are made up of paragraphs. So , what do they mean by paragraphs. believe me it is not what are are familiar with.

How to decide whether to use CMS for a new Web Project

This is quite important topic thought i am not intended to discuss any cording related CMS. Nowadays i am working on a project where i am using magnolia CMS as the major tool of the web site implementation. I think i have good base to discuss about this topic as the previous project that i involved did not contain any CMS tool integration, it was from the scratch developed by .net language with the use of Microsoft Entity Framework and MSSql database system and front end was implemented in JQuery.

First i want to explain that, any static website like web sites implement for school's company profiles can be easily implemented with the use of CMS. But that is not the focus of this post. Main reason of CMS to come in to play in software world is not to support those minor requirement. So lets try to discover this key reason to have those and get the maximum benefit of those to our project.

What is GWT(Google Web Toolkit) , Why should i use it for my project

Google Code Jam , World finals 2010 - City Tour

At the begining, i have small problem with quection description. Quection description says that How to build the city.
according to my understanding the dicription as follows

Initially there are 3 cities. These 3 cities are connected by 3 bi directional lines. So visual representation of this is as follows.Following is the discription which gives us an idea like above.

" the cities started from three points of interest, with each pair being connected by a bidirectional street"

Now , what is next, it says how it evoles from this point onwards.

"then, gradually, new points of interest were added. Any new point of interest was connected by two new bidirectional streets to two different previous points of interest which were already directly connected by a street. "

which means that, if i add new point to above figure , it will looks like as follows.

But when we try to understand the first sample input from this view, it gives nothing.

First input says something like follows.

Input	Output
2 5 1 2 2 1 6 1 2 1 4 4 5	Case #1: 4 Case #2: 6

Ok what is this first input set means. it says there are 5 points of interest. Ok, according to our understanding, it says, there are 2 more points of interest than 3 main points of interests. So , we already know how it's connection looks like according to the previous decription. but it gives us 1,2 and 2,1 two streets.

Also here is the dicription about these inputs.
"
The next N-3 lines each contain a pair of space-separated integers A, B, indicating that the corresponding point of interest was connected by streets to points A and B. First of these lines corresponds to point number 4, second to point number 5, etc. "

if there are 5 points, then 5-3 is 2, so we should have give two (x,y) point inputs. yes they have!
it is interesting to look how we missunderstood this problem.
We thought that (x,y) represents cordinates, but they are not corrdinates, why did we think they are cordinates. Since we did not quection basic thing at the biggning of the quection. what it is. if two newly added points are connected to first 3 points by two bi-diractional lines, there are 3 ways in which this can be done, so we should be given correct configuration. if we had quection this at first, then we won't decide those input to be coordinates! :)

JCR Content Repository : Why do i need it for my project

You might have worked with content management application or you might have some idea about what it is. But if you have ever tried to develop content management application, you are all too aware of the difficulties inherent in implementing content systems. The landscape is fragmented, with numerous vendors offering proprietory repository engines.

Hibernate Simple Web application

I am trying to explain this application using mvn as the build infrastructure to improve our knowledge in using MVN.

Apache Solr : How can i used Apache Solr to implement search functionaly in my web project

Here we are going to study about search libray called apache solr. Basically using apache solr you can implement the functionality demostrated by following future. I think this future gives better idea of what you can get out of it rather than explaining it using words.



Ok, now we have small idea about it's power. As a first step to get the concepts behind apache solr, lets start by starting it on apache tomcat server.

Since i am following this totorial , i preffere using jetty server to run solr. But running it on apahe tomcat is not a big deal, just copy war file in to web apps directory in your tomcat folder.

To do this you need to download extract solr server then to goto examples folder and run java -jar starup.jar . Thats all you need to do to get it running on jetty server.

How to configure your application on the start up using Constretto

Since i am new to using Constretto, i thought of sharing my experince in understanding the usage of Constretto.

First i sarted following following tutorila to write helloworld time application and then to move towords more advanced topics.

Opps , at the start of the tutorila seems a problems

Totorial is written using MVN automated build system. I am new to MVN as well. But i have little understanding of its behaviour , so it will help me to contitune this tutorial successfully.

Following line at the begining of the tutorial might means something similart to following.

"It allows you to “tag” configuration values, so that Constretto could choose the correct value at runtime."

Constretto gives tag for each and every configuration value. So during hte runtime using the this tag value , it can deside which configuration value to be used. i am wondering why they have mentioned at the begining of the torrorial. Because, we know that, if there is a configuration file with lot of values , then there should be some mechanisum to identify each and every configuration value identically. So this is nothing strange right :\

But next line says something very important for me, it says that , Constretto supports different configuration mechanisums. Hmm, before looking in to tutorial , i didn't know even one configuration mechanisums. So it says development community is already following different configuration mechanisums.

"It also works as a bridge between different configuration formats, and currently Java property files, Ini files, and Java Beans are
supported."

I usually prefere reading introduction when ever i am about to something new. So here no different :)

First step is to crete mvn project. i have used eclipse IDE and m2eclipse plugin installed on it. Alos you can take any other path as you wish.

When you are done with crating project skelton using MVN , you will find System.out.println("Helloworld"); Line at sample class created by you using mvn simple project skelton.

OK, now we are going to have fun with Constretto technique of configuring the project.

OK i added following code in to App.java class

ConstrettoConfiguration config =
new ConstrettoBuilder()
.createPropertiesStore()
.addResource(new DefaultResourceLoader().getResource("classpath:test.properties"))
.addResource(new DefaultResourceLoader().getResource("file:test2.properties"))
.done()
.createIniFileConfigurationStore()
.addResource(new DefaultResourceLoader().getResource("classpath:test.ini"))
.done()
.createObjectConfigurationStore()
.addObject(new Object())
.done()
.createSystemPropertiesStore()
.getConfiguration();

This is not a big deal, just copy this code segment from this tutorial https://github.com/constretto/constretto-core

Now in the above code sample you can see that configuration file is given in so many different ways, So i would like to know how classpath.test.propeties gives the path to property file.

Ok putting classpath.test.properties file in so many different places helped us to resolve this issue. Now comes the most interesting part of this problem. I want to put this file in the location that i am interested reather than in the place it is given still using classpath.test.properties method.

How to use maven for your project.

In this part of the tutorial , we will be looking at how to use MVN as a build tool for a web project.

Since i am new to MVN , i have many problems with regards to usage of MVN as you would. So
When i was browsing the internet for "MVN totorial" first thing i found was Thils.

Since i have downloaded MVN and started following 5 min guide at here. i was faced with following problems.
When i was followng this tutorila using eclipse , it gave me more visual information about following command if you are using command line to genearate MVN project structure.

mvn archetype:generate -DgroupId=com.mycompany.app -DartifactId=my-app
-DarchetypeArtifactId=maven-archetype-quickstart -DinteractiveMode=false

M2Eclipse plugin provides visual interfaces during project strucutre generation phase to select thise options. Following option took my interest to investigate more since that does not mean any thing to me when i was looking at it for the first time. Following is the screen short for M2Eclipse page.



it asks you to select appropriate archetype plugin. hemm, in my vocabulary there is no such name. That is software engineering. it is full of such strange terms. Lets try to get this term in to our terminology.

First JSP applicatoin

Here i am giving you basics of developing JSP web application from scratch.

i will be using MVN as the build tool and Git as the source control system. First this application will be developed using traditional database integration tool. At later stage same application will be developed using Hibernate. I will also be using Spring framework when this application is getting mature ;).

Thats all for now. so lets start moving to other sections.

I already have account at http://www.github.com.
Now follow the steps given in above figure after creating repository at github.com

ok , you are done, following above steps is easy. Also make sure that you have added your public key to the github to follow above steps with out problem :)

Now , what is the next problem. it is MVN right. we have decided to use MVN as our build tool. so how to go about integrating MVN in to our project.

Now , what should be our next movement. it is creating project structure using MVN.

Now here are the problems comes in to my mind.

I am developing web application. So how would i go about developing MVN build infrastructure for Web Project. Since i didn't have idea about how mvn works. i started writing following simple application to understand its behavior following the tutorial at