JSF

Soluções de cloud IaaS/PaaS

 

A dica de hoje são algumas empresa soluções em cloud IaaS/PaaS. Todas possuem vantagens e desvantagens em relação a preço e serviço prestado.

O Bluemix possui um conceito de PaaS (Product As A Service) onde ele minimiza os trabalhos de configurações e gerenciamento de instâncias tornando a vida do desenvolvedor muito mais fácil. Heroku, AWS e Digital Ocean são outras três empresas que se destacam no mercado.

Enfim, cabe você analisar e decidir qual a melhor solução para você e sua empresa.

Segue a lista:

IBM Bluemix: http://bluemix.net
AWS Amazon: http://aws.amazon.com
Digital Ocean: http://digitalocean.com
Linode: http://linode.com
Heroku: http://heroku.com
OpenShift: http://openshift.com

 


E qualquer que nele tem esta esperança purifica-se a si mesmo, como também ele é puro.
1 João 3:3

 

Anúncios

Testando webservices SOAP

Eu odeio soap e não nego, mas sempre surge aquela integração com sistema legado e chato que temos que realizar.

Uma grande ferramenta que eu uso no meu dia-a-dia é o http://wsdlbrowser.com/ onde é possível  testar as chamadas do serviços do webservice sem que eu tenha que por mãos no código.

2016-09-21_1557

Muito prática e útil. Para quem não conhecia, espero que eu tenha dado uma excelente dica.


No dia em que eu clamei, me escutaste; e alentaste com força a minha alma. Salmos 138:3

PrimeUI – PrimeFaces independente da tecnologia Server-Side

Muitos desenvolvedores Java Web conhecem o poderoso JSF e aliado ao JSF conseguimos construir interfaces ricas com seus múltiplos frameworks, um desses frameworks é o PrimeFaces.

Recentemente os criadores do PrimeFaces criaram o PrimeUI que é uma versão do PrimeFaces para ser usada puramente com CSS-JS. Ela é totalmente independente da tecnologia Server Side, ou seja podemos ligar ela com Java, PHP, Python e outras linguagens da vida.

O link para mais detalhes está logo abaixo:

http://primefaces.us8.list-manage.com/track/click?u=c6533c73c376179b71ce75776&id=71126a3431&e=b796030a20


Ao Senhor teu Deus adorarás, e só a ele servirás. Mateus 4:10

Integrando jQuery Mobile com JSF 2.2.

Nesse post ensinarei a integrar o jQuery Mobile (framework baseado em jQuery e jQuery UI para construção de interfaces web para dispositivos móveis) com o JSF.

O primeiro passo é criar um projeto Maven com JSF 2.2. no Eclipse (Ensinei isso no post anterior).

O segundo passo é baixar a biblioteca do jQuery Mobile 1.4.5 em:

Zip File: jquery.mobile-1.4.5.zip

Agora vamos adicionar o framework em nosso projeto JSF 2.2., crie dentro da pasta WebContent uma pasta chamada resources, dentro da pasta resources crie uma pasta chamada skin e por fim dentro de skin crie as pastas css js.

A estrutura deverá ficar dessa maneira:

Captura de Tela 2015-05-25 às 21.03.44
Descompacte o arquivo jquery.mobile-1.4.5.zip  e copie as o arquivo jquery.mobile-1.4.5.min.css e a pasta images para a pasta css. E copie o arquivo jquery.mobile-1.4.5.min.js para a pasta js do projeto. Na pasta descompactada abra a pasta demo e logo em seguida a pasta js e copie o arquivo jquery.min.js para a pasta js do projeto.

Pronto, temos o mínimo para iniciar um projeto jQuery Mobile!

Crie um arquivo index.xhtml com o seguinte conteúdo:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:jsf="http://xmlns.jcp.org/jsf">
<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Hello JQM</title>
	<h:outputStylesheet library="skin"
		name="css/jquery.mobile-1.4.5.min.css" />
	<h:outputScript library="skin" name="js/jquery.min.js" />
	<h:outputScript library="skin" name="js/jquery.mobile-1.4.5.min.js" />
</h:head>
<h:body>
	<div id="pagina1" data-role="page">
		<div data-role="header">
			<h1>Exemplo jQuery Mobile com JSF 2.2.</h1>
		</div>
		<div role="main" class="ui-content">
        	<form data-ajax="false"  jsf:id="form" jsf:prependId="false">
			    <input placeholder="Texto..." type="text" name="texto"
					jsf:value="#{jqueryManagedBean.texto}" jsf:id="texto"  />     
				<button jsf:action="#{jqueryManagedBean.irPagina2}">Envia</button>
			</form>
		</div>
	</div>
</h:body>
</html>

Nessa tela chamamos as bibliotecas do jQuery Mobile usando as tags h:outputStylesheet e h:outputScript. E depois criamos uma página do jQuery com um campo de texto e um botão que ficará conectado à um Managed Bean.

A novidade está no namespace jsf onde utilizamos ele para chamar as propriedades do JSF dentro do HTML. Essa novidade está disponível apenas na versão 2.2 do framework.

No input text ligamos o campo com o atributo texto da classe JqueryManagedBean que será apresentada em breve utilizando o atributo jsf:value.

E no button usamos o atributo jsf:action para chamar o metódo irPagina2 do nosso managed bean.

Visite esse link para mais detalhes:

https://fernandofranzini.wordpress.com/2014/10/17/jsf2-2-html5-combinacao-perfeita-para-2015/

No nosso form usamos os atributos jsf:id e jsf:prependId que servem para definir o id e impedir que o JSF gere um id de maneira automática respectivamente.

E também desabilitamos o ajax do jQuery Mobile usando o atributo data-ajax= ‘false’.

Aqui segue o código de nossa managed bean com escopo de sessão (SessionScoped) que ficará responsável por definir o atributo texto e o método irPagina2 que redirecionará o usuário para a pagina2.xhtml (Em breve apresentada):

package hellomaven;


import javax.enterprise.context.SessionScoped;
import javax.faces.bean.ManagedBean;


@SessionScoped
@ManagedBean
public class JqueryManagedBean {
	
	private String texto;
	
	
	public String getTexto(){
		return this.texto;
	}
	
	public void setTexto(String texto){
		this.texto = texto;
	}
	
	
	public String irPagina2(){
		return "pagina2";
	}
	
}

E por fim segue o código da pagina2.xhtml que apenas apresentará o que o usuário digitou no campo de texto da tela anterior.

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:jsf="http://xmlns.jcp.org/jsf"
	xmlns:f="http://java.sun.com/jsf/core">
<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Página 2</title>
	<h:outputStylesheet library="skin"
		name="css/jquery.mobile-1.4.5.min.css" />
	<h:outputScript library="skin" name="js/jquery.min.js" />
	<h:outputScript library="skin" name="js/jquery.mobile-1.4.5.min.js" />
</h:head>
<h:body>
	<div id="pagina1" data-role="page">
		<div data-role="header">
			<h1>Página 2.</h1>
		</div>
		<div role="main" class="ui-content">
			<h:outputText value="O Texto digitado foi: #{jqueryManagedBean.texto}" />
		</div>
	</div>
</h:body>
</html>

O Resultado esperado disso tudo se ve nas imagens 1 e 2:

Captura de Tela 2015-06-06 às 17.48.07

Imagem 1

Captura de Tela 2015-06-06 às 17.48.24

Imagem 2


Portanto, qualquer que me confessar diante dos homens, eu o confessarei diante de meu Pai, que está nos céus. Mateus10:32

Criando um projeto JSF 2.2 com Maven (Eclipse)

Nesse tutorial, farei um passo a passo de como criar um projeto no Eclipse baseado em Maven com o JSF 2.2. configurado.

Criando e configurando

Estou utilizando o Eclipse Luna para realizar esse tutorial, que é a ultima versão. Selecione em seu Eclipse  New >  Maven Project
Marque a opção “Create a simple project (skip archetype selection)” e clique depois em Next.

Captura de Tela 2015-05-12 às 09.44.44

Nessa próxima etapa preencheremos os dados do projeto, Em packaging selecione war para utiliza-lo como projeto independente.

Captura de Tela 2015-05-12 às 09.45.41

Agora seu projeto foi criado. Porém ainda precisamos de várias configurações. Vamos configurar o projeto para usar o Java 1.8. Botão direito > Properties > Java Compiler e coloque “Compiler compliance level” para 1.8.

Captura de Tela 2015-05-12 às 09.53.43

No menu na esquerda selecione Project Facets, e marque as opções:

Dynamic Web Module version 3.0
Java version 1.8
– Javascript
JavaServer Faces version 2.2

Ou marque a opção JavaServer Faces v2.2 Project em Configuration.

Clique em “Ok” e quando pronto, o Eclipse vai fazer um rebuild no seu projeto.

 Adicionando JSF no pom.xml

<dependencies>
    <dependency>
        <groupId>com.sun.faces</groupId>
        <artifactId>jsf-api</artifactId>
        <version>2.2.2</version>
    </dependency>
    <dependency>
        <groupId>com.sun.faces</groupId>
        <artifactId>jsf-impl</artifactId>
        <version>2.2.2</version>
    </dependency>
    <dependency>
        <groupId>javax.servlet</groupId>
        <artifactId>javax.servlet-api</artifactId>
        <version>3.0.1</version>
    </dependency>
</dependencies>

 Configurando o web.xml


<welcome-file-list>
	<welcome-file>index.xhtml</welcome-file>
</welcome-file-list>
<servlet>
	<servlet-name>Faces Servlet</servlet-name>
	<servlet-class>
           javax.faces.webapp.FacesServlet
    </servlet-class>
    <load-on-startup>1</load-on-startup>
</servlet>
<servlet-mapping>
	<servlet-name>Faces Servlet</servlet-name>
	<url-pattern>*.xhtml</url-pattern>
</servlet-mapping>
<session-config>
	<session-timeout>30</session-timeout>
</session-config>

As tags <servlet> e <servlet-mapping> mapeia suas páginas .jsf para javax.faces.webapp.FacesServlet.

É ideal também configurar o parâmetro PROJECT_STAGE para Development, com isso você poderá ver warnings e/ou errors na tela.

<context-param>
    <param-name>javax.faces.PROJECT_STAGE</param-name>
    <param-value>Development</param-value>
</context-param>

Para finalizar dentro da pasta WebContent crie um arquivo index.xhtml com o código:

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title>Hello JQM</title>
</h:head>
<h:body>
	<h3>Hello JQM</h3>
	<h:outputText value="Teste" />
   </h:body>
</html>

Basta rodar o projeto e Voilà!:

Captura de Tela 2015-05-19 às 17.01.41

 

Agora estamos prontos para construir uma app JSF 2.2. Em breve farei novos tutoriais no qual esse será útil.


Não temas, porque eu sou contigo; não te assombres, porque eu sou teu Deus; eu te fortaleço, e te ajudo, e te sustento com a destra da minha justiça.
Isaías 41:10