Hazem Saleh's Blog, page 5

“Pro JSF and HTML5″ Book Review by Werner Punz

Attached below the review of Werner Punz (Senior software developer for Irian GmbH, Apache MyFaces Committer, and a member of the JSF Expert Group) about the “Pro JSF and HTML5″ book:

Pro JSF and HTML5 Book

Good but not perfect


“The book itself is a crash course in JSF with extensive JSF 2.2 coverage and component coverage.

The first part of the book is an introduction into JSF and JSF 2.2, the second part walks you through component creation the third part covers two of the most widely used component libs and the fourth part walks you through an entire JSF application utilizing Java EE 7.

Well what should I say, while I wished some parts were covered more deeply, like the already extensive component creation part or the Java EE application walk-through which should have gotten more explanatory coverage in the Java EE area, I personally guess that the book as JSF 2.2 reference and as a tutorial book for JSF fulfills its purpose very well.

The problem I see simply is if you want to cover component creation for JSF on its own with all the special cases for different component types, you probably need a book on its own, the same goes for a full blown Java EE application with all its little details on which pattern to apply where and why, this would be also another book which then should omit the JSF tutorial part.

I will give the book 4 stars as very good JSF 2.2 and component creation reference and good JSF tutorial, but one star less due to the lack of depth especially in the application walk-through which should have gotten a bit more explanation on the Java EE side of things.”

Reference:

http://www.amazon.com/review/R1RQKD0WJN7QDB

The book in Amazon:

http://www.amazon.com/Pro-JSF-HTML5-Building-Components/dp/1430250100

Review #1 about the “JavaScript Mobile Application Development” Book

Attached below the review of Zubin Wadia (the CEO & Co-Founder of CiviGuard, Inc, CEO & Co-Founder of RedRock IT Solutions, and Chief Technology Officer at ImageWork Technologies) about the “JavaScript Mobile Application Development” book:

JavaScript Mobile Application Development Book

A fine guide for web and native developers alike!


“Fabulous coverage of a powerful and mature cross-platform library. The book goes through the basics over the first five chapters, making sure native app developers aren’t alienated by the diaspora of HTML5/CSS3 web standards out there. A web developer will find that the book truly gets into its stride via the 5th, 6th, 7th and 8th chapters – which cover advanced Cordova API calls, platform specific code for iOS/Android/WinPhone, unit testing (critical) and finally a “Mega App” that puts your knowledge through some practical pacing.”

Reference:

http://www.amazon.com/review/R33GUDCXH5787J

The book in Amazon:

http://www.amazon.com/JavaScript-Mobile-Application-Development-Hazem/dp/1783554177/

JSF 2.3 Part2, Using @inject for FacesContext

One of the wonderful features of the upcoming JSF 2.3 is the ability to inject many JSF objects such as UIViewRoot, ViewMap, ApplicationMap, ExternalContext and FacesContext. In this post, I will show you how to simply inject FacesContext without having to use the old way FacesContext.getCurrentInstance().

Continuing working on the sample that was introduced in the previous post, let’s modify User managed bean to get FacesContext in order to display an information message to the user once the operation is done. The following code snippet shows the modified User managed bean.

package beans;

import java.io.Serializable;
import javax.enterprise.context.RequestScoped;
import javax.faces.application.FacesMessage;
import javax.faces.context.FacesContext;
import javax.inject.Inject;
import javax.inject.Named;

@Named
@RequestScoped
public class User implements Serializable {
private static final long serialVersionUID = 4629817047379532658L;
private static final String INFO_MESSAGE = "Operation is done ...";

private String name;

@Inject
FacesContext facesContext;

public String getName() {
return name;
}

public void setName(String name) {
this.name = name;
}

public String greet() {
facesContext.addMessage("form1", new FacesMessage(FacesMessage.SEVERITY_INFO, INFO_MESSAGE, INFO_MESSAGE));

return null;
}
}

As shown, all what you need to inject FacesContext in your managed bean is to annotate its declared instance with @inject annotation.

Running Application on GlassFish 4.1

In order to run our JSF application this time on GlassFish, we need to build Mojarra jars for GlassFish and then configure them on the server as follows:

First of all, you need to make sure that you have both SVN and Apache Ant installed and configured in your operating system.

Check out Mojarra 2.3 source code using the following SVN command:
svn checkout https://svn.java.net/svn/mojarra~svn/...

In order to build the JSF Mojarra jars for GlassFish then create a new file called build.properties under trunk. Then copy build.properties.glassfish file (which is located directly under trunk) content into it. Do not forget to set jsf.build.home property to the directory in which the sources were checked out into as follows for example.

# --------------------------------------------------
# Set this to the directory in which the sources
# were checked out into
# --------------------------------------------------
jsf.build.home=/Users/hazems/projects/mojarra23/trunk

CD to the jsf.build.home path, and then execute the following ant command:
ant clean main

After the successful execution of the previous command, you can get Mojarra jars from:

jsf-api-intermediate.jar from trunk/jsf-api/build/lib directory.
javax.faces.jar from trunk/jsf-ri/build/lib directory.


Finally, overwrite the default javax.faces.jar file under glassfish-4.1/glassfish/modules with the new built javax.faces.jar file, and deploy our JSF application to GlassFish. After running our JSF application, you can see the information message after clicking "Greet" button as shown below.




Getting the JSF sample source code:

The sample source code is available in GitHub:

https://github.com/hazems/jsf2.3-work/tree/master/sampleJSF2

JSF 2.3 Part1, Getting Started

It is really not so early to start working with the upcoming JSF 2.3 and testing it. In this post, I will show you how to get started in JSF 2.3 by building JSF (Mojarra) jars from its source then use them for your JSF 2.3 application which will run in Tomcat 7.

Building JSF Jars from SVN:

First of all, you need to make sure that you have both SVN and Apache Ant installed and configured in your operating system.

Check out the source code using the following SVN command:

svn checkout https://svn.java.net/svn/mojarra~svn/...


In order to build the JSF Mojarra jars for Apache Tomcat then create a new file called build.properties under trunk. Then copy build.properties.tomcat file (which is located directly under trunk) content into it. Do not forget to set jsf.build.home property to the directory in which the sources were checked out into as follows for example.

# --------------------------------------------------
# Set this to the directory in which the sources
# were checked out into
# --------------------------------------------------
jsf.build.home=/Users/hazems/projects/mojarra23/trunk


CD to the jsf.build.home path, and then execute the following ant command:

ant clean main


After the successful execution of the previous command, you can get Mojarra jars from:

jsf-api-intermediate.jar from trunk/jsf-api/build/lib directory.

javax.faces.jar from trunk/jsf-ri/build/lib directory.




Configuring your first JSF 2.3 application:

Simply all what you need to work with JSF 2.3 in Tomcat 7 is to do the following:

Place the two Mojarra jars in step 4 in your web application WEB-INF/lib folder.
Set the JSF version in the faces-config.xml to 2.3 as follows.






Then now, you can write your JSF application and it will be powered by the upcoming JSF 2.3. I made a very basic JSF 2.3 sample which you can reach its code in the following GitHub URL:

https://github.com/hazems/jsf2.3-work/tree/master/sampleJSF1

In my next JSF 2.3 posts, I will show you some of the JSF 2.3 implemented features “so far” in order to allow you to start working with them so stay tuned.

Tip #4: Storing Media Files Properly in Cordova iOS apps

In order to avoid being surprised by the loss of your recorded audio file in iOS, you should be aware of how to properly record and store a media file in Cordova iOS.

Generally, in order to record an audio file in Apache Cordova, you can use the Cordova Media object as follows:

var recordingMedia = new Media(mediaFilePath, recordingSuccess, recordingError);

// Start Recording Audio
recordingMedia.startRecord();

// Stop Recording Audio
recordingMedia.stopRecord();

// Release Media resource
recordingMedia.release();

As shown in the code above, in order to record an audio file in Apache Cordova, you need to do the following:

Create a Media object (recordingMedia) and specify mediaFilePath (the path of the audio file), recordingSuccess (the success callback which will be called if the media operation succeeds), recordingError (the error callback which will be called if the media operation fails).
Start recording the audio by calling recordingMedia.startRecord().
After completing the audio recording, call recordingMedia.stopRecord() and then release the used Media object by calling recordingMedia.release()

In iOS, if you set mediaFilePath to the audio file name only without specifying any path (e.g "test.wav"), you may be surprised to find your audio file stored under the iOS app’s tmp directory (which is located under the iOS app’s sandbox directory). It is very important to be aware that the iOS app’s tmp directory content can be deleted automatically by iOS at anytime by iOS.

In order to avoid losing your app’s recorded files, just place the "document:///" prefix before the audio file name as follows.

var recordingMedia = new Media("documents://test.wav", recordingSuccess, recordingError);

Doing this will make the recorded audio file stored under the iOS app’s Documents directory. The iOS app’s Documents directory is located under the app’s sandbox directory and is suitable for storing the app files.

Reference:

“JavaScript Mobile Application Development” Book:

Amazon: http://www.amazon.com/JavaScript-Mobile-Application-Development-Hazem/dp/1783554177
Packtpub: https://www.packtpub.com/web-development/javascript-native-mobile-apps-development

Tip #3: Implementing the Back button behavior for Android and Windows Phone 8 Apps

If you use Apache Cordova for developing your Android and Windows Phone 8 mobile apps, you may need to exit the app when the user clicks on the back button on the app’s home page, and to navigate back when the user clicks the back button and the current page is not the home page.

Note that back button usually exists in Android and Windows Phone 8 devices.

In order to do implement this behavior, you can implement the “backbutton” event handler after the “deviceready” event is triggered. This is an example to implement this in jQuery mobile.

var homePage = "appHome";

//Handle back buttons decently for Android and Windows Phone 8 ...
function onDeviceReady() {
document.addEventListener("backbutton", function(e){
if ($.mobile.activePage.is('#' + homePage)){
e.preventDefault();
navigator.app.exitApp();
} else {
history.back();
}
}, false);
}

$(document).ready(function() {
document.addEventListener("deviceready", onDeviceReady, false);
});

Using navigator.app.exitApp(), you can exit your mobile app when the app user is in the home page. And using history.back(), you can navigate back to the previous page when the app user is in other pages.

Reference:

“JavaScript Mobile Application Development” Book:

Amazon: http://www.amazon.com/JavaScript-Mobile-Application-Development-Hazem/dp/1783554177
Packtpub: https://www.packtpub.com/web-development/javascript-native-mobile-apps-development

Tip #2: Boosting Cordova’s jQuery Mobile Apps Performance

One of the common issues when you use jQuery Mobile with Apache Cordova in many of the platforms especially in the old versions Android platform is that you feel that the transitions between the app pages are slow.

In this post, I illustrated the solution of this problem:

http://cordovabookland.com/2014/11/tip-2-boosting-cordovas-jquery-mobile-apps-performance/

Back from JMaghreb 2014

I just get back from JMaghreb 2014 that was held in Casablanca, Morocco 05-06 November 2014. The conference organization was fantastic and there were a lot of attendees in the conference sessions.



I had the chance to present “Developing JavaScript Mobile Apps Using Apache Cordova” in 06 November, the session had many attendees and I was really amazed by the energy, enthusiasm, and responsiveness of the attendees during the session.

The session went great and I was glad to give a copy of my “JavaScript Mobile Application Development” book to one of the attendees who answered a JavaScript quiz at the end of my session.






I uploaded my session below:

Tip #1: Cordova Integration with jQuery Mobile in Windows Phone 8

One of the common issues when you use jQuery Mobile with Apache Cordova in Windows Phone 8 is the following:

Trimmed header title.
Footer is not aligned to bottom.

As shown in the following screenshot:

The following post shows you how to fix these issues:

http://cordovabookland.com/2014/11/tip-1-cordova-integration-with-jquery-mobile-in-windows-phone-8/

“JavaScript Mobile Application Development” book is published

I’m pleased to announce the release of my new Book “JavaScript Mobile Application Development” using Apache Cordova:

http://www.amazon.com/JavaScript-Native-Mobile-Apps-Development/dp/1783554177

What this book is about

Mobile development is one of the hottest trends and a staple in today’s software industry. Almost every popular website today has its own equivalent mobile application version to allow its current users to access its functions from a mobile device. However, developing mobile applications requires a lot of effort and a wide skill set from mobile developers. Whether you are developing a mobile app for an iPad or on a Windows Phone, there is a requirement to learn the specific languages and technologies for that device. This is where the glory of Apache Cordova shines. As a set of device APIs for building cross-platform mobile applications using HTML, CSS, and JavaScript, the apps developed using JavaScript APIs are easily portable to other device platforms, as well as being consistent across devices and built on web standards. As a result of this, you will find that your development costs and efforts are sharply reduced, whilst increasing the readability and maintainability of your code, as you make use of only one popular programming language: JavaScript.

This is the learning resource to use when you want to efficiently develop your own native mobile applications using Apache Cordorva as the platform that uses HTML, CSS, and JavaScript. In order to develop neat-looking mobile applications, this book also utilizes jQuery mobile. jQuery mobile is one of the best mobile web application frameworks that allows web developers to develop web applications that are mobile friendly.

We start by developing a simple sound recorder mobile app. We then configure this app to work on Android, Windows, and iOS. Then you will learn how to use the different APIs provided by Apache Cordova and how to develop your Apache Cordova custom plugins.

You will then learn how to develop, run, and automate tests using Jasmine. At the end, you develop a “Mega App” where you will learn in details how to design, develop, and deploy a real cross-platform Apache Cordova application that works in Android, iOS, and Windows Phone 8.

After finishing this book, you should be able to develop your mobile application on the different mobile platforms, using only JavaScript, without having to learn the native programming languages of every mobile platform.

What this book covers

Chapter 1, An Introduction to Apache Cordova, teaches what Apache Cordova is and the differences between mobile web, mobile hybrid, and mobile native applications. You will also know why we should use Apache Cordova, along with the current Apache Cordova architecture, and finally, the chapter offers an overview of Apache Cordova APIs.

Chapter 2, Developing Your First Cordova Application, explains how to develop, build, and deploy your first Sound Recorder mobile application on the Android platform.

Chapter 3, Apache Cordova Development Tools, explains how to configure your Android, iOS, and Windows Phone development environments. You will also learn how to support and run your Sound Recorder mobile application on both iOS and Windows Phone 8 platforms.

Chapter 4, Cordova API in Action, dives deep into Apache Cordova API, and you will see it in action. You will learn how to work with the Cordova accelerometer, camera, compass, connection, contacts, device, Geolocation, globalization, and InAppBrowser API by exploring the code of the Cordova Exhibition app. The Cordova Exhibition app is designed and developed to show complete usage examples of the Apache Cordova core plugins. The Cordova Exhibition app supports Android, iOS, and Windows Phone 8.

Chapter 5, Diving Deeper into the Cordova API, continues to dive into Apache Cordova API by exploring the remaining main features of the Cordova Exhibition app. You will learn how to work with Cordova media, file, capture, notification, and storage API. You will also learn how to utilize the Apache Cordova events in your Cordova mobile app.

Chapter 6, Developing Custom Cordova Plugins, dives deep into Apache Cordova and lets you create your own custom Apache Cordova plugin on the three most popular mobile platforms: Android, which uses the Java programming language, iOS, which uses the Objective-C programming language, and Windows Phone 8, which uses the C# programming language.

Chapter 7, Unit Testing Cordova Apps Logic, explains how to develop JavaScript unit tests for your Cordova app logic. You will learn the basics of the Jasmine JavaScript unit testing framework and understand how to use Jasmine in order to test both the synchronous and asynchronous JavaScript code. You will learn how to utilize Karma as a powerful JavaScript test runner in order to automate the running of your developed Jasmine tests. You will also learn how to generate the test and code coverage reports from your developed tests. Finally, you will learn how to fully automate your JavaScript tests by integrating your developed tests with Continuous Integration tools.

Chapter 8, Applying it All – the Mega Application, explores how to design and develop a complete app (Mega App) using Apache Cordova and jQuery Mobile API. Mega App is a memo utility that allows users to create, save, and view audible and visual memos on the three most popular mobile platforms (Android, iOS, and Windows Phone 8). In order to create this utility, Mega App uses jQuery Mobile to build the user interface and Apache Cordova to access the device information, camera, audio (microphone and speaker), and filesystem. In this chapter, you will learn how to create a portable app that respects the differences between Android, iOS, and Windows Phone 8.

Where to buy this book

You can buy JavaScript Mobile Application Development Book from:

Amazon:

http://www.amazon.com/JavaScript-Mobile-Application-Development-Hazem/dp/1783554177
Packtpub:

https://www.packtpub.com/web-development/javascript-native-mobile-apps-development