• Share
  • Email
  • Embed
  • Like
  • Save
  • Private Content
Javaone Brazil 2012: Integrando Ext JS 4 com Java EE
 

Javaone Brazil 2012: Integrando Ext JS 4 com Java EE

on

  • 1,651 views

Integrando Ext JS 4 com Java EE

Integrando Ext JS 4 com Java EE

Diferentes Frameworks: Prós e Contras
e alguns cuidados que devemos ter


Loiane Groner
@loiane
http://loiane.com

Statistics

Views

Total Views
1,651
Views on SlideShare
1,646
Embed Views
5

Actions

Likes
3
Downloads
27
Comments
0

1 Embed 5

https://twitter.com 5

Accessibility

Categories

Upload Details

Uploaded via as Adobe PDF

Usage Rights

© All Rights Reserved

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Processing…
Post Comment
Edit your comment

    Javaone Brazil 2012: Integrando Ext JS 4 com Java EE Javaone Brazil 2012: Integrando Ext JS 4 com Java EE Presentation Transcript

    • Integrando Ext JS 4 com Java EEDiferentes Frameworks: Prós e Contras e alguns cuidados que devemos ter Loiane Groner @loiane http://loiane.com
    • Loiane GronerApaixonada por Java eSencha7+ XP Java4+ XP SenchaSoftware DevelopmentManager @ Citibank@loianehttp://loiane.com
    • http://www.dfjug.org/ amigos.jsp
    • Ext JS 4
    • sencha.com
    • Cross-Browser
    • Alguns Exemplos
    • FácilIntegração
    • FácilIntegração
    • FácilIntegração
    • FácilIntegração
    • ConstruindoAplicações Ext JS 4
    • Como Organizarum Projeto JS?
    • Incluir JS em cada jsp?
    • Incluir JS em cada jsp? listarCliente.jsp<script> listarCliente.js?
    • Incluir JS em cada jsp? listarCliente.jsp<script> listarCliente.js? Não é assim em Ext JS!
    • Projeto Java + Ext JS 1 index.jsp apenas
    • Projeto Java + Ext JS 1 index.jsp apenasExt JS também usa MVC
    • MVC
    • Código precisa ser organizadoBoas práticas precisam ser seguidas Fácil manutenção Fácil trabalho em equipe
    • Model
    • Ext JSCarrega e Gerencia dados da app Dados dos requests da View
    • Java POJORepresenta entidade banco de dados
    • View
    • Ext JSGerencia dados na View Componentes UI
    • Java JSPExt JS assume responsabilidade
    • Java JSPExt JS assume responsabilidade MVC dentro de MVC!!!
    • Controller
    • Ext JSGerencia inputs do usuário Atualiza Model e View
    • Java Gerencia requests da view... Enviar request pro Serviço (opcional)...Retorna response para a View
    • Java Gerencia requests da view... Enviar request pro Serviço (opcional)...Retorna response para a View View == Ext JS
    • DAO
    • Java Classe DAOComunicação com BancoHibernate, JPA ou outro
    • Ext JSNão comunica com bando de dados Stores - Coleção de Models Proxies - comunica com Server
    • ArquiteturaExt JS 4 + Java
    • ComunicaçãoExt JS <-> Java
    • Servlets
    •                //get  out  Grid  paging  toolbar  parameters                String  start  =  request.getParameter("start");                String  limit  =  request.getParameter("limit");
    •                //get  out  Grid  paging  toolbar  parameters                String  start  =  request.getParameter("start");                String  limit  =  request.getParameter("limit");                //printwriter  to  send  the  JSON  response  back                PrintWriter  out  =  response.getWriter();                //set  content  type                response.setContentType("text/html");
    •                //Create  a  JSON  object  to  wrap  your  JSOn  array                JSONObject  myObj  =  new  JSONObject();                //sets  success  to  true                myObj.put("success",  true);                //set  the  JSON  root  to  items                myObj.put("root",  arrayObj);                //set  the  total  number  of  Items                myObj.put("total",  itemInformation.getTotalCount());                  //convert  the  JSON  object  to  string  and  send  the  response                out.println(myObj.toString());                out.close();
    • WebSockets Java EE 7
    • Arun Gupta Talkhttp://www.slideshare.net/arungupta1/websocket-10
    • Arun Gupta Talkhttp://www.slideshare.net/arungupta1/websocket-10
    • Jax-RS
    • VRaptor
    •      public  void  list()  {     result.use(ExtJSJson.class).from(this.contactDao.list()) .success(true).serialize();   }
    • @Post @Consumes("application/json") public void create(Contact data){ this.contactDao.create(data); result.use(ExtJSJson.class).from(data) .success(true).serialize(); }
    • ExtJSJon.class
    • ExtJSJon.classApenas para Grid e Tree!
    • Spring 2.5
    • <bean  name="jsonView"  class="net.sf.json.spring.web.servlet.view.JsonView"  />
    •          public  ModelAndView  handleRequest(HttpServletRequest  request,       HttpServletResponse  response)  throws  Exception  {     //obtém  o  parâmetro  de  início     String  iniParam  =  request.getParameter("start");     int  inicio  =  (iniParam  ==  null)  ?  0  :  Integer.parseInt(iniParam);     //gera  os  contatos     List<Contato>  contatos  =  GerenciaContatos.getJson(inicio);     Map<String,Object>  modelMap  =  new  HashMap<String,Object>(2);     modelMap.put("total",  GerenciaContatos.LIMITE);     modelMap.put("rows",  contatos);     return  new  ModelAndView("jsonView",  modelMap);   }
    • Spring 3.x
    • @RequestMapping(value="/contact/view.action")   public  @ResponseBody  Map<String,?  extends  Object>   view(@RequestParam  int  start,  @RequestParam  int  limit)  throws  Exception  {     try{       List<Contact>  contacts  =  contactService.getContactList(start,limit);       int  total  =  contactService.getTotalContacts();       return  ExtJSReturn.mapOK(contacts,  total);     }  catch  (Exception  e)  {       return  ExtJSReturn.mapError("Error  retrieving  Contacts  from  database.");     }   }
    •      public  static  Map<String,Object>  mapOK(List<Contact>  contacts){     Map<String,Object>  modelMap  =  new  HashMap<String,Object>(3);     modelMap.put("total",  contacts.size());     modelMap.put("data",  contacts);     modelMap.put("success",  true);     return  modelMap;   }
    • Alguns Cuidados
    • FormsUpload de Arquivos (Ajax Request)
    • Leitura deNested Models(Associations)
    • Envio (server) de Nested Models (Associations)
    • ComunicaçãoCross-Browser
    • Ajax?
    • JSON-P?
    • WebServices - Ext JS?
    • WebServices - Ext JS? $21,950
    • WebServices - Ext JS? $21,950 #Fail!
    • WebServices - Java
    • Sencha Touch
    • . .Views Views . Controllers Models Stores Proxies Servidor == Java on n
    • Conclusão
    • @loianehttp://loiane.comgithub.com/loiane