Category: Tutorial @en

Tutorial web development (with JSF) VIII: Backstage

In a traditional application, usually the application itself is responsible for the presentation. Even if you should use a special display sever such as X, it is still controlled by the application.

Unlike in a web application. Here the data is passed to a browser, which takes care of the presentation. To do such, the server packs the content to display into in a (X) HTML document. In addition, the server may provide some layout information in the form of cascading style sheets (CSS). Then, everything else is up to the browser. And just as there are different browsers, the representation can be different. The continuous development of standards ensures here fortunately a gradual convergence. But, if the user keeps a local CSS here, then the presentation again might be different. Continue reading “Tutorial web development (with JSF) VIII: Backstage”

JPA and Multilingual booklist

Take a look at my book list at it-rezension.de. You may recognize the buttons for the different languages. Most books are described with German texts, but some have English description too (and there will be more soon).

The business rule is: Display text in choosen language. If there is no such text, then display the text in default language (wich is German). Continue reading “JPA and Multilingual booklist”

JSF: Quick way to switch language

If you search the web, you’ll find a couple of solutions to change the language of your web application. I like to contribute an other one, which might be the shortest 😉

Suppose, you want to display all supported languages in their native tongue.   Thus, you need no translation for the language names. The language codes are simply passed as parameter to your action.

Here is what you need in your JSF page (feel free to replace commandBotton by commandLink or something else):

<h:commandButton action="#{tool.changeLang('de')}" immediate="true" value="Deutsch"/>
<h:commandButton action="#{tool.changeLang('en')}" immediate="true" value="English"/>
<h:commandButton action="#{tool.changeLang('fr')}" immediate="true" value="Français"/>

And in Tool.java you need this short method:

public String changeLang(String langCode) {
       FacesContext.getCurrentInstance().getViewRoot().setLocale(new Locale (langCode));
       return null;
}

That’s all.

 

To web development content.

Tutorial web development (with JSF): Application “BookReview”, Part I

In my blog, I publish a list of those books, I wrote a review for. Every book will be displayed in a table with this information:

  • Title
  • Subtitle
  • Author(s)
  • Publisher
  • Year
  • Language
  • ISBN
  • Short text
  • Reference to my rewiew

These information is written manually and has to be maintained for every category and language. Changing the layout (if more than just CSS) will be a huge effort.

Now, I want to develop a multiligual application for publishing my booklist in an easy manner. One goal is to publish this information from a single soure in diverse categories and / or languages. Every book should be listet in the appropriate category just by assigning this category. The layout may change and should be maintained at a central place to be used for all books.
Continue reading “Tutorial web development (with JSF): Application “BookReview”, Part I”

Tutorial JSF, NetBeans 7.1

In the last part of my tutorial I denoted which follows next. Then, I used a new editor, which damaged all the source code parts. I re-created them and continued with the English translation. I’ll finish the translation before I’ll continue with the next part.

On the other side, NetBeans 7.1 will be ready soon. I’m active on testing this new version and this work will need some time, too. Thus, please be patient for the next part of my tutorial.

Tutorial web development (with JSF) VI: Templates

Templates

In the last part of this series, we created a second page, which looked similar to the first one. Now, we will put the common parts into a central place. To do this, we’ll create a template, which acts as kind of container for the shared part, which contains some individual information.

As a reminder, here is the souce of tese two pages:

Continue reading “Tutorial web development (with JSF) VI: Templates”

Tutorial web development (with JSF) V: Scene change

Scene change

The tiny calculator is now functional. After entering the two parameters ans clicking on one of the buttons for the basic arthimetics, you’ll get the result just below the buttons. This is well designed since the usuer usually wants to stay on this site and continues calculating. On the other side, lots of apps exists with quite a couple of pages. For example, think about a booking system or a shop. Finishing a transaction you’ll usually get es confirmation page. I like to demonstrate you something similar: The result od the addition will be presented on a different page. A button “back” leads you back to the calculator’s main page. This is not a very user friendly design, but it’s just to show you a first approach of page nagvigation.

Continue reading “Tutorial web development (with JSF) V: Scene change”

Tutorial web development (with JSF)

For a while, I had not written a new article for my tutorial. Those people, who follow me on Twitter may know about my heavy workload at the institute. Currently, I got a feedback by Andreas Schlappig, who recognized this tutorial as interesting and send me soma errata. Thus I like to tell you, I'm planning to re-start writing articles apx. at mid of April. Since I'm going to delve deeper insight, it will hopfully will continue to be interesting and helpfully.

Tutorial web development (with JSF) IV: Styles

Styles

Now, our tiny caculator masters the basic arithmetics. Within the browser, this looks a bit compact. It’s usefull to design the user interface. And the medium of choice to design a web page are the cascading style sheets (CSS).

Since this is a JSF tutorial and not a CSS one, I’ll only show how to implement this into a JSF project. It’s not a complete design, just a demonstartion of the principle how to incorporate this into a JSF project.

NetBeans offers a wizzard to create styles for JSF. After a right-click onto the project within the project tree, just choose New->Other and in the following dialog from the domain “Web” “Cascading Style Sheet”.

Continue reading “Tutorial web development (with JSF) IV: Styles”