Showing posts with label HTML5. Show all posts
Showing posts with label HTML5. Show all posts

Saturday, September 20, 2014

NetBeans: 8.0.1 Released with bunch of out-of-the-box tools = productivity++

In every NetBeans release it provides out-of-the-box tools that leverage the java standards and other tools toward the web standards, alongside great papular market tools that increases developer daily productivity.

NetBeans editor analyzes code to work efficiently with great tips and refactoring templates for more clear and cleaner code, provides migration from other JDKs toward Java 8, and it works for Java SE 8, Java SE Embedded 8, and Java ME Embedded 8.

The IDE also has a range of new enhancements that further improve its support for Maven and Java EE with PrimeFaces; new tools for HTML5, in particular for AngularJS; and improvements to PHP and C/C++ support.

Beside that the IDE has an interesting new features especially for JavaScript developers whom seeks for writing modular code, it comes with built-in support RequireJS, that provides modularity and enterprise features for JavaScript.

More interesting features:

  1. You can now debug your JavaScript files with Karma.
  2. Node.JS and Bower built-in integrations let you install modules directly within the IDE.
  3. Support for latest application servers GlassFish 4.1, Tomcat 8.0.9, WildFly 9, and WebLogic 12.1.3
  4. IDE comes with pre-bundled GlassFish 4.1 and Tomcat 8.0.9
  5. Latest PrimeFaces v5.0 framework bundled with IDE.
  6. Improved Git support

GlassFish 4.1 is now Java SE 8 certified, so you can develop your Java EE 7 projects with JDK 8 for more modularity and cleaner code, yeah have fun :)

For the complete set of bunch of tools please visit NetBeans IDE 8.0.1 Information

Hungry to code, so what are you waiting for?? , Download Netbeans IDE


Sunday, August 10, 2014

IDE: 5 most favorite NetBeans features

Development with pleasure....
NetBeans has many interesting features that make development very easy, with few steps, and makes for a very productive environment, in terms of getting your product to market very quickly.

It is very hard to limit my talking to only five features, while this IDE has tons of interesting features. But here I am going to mention my most favorite 5 features I am daily using in my development process on many platforms:

  1. It is the reference development implementation IDE:

    I am a JCP (Java Community Process), EC (Executive Committee), a JSRs (Java Specifications Request) adopter and FishCAT (Glassfish Community Acceptance Testing) contributor especially in Java, SE & EE world. While I am in early phases of testing the specifications, I need an IDE which support those technologies and made it easy to test and develop them, to report bugs, enhancements and confirms that JSRs Specs are valid against RIs, and with other JSRs on latest RI Application server like Glassfish.

    NetBeans offered all of this for us to streamline the process, with almost a nightly and weekly builds alongside JSRs RIs builds, which we use to test previously mentioned RIs betas.

    The most interesting part of the story here is when we released Java EE 7 on last Mid of June 2013; there was already NetBeans 7.4 was generally available released to fully support development of Java EE 7 technologies. And this happens also for JDK 8 when it released 18-March 2014, there was NetBeans 8.0 fully support Java SE 8.0.

  2. Android Mobile development made easy:

    NetBeans shipped with a very great support for mobile development either it was pure Android development in term of this is a Java Based IDE or Hybrid development in term of frontend technology support (HTML5, CSS3 and JavaScript).

    With a very productive plugin NBAndroid you can develop a pure Android project compatible with original ADT SDK (Android Development Toolkit) project structure, test, emulate and deploy on emulators as well as native devices at the same time. You should give it a try if you interested in mobile development.

    Create a new Project:
    Identify Properties:
    Created project:
    Runs On Android Emulator:
  3. Hybrid Mobile development support:

    Hybrid mobile development is never made easy as now in NetBeans nowadays, NetBeans introduced a hybrid mobile development based on Cordova open source mobile framework. Which is one of the most popular frameworks to develop hybrid mobile applications.

    While NetBeans gives a great and solid support for frontend engineering technologies like JavaScript, HTML5, CSS3, Frameworks like AngularJS, NodeJS, and jQuery core, mobile, and UI … etc.

    Which made it easy to develop a Hybrid based mobile applications for both Android and iOS in one shoot with few clicks. Without context-switching to other IDEs to accomplish the task.

    It has complete support for Apple iOS development toolkit and Android ADT SDK, therefore you can test your application locally for mobile web and on emulators/devices of both mobile OSs, then export final product either it was .apk binary for android or .ipa for iOS, for final deployment on Apple store or Google play store.

    Creating the project:
    Choosing template:
    Identifying project properties:
    Choosing deployment method:
    Deployed on iOS simulator:
  4. JavaScript libraries in one place:

    If you are a frontend engineer, then you got the right choice, yes this IDE is for you, I know you need to develop a modern web application, but wait this needs many JavaScript modules and libraries to do it.

    One among the very panic tasks in web development nowadays, is to search for JavaScript tools and setup your project for them, then download each JavaScript libs from different sites with there resources and support libs, in addition you have also to manage their updates to fix problems or get a new feature.

    NetBeans comes with a build in tool that allows you to get your JavaScript libraries in one shoot from the IDE directly and mange their updates from the same place.

    You will find almost all JavaScript libs you need, and you can filter your choice from the tool to pic up the right libs you need for your project, and where to put them in your project.

    As mentioned in first picture the libs were updated on Apr 26, 2014, just click and will updates all libs to today releases.

    It saves me a bunch of site visiting and worrying about updating them, and even adding new ones in future of the project.

    The JavaScript tool:
    Pickup and filter your choices:
  5. SOAP based client/Web Services in one click:

    I am working in government environment, which requires much integration between systems either directly or through a G2G (Government-to-Government) hub, each one needs a specific integration requirements.

    If it is directly, you have to define you web service annotations on interface based on your backend EJB session bean interface or separate endpoint interface to decouple your Endpoint from your façade, then generate WSDL to be consumed by others.

    Other scenarios is to go to a Top-Down approach, in developing WSDL first to be certified on G2G hub based on their standards, then generate service endpoint interface from them.

    Lately I have been asked to develop a Pension G2G WSDL definition and at the same time generate endpoint service interface to begun the testing in one week.

    I have accomplished this task in 3 days using NetBeans, it has a tremendous support for XML, XSD development, and after finishing the WSDL definition, I need to confirm a correct endpoint service creation, Before publishing service WSDLs to G2G authors.

    Okay from NetBeans I have created a Web Service from WSDL, passed the WSDL and click finish, that’s all.

    The surprise was it generates the service endpoint correctly as WSDL def. and at the same time created Service ports and client to test service in one shoot.

    All I have to do is to implements my service endpoint operations and huryaaaa finished my task.

    Adding WSDL and Identifies project attributes:
    Generated Service endpoint:

Thanks for NetBeans team for such support and made it a development with pleasure.



Sunday, June 8, 2014

JEEConf 2014, Kiev, Ukraine trip report


Very busy May.

This May 2014 was a very busy month for me, I was so busy at work but thankfully I have finished all my heavy-duty tasks and left other managed tasks to my team to finish it till my back from my international trips.

My Trips

In last May 2014, first I went to Tunis, Tunisia, speaking at Esprit JUG Day 2014 on 7th and 8th of May, delivering the following 4 sessions:
1- What is new in Java SE, EE, ME, Embedded world, & new Strategy?
2- Drive yourself, community with JCP & adopts to professionalism.
3- Developing Native & Hybrid Android mobile Apps, with Netbeans 7.4+.
4- Yeah, TRUE real time web applications, no more hacks (a hack session).
5- Hybrid Mobile development without IDE from CLI (Workshop) (Cordova framework).
My JCP EC F2F meeting

After that I have traveled to London, United Kingdom, to attend my JCP executive committee F2F meeting 2014 on the 13th & 14th of May as I am a JCP EC member, and delivered the following session:

1. United Nations UNHCR/WFP case study (JavaEE, JavaCard, JavaSE success story).

Trip to Ukraine

On 23th and 24th I had the opportunity for the second time, to attend and speak at JEEConf 2014 in Kiev, Ukraine. This is my one of the favourite conferences I like to attends and share my experience there as well. As I was there in 2013. Among speakers from Ukraine there were a lot from other countries like UK, USA, Switzerland, Germany, Egypt (me), Greece, Sweden, Poland, Netherlands and Russia etc.

Problems

All my friends, colleagues, and work managers advised me to not travel to Ukraine, because of the political situation it has, my only words to reply are:
We already had this experience in Egypt since three years ago, so there is nothing to worry about ☺.
I love Ukraine, especially Kiev, because I have many friends there from attendees, speakers (Victor Polischuk), colleagues from Ukraine JUG Andrii Rodionov as I am EGJUG lead and MoroccoJUG member so we attends many JUG events together, and EBAM employees Olena Syrota.

Therefore I felt that I was in my country and not as a foreign guy.

Hanging out

After my arrival by a day before the event, I have decided to hangout alone to see the city and take some pictures. Then at the hotel reception I have found my friends I have met last year from Oracle Russia Speakers (Alexey Fyodorov, Alexander Belokrylov, and Sergey Kuksenko) and others (Gleb Smirnov from Deutsche Bank, Russia) and finally Ivan Krylov from Azul Systems Russia, then we hanged out together to have a dinner a Ukrainian local restaurant.



Also we went to Khreschatyk Midan (Square), where the revolution began, and here are some pictures







My talks

I have attended many English sessions, and delivered the following sessions as well:

1- Yeah, TRUE real time web applications, no more hacks (a hack session).



2- Developing Native & Hybrid Android mobile Apps, with Netbeans 8.



The first talk (Developing Native & Hybrid Android mobile Apps, with Netbeans 8.) went okay and I have found a lot of interesting questions, and response from people.

But for the second talk (Yeah, TRUE real time web applications, no more hacks (a hack session)) there were many attendees about 100+, and I couldn't take one photo to tweet it, so I have decided to take a panorama one as the following.




It was very interesting to them, and I heard many times that the talk was the best of the day. It was a master session and there were many very good and interesting questions (around 40+ questions) to answer (Thanks God, you helped me to answer all the question and satisfies the attendees).

Therefore at the end of the session, I got many Thanks cards about 41+ cards. It was a great feeling the all attendees had the experience of the talk, mastered the topic, and the hack code (application) get their interest. download it from here, download the zip file from File --> Download, it is netbeans based project.

I think both talks received a warm welcome from the audience, but I cannot be the judge of that, of course. I have just written down what I have heard, got (Thanks cards), and seen from their faces ☺ actions.


Event and Organizers

Thanks for event organizers you did a tremendous work. The hotel was very nice providing excellent services, breakfast, speedy Internet, and complementary shuttle service to any location you would like (I have chosen to drive me to the airport).

Its location was very near from the city centre, and most popular locations, restaurants, and metro stations. The event could be reached by just 4 stations about 13 min from the hotel.

Here are some pictures from my room and hotel:





And I had this great and tasty berry pie in my breakfast at my last day for me at Ukraine


Really the event was very well organized and managed, although the country passes by critical political situation.

I need to mention that there were even lunch for attendees as well as speakers, and many interesting activities. I am so happy to be part of the event successful story.

I had the opportunity to hang out with many speakers, friends, and EPAM employees, and I have enjoyed also the guided tour to many interesting places in Kiev for around three hours with the following speakers Peter Ledbrook, Nicolas Fränkel, Evgeny Borisov and his wife.




Talk to publish

After my return I got message from EPAM Educational head manager on my LinkedIn profile, they asked about my Websocket talk link, to mention it in EPAM magazine in article about JEEConf to be one of the most interesting talk in JEEConf 2014.

My hope

Thanks for this year invitation and looking forward to be part of JEEConf 2015 ☺.


Friday, September 13, 2013

JavaOne & OpenWorld 2013 Activities: One TUT Session, 2 JCP prize nominations, Oracle EMEA partner Dinner, and Architect club café member.


JavaOne and Oracle OpenWorld 2013:

Here are my activities during JavaOne and Oracle Open World 2013, San Francisco, California, USA, this year I have a lot of activities to do:

  1. Build.now(); True Real-Time Applications with Java EE 7 (A Hack Session) [TUT1805]

    This is for the second year; I have the chance to speak at JavaOne 2013. Last year my talks at JavaOne 2012 were about JDK7 NIO.2, and I give in details all what are new introduced by this amazing JSR supported with code.

    This year I am going to talk about JEE 7, especially my adopted JSRs, Websocket, JSON-P, RESTful, and JEE7 and the embracing of HTML5 APIs, alongside my testing contribution on FishCAT program of testing the Glassfish 4 until it becomes a public releases.

    Hope to see you all, and enjoy my tutorial, which leveraged with code examples.

    When: Wednesday, Sep 25, 10:00 AM - 12:00 PM - Parc 55 – Divisidero.

    Content and session registration visit this link.

  2. Nominated for 2 prizes at The 11th JCP Annual Awards 2013

    I am so happy to have the luck being nominated for two prizes at the 11th JCP annual award winning. One of the prizes is for my participation as JCP Member/Participant of the Year, while the other for Outstanding Adopt-a-JSR Participant.

    For nominations and information, please visit below links.

    When: Monday 23 September 2013, at the Hilton San Francisco, Cityscape, starting at 6:00 pm.
    Nomination links: Announcements on JCP Program Office blog, and JCP org events page.

  3. Oracle Eastern Europe, Middle East and Africa Partners Dinner at Oracle Open World 2013

    Every year I got this invitation. This is a gathering dinner for all Oracle partners in EMEA, of course there are a lot of peoples I already know, and new to know and this a good chance to know people and to open business discussions and have new experience, with introduction to my company as it is a big Oracle partner in Egypt.

    I hope to see you there.

    When: Sep 24, 2013 from 07:00 PM – 12:00 AM, at Terra Gallery 511 Harrison Street San Francisco 94105.

  4. EMEA and Oracle Architects Café at Open World.

    I got an invitation to attend this event it is especially for the Architects visiting Open World. It is a good opportunity to meet my peers, connect with Oracle experts, and discuss Oracle solutions with customers. . Oracle organizes the Architects Café for this reason.

    This BeNeLux Architects Networking Event is dedicated to IT issues and solutions, bringing together customers, partners and Oracle experts to discuss the IT solutions and trends in an informal environment.

    Architects Café
    Jasper’s Corner Tap & Kitchen, 401 Taylor Street, San Francisco, CA, USA.
    Monday 23 September 2013
    6:30 pm – 9:30 pm

Saturday, September 7, 2013

HTML5: Parse and Generate JSON data using only Javascript, no external APIs.

JSON
JavaScript Object Notation (best known as JSON) is a lightweight data interchange format known to be compatible with almost every language in common use. It is sometimes used in JavaScript as a replacement for other transport formats, like XML.

JSON is a lightweight, text-based, language-independent data exchange format that is easy for humans and machines to read and write. JSON can represent two structured types: objects and arrays.
  • An object is an unordered collection of zero or more name/value pairs.
  • An array is an ordered sequence of zero or more values.
  • The values can be strings, numbers, booleans, null, and these two structured types.

JSON can be used in Ajax requests or to store and load information on the client side.

ECMAScript 5 includes a native JSON object that is also included in other older browsers. This object allows us to convert standard objects, arrays, and JavaScript variables to a string JSON format using JSON.stringify() and to convert JSON string files to objects again using JSON.parse().

Most modern smartphone and tablet browsers support this object directly, and for older devices we can use a "Douglas Crockford" JavaScript polyfill.

Explore the following code on how those APIs could be used.

Thursday, September 5, 2013

jQuery: Disabling the native right-click contextual menu of the browser

Sometime you need to disable the default right-click context menu of the browser, on your web site, here is how to do it.

By using JavaScript, you can disable the browser’s native right-click contextual menu. Doing so with jQuery is a snap. We simply cancel the contenxtmenu event.

To test the functionality on your page, copy and paste the following code into index.html blank page:


You may be wondered where is the <head> and <title> tags, they are optional in HTML5 :).

Wednesday, August 14, 2013

Why not jQuery? it is Fast, powerful, cross browsers and easy to use framework.

jQuery, jQuery then jQuery, yeah it simplifies the way you touch the HTML via JavaScript.

On jQuery site, its definition as the following:
jQuery is a fast, small, and feature-rich JavaScript library. It makes things like HTML document traversal and manipulation, event handling, animation, and Ajax much simpler with an easy-to-use API that works across a multitude of browsers. With a combination of versatility and extensibility, jQuery has changed the way that millions of people write JavaScript.
Yes, I agree totally with this statement, I make use of the JavaScript framework, jQuery. jQuery simplifies common tasks and provides a single interface to actions that are implemented inconsistently in different browsers. Perhaps the most common use of jQuery in my development is reading in files (XML, JSON, text …etc) or other data from web services, but it also make it easy for traversing the DOM and applying CCS to components in easy way.

The following section is meant to give a quick introduction to using jQuery, and making your hands dirty with code to get the idea. For advanced features of the framework, you can branch to jQuery documentation and API references.

But, wait here for a second, be patient, before you can use jQuery, you need to include it in your web page. You can do so by downloading the latest version at http://jquery.com/ or by grabbing a Google-hosted version by adding the following to the <head> section of your HTML file:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
As of time of this writing, the latest version of jQuery is 2.0.3, and also there are Other CDNs could be used, and are listed on jQuery home page, I have used here Google one.

After adding the library to your page lets, get in touch with jQuery functionality and development.

Once you have included jQuery in your document, you can use its functions via two global variables: jQuery and its shorthand, $.

Demo page structure:
We will use this page in our journey, for the sake of clarity of how to use jQuery.
<head>

jQuery Example
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<style>
.content
{
 padding: 20px;
 width: 200px;
 height: 200px;
 background-color: #CCC;
}

#eventInfo
{
 width: 420px;
 height: 20px;
 background-color: #000;
 color: #CCC;
 font-weight: bold;
 margin-top: 10px;
}
</style>

</head>
<body>
</body>
Query Document Objects
Among its many uses, jQuery is very helpful at quickly and easily extracting elements from your HTML page into JavaScript code. You can query by id, tag name, CSS class, or combinations of these factors. jQuery makes this task easier, so you can focus on what you want to do with those elements.

To grab a single piece of the page, such as the content <div>, you call it by its id. Much of jQuery’s syntax is borrowed from CSS, which may look familiar.

Here is how you would call an object with an id of content:
Notice:
I am using the dollar-sign shorthand. Then I add parentheses because $ is a variable and a function (jQuery stretches the bounds of JavaScript in ways that you and I probably will not). Inside the function, we pass a string with the CSS we would use to style the map div, #content.

Let us see how to add a text to this div content, just use one of the following snippets of code:
Or simple chaining one
You have now used your first jQuery function to query for a specific element and add a text to it. You can achieve the same result with JavaScript’s standard document.getElementById function, but jQuery’s method is faster to type. Plus, the result using $ allows you to chain other jQuery functions, such as visual effects, binding events or applying values and css as we have made in the previous code.

Notice:
Every jQuery function returns a jQuery object wrapping the queried element(s). Therefore, we can use the functions call-chaining mechanism, this pattern is called builder design pattern.

jQuery can also do more than just query individual elements; it can gather multiple elements in a single call. Here are a few examples:
Each of these examples shows a different type of querying—and many more are possible. You can learn about what jQuery calls selectors at http://api.jquery.com/category/selectors/.

Use jQuery to fire browser events
jQuery provides a lean way to use and fires browser events, such as clicking, double clicking or dragging. You can also react to events anywhere in the browser, and jQuery makes reacting a simple process for us.

To respond to an event, you first need to be listening for it. To do so when your page first loads, you register your intention to react to an event. You can do this by adding a JavaScript function to the onload attribute of your <body> tag. Or you can do this with a special jQuery ready event.

Although creating an event to register other events may seem counterintuitive, but believe me it works. Here is an example that waits until the page is ready:
Notice:
That the element we are querying for is a little different from in the past. Instead of a string inside the parentheses, we have inserted a standard JavaScript object, document. When enough of the page has loaded that the browser knows all the objects it contains, we call the register_events function.

That register_events function does not exist, however, so we need to write it. Or, instead, we could react to the same event with an anonymous function:
As with most anonymous functions, you usually want to keep it to just a few lines. If you have many events to register, you are probably best served with a named function.

Note
A big difference exists between using your browser’s onload attribute and jQuery’s ready event. With onload, you wait until the entire page is loaded, including images and other external files. With $(document).ready, you can run code, such as registering events and hiding objects, the moment the browser is ready. Using jQuery here often translates to a better user experience.
Now that you have waited for the browser to be ready to register other events, let us register them. Here is the basic pattern for jQuery events:
The element portion is usually a selector, such as an element’s id (though it can also be any browser object, as shown in the ready example). The event piece is the name of the function, as declared by jQuery. Finally, function is the function reference, either an anonymous function or the name of the function to call.

Here is how you would listen for a particular element to be double clicked:
If you are familiar with JavaScript events included in HTML, you might be wondering where the on, as in onDblClick, went. In jQuery, events are referenced with only the action so it is dblclick.

You can also get additional information about the event. The information available may be a little different depending on the event. Here is how you find out where the user has double-clicked on a page:
I used a dblclick event. Because we want more information about the event, I included an optional parameter e to the anonymous function. Within the function, I can use that variable to get information, such as where the user double clicked. This data comes in two pieces:

The number of pixels from the left side of the page X and the number from the top of the page Y. You can see a sampling of available events in Table 1, along with the additional information that is passed in the optional parameter to each event.

Tip: Try also to double click inside content1 div, at different location and watch how X and Y
value changes.
Table 1: Some Useful jQuery Events

Event Name

Objects Available

Additional Information

click

Any


Page location: pageX, pageY

dblclick

Any

Page location: pageX, pageY

mousemove

Any

Page location: pageX, pageY

keydown

document, window

Key code

focus

Form elements

 
Events will make your web pages much more interactive. For a full list of events (and additional event information available), see jQuery’s documentation at http://api.jquery.com/category/events/.

Insert and Hide Content

Once you have one or more elements from the page using jQuery, you need to do something to them. Here, I will show you a way to add or replace the content inside a page element. In addition, I will also demonstrate an effect that will hide the content, so later, you can make it reappear.

Let us say you want an element on your page where you can show the event information raised from previous double click event such as event type and the event source id. You can add the element with HTML using something like this:
When you are ready to add the event information, you can use jQuery to find the element and then display the event information. If you want to display the content of a variable called info, you could use this single line of jQuery:
This line will find the element on the page with the id of eventInfo and then replace its inner HTML with the value in the info variable. If you just want to add additional content to the element, use this line instead:
Alternatively, use can use chaining feature as the following.
Now the eventInfo div content will look something like this:

Event Info: Event type is: dblclick, raised from: content1

You have seen how to insert content, but what about making that same content disappear? For example, before adding the event Information, a page with just Results: without anything after it looks a bit funny. So when the page loads, run the following code to hide the results element:
Moreover, when you are ready to display the results to the user, include this code:
On the other hand, append it to the last of your chaining command as the following:
These two functions are simple (and very useful) examples of jQuery effects. Many more effects are listed on the jQuery website at http://api.jquery.com/category/effects/.

Final code


jQuery Example
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
<style>
.content
{
 padding: 20px;
 width: 200px;
 height: 200px;
 background-color: #CCC;
}

#eventInfo
{
 width: 420px;
 height: 20px;
 background-color: #000;
 color: #CCC;
 font-weight: bold;
 margin-top: 10px;
}
</style>
<script type="text/javascript" language="javascript">
   //Use ready function to execute all code after browser parse and build DOM tree.
   $(document).ready(function(e) {
     
  // Hideing div with id eventInfo
  $('#eventInfo').hide(); 
  
  // Setting dive text and applying css value for the text to be of color red
  $('#content').text('My name is Mohamed Taman').css('color','red').append('

');
  
   //Get the first span wrapped inside the div with css class 'content' and set its text 
  $('.content span:first').text('Number of divs in the document are: ' + $('div').length);
  
  
  // Register div with id content1 to double click event
  $('#content1').dblclick(function(e) {
        alert('I am double clicked with and event location at, X: '+ e.pageX +', and Y: '+ e.pageY);
 
  var info = 'Event type is: '+ e.type +', raised from: '+ e.target.id;

  $('#eventInfo').html('Event Info: ').append(info).show();
    });
});
</script>

<body>
</body>
Let's wrap up

By now, we have reached to the end of the article, and I hope you enjoyed and find it useful.

In the next part, I will demonstrate an important issue, which is loading and reading data files using jQuery either it is JSON or XML data files. So If you want to interact with data outside of your current HTML file, jQuery has some excellent tools for doing these sorts of Ajax calls. Though Ajax is short for Asynchronous JavaScript And XML, you can access any type of data with Ajax.

Tuesday, July 23, 2013

Web: Faulty HTML, JS, and CSS code, hurts your page Performance, Quality and Debugging.

HTML page is the core

Yes, it is the core of every web project. Therefore, it is very important to code your HTML page properly since it forms the foundation for everything else. Because it is the core of every web page, so without a solid foundation, the stuff you build upon it will easily break.

All web browsers are very forgiving and will often render a page correctly even if the HTML is slightly faulty, and your page finally will render, but you should get your attention for such behavior. I do, however, recommend that you make sure the HTML is coded properly, for a number of reasons:

  • Performance
    Correct HTML code renders faster than incorrect HTML.

    How it comes? Okay let us see, if your code done properly, the browser will interpret the HTML in strict mode, in which it assumes that you know what you are doing. Incorrectly done, and it will switch to quirks mode, in which it is a lot more forgiving in its interpretation of the code.

    This means that you can get away with sloppy code, but since the browser has to guess what you mean, the page takes longer to render.

  • Quality
    Naturally, you want to look professional, and you just don’t look good with HTML that doesn’t validate. Invalid code is the sign of a developer who doesn’t know what he’s doing.

  • Debugging

    In addition, if you don’t have the HTML right, strange errors may occur in your CSS or JavaScript that are really hard to find.

    Both the CSS and a lot of the JavaScript code relies on the HTML being correct, so to make it easier for yourself, make sure that your HTML is correct by validating it frequently.

    This will save you a lot of time and grief.

How do you know that you have a correct HTML code?

It is a simple answer, fortunately W3C (World Wide Web Consortium) provides a tool which validate your code, whether it is a live page by providing its URL, or resides on your computer by uploading the file or past the code.

You will find this validator at W3C markup validation service.

Also your browsers are bundled with validation and inspection tools such as developer tools, alongside a bunch of extensions you can add to your browser for validation process.

Some of Firefox browser tools:

  1. Page Validator: https://addons.mozilla.org/en-US/firefox/addon/2250
  2. Html Validator: https://addons.mozilla.org/en-US/firefox/addon/249
  3. Web Developer Toolbar: https://addons.mozilla.org/en-US/firefox/addon/60

With these tools at your disposal, you are more than ready to get started.


Thursday, July 18, 2013

Oracle: Feel the fun of Oracle Weblogic & JDeveloper 12c on Mac OS X

Oracle fusion middleware 12c stack is now completed and ready for use and supports cloud platform technology stack. The story Begins by releasing Oracle Weblogic 12c last year 2012, then followed by Oracle database 12c this year 2013, and by this month of July the development IDE JDeveloper 12c (2.1.2.0.0) has been released.

WebLogic 12.1.2 is now available. Moreover, is also bundled with the new JDeveloper 12c. WebLogic 12.1.2 comes in two flavors one of size 179MB zip distribution offers Java EE 6 Full Profile development and includes WebLogic Server and Coherence. The generic installer also includes WebLogic Server and Coherence and is patchable via OPatch.

There are two interesting supported components available in WebLogic 12.1.2 out of the box, that already part of JEE 7, one of them is the Websockets protocol support, and the other is JSON Binding via EclipseLink 2.4.2 MOXy's JSON-binding.

JDeveloper 12c comes with a big bunch of enhancements and technology support, one of interesting components is the support for Java EE and Web Development as the following:

  • Java EE 6 Support: JDeveloper wizards and editors have been updated to work with Java EE 6 specifications, including EJB 3.1, Servlet 3.0, CDI, JPA 2.0, EL 2.2, and more.
  • EJB 3.1 Support: JDeveloper provides support for new EJB 3.1 features including:
    • Singleton Session Bean
    • Simplified No Interface Client View
    • Asynchronous Session Bean Invocations
  • TopLink/JPA 2.0:
    • TopLink supports the following JPA 2.0 features:
    • JPA 2.0 project type and JPA 2.0 persistence unit properties
    • Delimited and derived identifiers
    • Mixed access
    • Unidirectional one-to-many mappings
    • Validation mode
    • Element collection
    • Embeddable mapping
  • HTML5, MathML and CSS3 Support: Updated editors for working with latest HTML5 and CSS3 content.
  • CSS editor: Added ability to invoke Quick doc feature for CSS properties and skinning keys, and other editor improvements.
  • JSP to Facelets conversion: User may optionally choose to convert a project's JSP/JSPX content to Facelets.

For more about all new features of JDeveloper 12c, visit what's new in JDeveloper 12c.

The new abbreviation that sticks to the version 12c (is c for Cloud),and it means that the JDeveloper is an enabled Cloud development IDE.

One of the most interesting features of the JDeveloper 12c that worthwhile is its installer, it is very easy to install and runs on mac OS X operating system rather than its previous 11g versions series, avoiding much of boilerplate system configurations to just install it.

So let's see how we can install it on Mac OS, but first let us get the required software to complete the installation process successfully.

Pre-requests software:

  1. Java Development kit 7 update 25+ or less, it is a critical piece of software that allows the installer to pass the prerequisites successfully. It could be downloaded from here.
  2. Download the JDeveloper 12c Generic installer the works on all platforms (it is a jar package).

That's all; let's now go through the installation process.

Installation process
  1. First open your terminal, and type the following command:

    You should make sure that your java version is version 7 pointed out in your system class path, if version is different, you should make your system class path includes the java 7 version.

    If everything is okay then you will see output like the following:


  2. From the same terminal, change your directory to your JDeveloper downloaded jar file, for example I have downloaded the jar file inside a folder named “Oracle JDeveloper 12c (12.1.2.0.0) (Build 6668)” on my mac desktop. To begin installing the JDeveloper issue the following commands:

    Then followed by:

    If everything is going okay then you should see the following output:


    Then the following screen will popped up, and the installation process begins. Choose your inventory, which will, includes your JDeveloper system preferences folder, and OS group permission. I have changed it from stuff to be everyone, and clicked Ok button.(This screen will appear only on mac OS, but if you are using windows OS, the wizard will pop up for the installation and the process will begin from the next step):


  3. On the next screens “Oracle JDeveloper studio installer”, it includes five wizard steps, click next on each of them till finishing the installation, and seeing the following screen:


  4. Click next and the summary page comes with all installation log, including three options as in the following figure, for me I have choose the first option.

  5. Click finish and JDeveloper will start with new splash screen as the following:


  6. After splash screen finished preparing JDeveloper components, the main IDE should open with a new and neat look and feel:


  7. From Tools menu item, click check for update menu, you can make your new JDeveloper 12c, most updated with required components, one of recommended components is jUnit component.


  8. After finished the updates, we need to create a default domain of Weblogic 12.1.2 bundled server, from run menu click "Start server instance":


  9. The Weblogic configuration dialog will appears to provide password, and other configurations:


  10. Click Ok button and the JDeveloper log, will contains all creation and running conversation entries, wait till you find your log ends with the following entries:

Hence, we are here, than we have finished the installation process of JDeveloper 12c, and created a Weblogic 12c domain, so you can rock and give your hand the touch of JEE6 on the new release.

Happy coding :)


Thursday, June 13, 2013

JEE: Java EE 7 (Glassfish v4.0) is out, putting the productivity at your hands.


My participation:

I am so proud of being part of Adopt-A-JSR program and my involvement in the testing, evaluating and evangelist JEE 7 JSRs and related technologies.
Alongside FishCAT program that target the enhancement and stabilizing Glassfish version 4.0.

Java EE 7 is out:

The most interesting and productive shipped with plumbing of cutting-edge (innovative) technology support; Java Enterprise Edition 7 (JEE 7) is out for public, as promised to be released in Q2 of 2013. The JSR 342 Java Platform, Enterprise Edition 7 could be downloaded from here.

Java EE 7 release is being designed with primary focus on the following features:

  1. Higher Productivity.
  2. HTML5 Support.

Alongside JEE 7 specification release, its modular and most efficient reference implementation application server Glassfish v4.0 is out for development of JEE 7 applications, and could be downloaded from glassfish.org web site. In addition, it is the world's first Java EE 7 Application Server.

Glassfish.org web site redesigned with new clear, fresh design as well. It looks very neat.

For release notes, it could be downloaded from here.

There are also many examples to get start, which could be found in documentation section.

Java EE 7 IDE is out:

For sake of development and get your hands dirt with JEE 7 specification that should be tested on Glassfish v4.0, there is a Netbeans 7.3.1 IDE, which includes support for JEE 7 full JSRs stack. It could be also downloaded from netbeans.org. Also, bear in mind that Netbeans JEE version includes Glassfish v4.0.

Consult the following page to see more IDEs (Integrated Development Environment) that supports Java EE 7 development: IDEs and plugins.

Try, Develop and have fun

As by now you have the JEE7 specification, Glassfish v4.0 and supported IDE Netbeans v7.3.1 (everything you need comes out-of-the-box without any plugin), so what are you waiting for, click to download and develop to get the feel of new smile of the technology.

Maven Development

For maven fans to develop a Java EE7 application here is the minimal POM pom.xml file:


For Java EE 7 Full Platform

For Java EE 7 Web Profile

For other Java EE 7 JSRs coordination, please visit Java EE 7 Maven Coordinates Wiki link.

Webcasts and Developer days

Besides the finished event "Java EE 7 Launch Webcast", there is another java developer day covering Java EE 7, SE, and Embedded named "Java Developer Day - June 25 - Java SE, Java EE & Java Embedded" that will be online at Tuesday, June 25, 2013, register here.

Tutorials and examples

Visit Java EE 7 Documentation: JEE 7 Tutorial, for full tutorials and examples on how to use the specification alongside its JSRs.

All my sessions, hacks and code contribution could be downloaded from this link under Adopt-A-JSR organization under Github Java EE 7 Hacks, codes and sessions.

Monday, May 6, 2013

Tunis JUG Day 2013: I will give 2 talks about (JEE7 JSR 356 Wbsockets, 353 JSON-P & Java8 NIOs)

The first edition of ESPRIT JUG DAY will be held on May 18 2013 from 8h00 to 19h00 in ESPRIT.

I am so happy to get an invitation to Tunisian JUG day that will be held in Carthage city, Tunis coming 18/5/2013 from JUG organizer & Leader Bessem Hamidi .


This is first time for the This JUG to organize such an event, and as I know, there are around 3000+ attendees will attend this JUG day; it is very big day event and number of attendees as well.

I will give 2 talks and they are:
  1. Submission Title:
    Build.now(); TRUE, Real Time Applications with JEE7 (A hack session).

    Submission Abstract:

    Historically, creating web applications that need bidirectional communication between a client and a server (e.g., instant messaging & gaming applications) has required an abuse of HTTP to poll the server for updates while sending upstream notifications as distinct HTTP calls.

    HTML5 specification includes the WebSockets (WS) protocol, I will introduce the Websocket JSR 356 (Tyrus RI), & JSON Processing JSR 353 for data exchange which is part of JEE7.

    In addition, there is a brief comparison of traditional HTTP & WS, followed by covering of how WebSockets works. You will see how using WS removes the overhead of heavy HTTP request and response headers with real case study. Finally, we will review the code of the Web app build on GlassFish 4 app server.

    Time: 17h00 - 18h30

  2. Submission Title:
    Java 8 NIO.2 API features, a walkthrough (The essential & advanced Stuff).

    Submission Abstract:

    Most of applications nowadays depend intensively on asynchronous or non-blocking IO and file manipulation operations and some other requirements that the standard IO won’t be able to fulfill and that’s the case for most applications today, that’s why people decided to move to NIO, in this session, hear how a leading financial services company uses Java NIO.2. This session will covers all the essential aspects involved in developing NIO.2-based applications day by day. It provides clear instructions for getting the most out of NIO.2 and offers many case studies to spice up your Java applications with the new I/O capabilities.

    Time: 11h00 - 13h00

Date: 18 of May 2013
Where: Esprit School Conference room, Carthage city, Tunis.

Before the first session I will introduce the adopt-A-JSR program, and in the second one I will introduce the Adopt-OpenJDK program as well so I can spread these programs knowledge, to get more participants.

Moreover, the JUG leader asked me to help them, on the adopt-A-JSR & Adopt-OpenJDK programs process and how they can participate. And indeed I will provide the help with all steps, materials and information alongside the required support to make it easy to participate. As they are very active locally and the JUG has many participants (around 3000+), so the adoption programs can gain benefits from their experiences.

The Esprit team is the organizer of this JUG Day, and they are very active and they are running a big Esprit school that graduate students in the following Majors Media, Telecom, software engineering and others. Also they have 8 classes running Java in this school.

They had made a very cool intro media for the event:



Thanks Very much Bessem Hamidiand Esprit Organisers.