GWT app and hosting it on google appspot

Here I am going to brief about creating a GWT app in Eclipse and hosting it in Google app engine.

here am going to develop a simple game.

Before starting,

You need to install Eclipse, then add GWT toolkit to it, by "Instal new software" option present in Help tab in Eclipse window. Provide url with respect to your eclipse versioin.

Let me tell you a simple point so that you may encourage to use GWT to development. It help to do many logics and calculations on client side, so that performance of system always depends on the processing speed of client machine, not internet or server performance.

Our game logic is: hit the bomb flying over the sky using the rocket.

Create a gwt project with name MyFirstApp, with sample codes in it.

In project tree structure open client package, then open the java file named MyFirstApp.java.

Remove all codes in the class, expect the function name onModuleLode(). Create a class with name Game in same package and extend it with Composit class of gwt.
Write down the code below to that calss

public class Game extends Composite {
HorizontalPanel hp1;
HorizontalPanel hp2;
private VerticalPanel hp;
private Button enemy;
private Button rocket;
private Button fire;
public Game() {

init();

initWidget(hp);

startEnemyAttack();

addListener();

}
private void startEnemyAttack() {

NMorphStyle flyEffect = new NMorphStyle(new Rule(
"start{left: -20px; top: 0px;}"), new Rule(
"end{left: 280px; top: 0px;}"));

flyEffect.setEffectElement(enemy.getElement());

flyEffect.play();

enemyTime.schedule(1800);
}
private void addListener() {

fire.addMouseOverHandler(new MouseOverHandler() {

@Override

public void onMouseOver(MouseOverEvent event) {

fire.setStyleName("mouseOver");
}

});
fire.addMouseOutHandler(new MouseOutHandler() {

@Override

public void onMouseOut(MouseOutEvent event) {

fire.setStyleName("clickfire");
}

});
fire.addClickHandler(new ClickHandler() {

@Override

public void onClick(ClickEvent event) {

fire.setStyleName("mouseClick");

NMorphStyle flyEffect = new NMorphStyle(newRule("start{left: "
+ rocketPositionX + "px; top: -20px;}"), new Rule(
"end{left: " + rocketPositionX + "px; top: -530px;}"));

flyEffect.setEffectElement(rocket.getElement());

flyEffect.play();

rocketTime.schedule(1800);
}

});
}
Timer enemyTime = new Timer() {

@Override

public void run() {

hp1.remove(enemy);

enemy = new Button();

enemy.setWidth("40px");

enemy.setHeight("40px");

enemy.setStyleName("enemy");

hp1.add(enemy);

startEnemyAttack();
}

};
int hit = 0;
int mis = 0;
int rocketPositionX = 135;
Random r = new Random();
Label score;

Timer rocketTime = new Timer() {

@Override

public void run() {

hp2.remove(rocket);

int temp = enemy.getAbsoluteLeft();

// Window.alert(temp+"<-left:");

if (temp >= rocketPositionX - 20 && temp <= rocketPositionX + 20) {

enemy.setWidth("80px");

enemy.setHeight("80px");

enemy.setStyleName("explosion");

hit++;

}else if(temp >= rocketPositionX - 40 && temp <= rocketPositionX + 40){

if(temp >= rocketPositionX){

System.out.println("rotate left style");

mis++;
}

else{

System.out.println("rotate right style");

mis++;
}

}else {

mis++;

}
rocketPositionX = r.nextInt(280) + 20;
hp.remove(score);
score = new Label("hits: " + hit + " misses: " + mis);
score.setStyleName("score");
hp.add(score);
rocket = new Button();
rocket.setWidth("20px");
rocket.setHeight("50px");
rocket.setStyleName("fire");
String s = rocketPositionX + "px";
rocket.getElement().getStyle().setProperty("left", s);
hp2.add(rocket);
}};
Timer time = new Timer() {

@Override

public void run() {}
};
private void init() {

hp = new VerticalPanel();

hp.setStyleName("launcher");

score = new Label("hits: " + hit + " misses: " + mis);

hp2 = new HorizontalPanel();

hp1 = new HorizontalPanel();

hp1.setWidth("300px");

hp1.setHeight("500px");

hp1.setStyleName("enviorment");

hp.setBorderWidth(1);

enemy = new Button();

enemy.setWidth("40px");

enemy.setHeight("40px");

rocket = new Button();

rocket.setWidth("20px");

rocket.setHeight("50px");

rocket.setStyleName("fire");

enemy.setStyleName("enemy");

fire = new Button();

fire.setWidth("50px");

fire.setHeight("40px");

fire.setStyleName("clickfire");

hp1.add(enemy);

hp2.add(rocket);

hp.add(hp1);

hp.add(hp2);

hp.add(fire);

hp.add(score);

}
public int getHit() {

return hit;

}

public int getMis() {

return mis;

}
public void setHitAndMis() {

hit = 0;

mis = 0;
}

}
now in MyFirstApp add these code inside onModuleLoad() functoin:
Game myGame =new Game();
RootPanel.get().add(myGame);
Thats it.
Right click the project and choose Google, deploy to app Engine,
add your unique id in the settings option. and click ok, if you aree not logged in to the account popup will ask to login to your google account
Now login to appengin of google and check your app url and share it to you friend
Modify your app as your looks and likes. Give Images for best user experience.
http://watertalkshitbomb.appspot.com/ this is the link to the game you developed.
Thanks.
Any queries and doubt regarding this are welcoming...