MVC Model 3
4 likes1,163 views
Palestra no PBJUG http://www.milfont.org/tech/2011/06/25/n-esimo-encontro-do-pbjug/
![Framework sobre CGI <html> <body> Welcome <?php echo $_POST["fname"]; ?>!<br /> You are <?php echo $_POST["age"]; ?> years old. </body> </html>](https://image.slidesharecdn.com/mvcmodel3-110709084905-phpapp02/85/MVC-Model-3-10-320.jpg)
![Camada [Tier] Server @Entity public class Project { @Id @GeneratedValue(strategy = GenerationType.AUTO) private Long id; private String name; public Long getId() { return id; } public void setId(Long id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public class AjaxFacade { public Project cadastrar(Project project) { //cadastra... return project; } }](https://image.slidesharecdn.com/mvcmodel3-110709084905-phpapp02/85/MVC-Model-3-19-320.jpg)
![Camada [Tier] Client var project = { name: “Projeto teste” } AjaxFacade.cadastrar(project, { callback: function(retorno) { /* Trata UI */ }, errorHandler: function(mensagem, erro) { /* trate os erros */ } });](https://image.slidesharecdn.com/mvcmodel3-110709084905-phpapp02/85/MVC-Model-3-20-320.jpg)
![Camada [Tier] Client var project = { name: “Projeto teste” } AjaxFacade.cadastrar(project, { callback: function(retorno) { /* Trata UI */ }, errorHandler: function(mensagem, erro) { /* trate os erros */ } });](https://image.slidesharecdn.com/mvcmodel3-110709084905-phpapp02/85/MVC-Model-3-21-320.jpg)
MVC Model 3
- 1. Combinando Frameworks Javascript com VRaptor, uma abordagem prática
- 2. Milfont Consulting 2006 - 2008 Desenvolvimento – Treinamento - Mentoring Resgate de Projetos - Code Review
- 5. HTTP HTML Protocolo de mensagens Mensagem
- 6. HTTP HTML Protocolo de mensagens Mensagem Request URL:http://localhost:3000/ Request Method:GET Status Code:304 Not Modified <!DOCTYPE html> <html> <head> <title>PBJUG</title> </head> <body> </body> </html>
- 7. <FORM action="http://somesite.com/prog/adduser" method="post"> <P> <LABEL for="firstname">First name: </LABEL> <INPUT type="text" id="firstname"><BR> <LABEL for="lastname">Last name: </LABEL> <INPUT type="text" id="lastname"><BR> <LABEL for="email">email: </LABEL> <INPUT type="text" id="email"><BR> <INPUT type="radio" name="sex" value="Male"> Male<BR> <INPUT type="radio" name="sex" value="Female"> Female<BR> <INPUT type="submit" value="Send"> <INPUT type="reset"> </P> </FORM>
- 8. CGI
- 9. Linguagens de script sobre CGI my $your_age_html = ""; my @your_age_opts = ("Please select","Under 18","18-35","35-55"); foreach my $your_age_option ( @your_age_opts ) { $your_age_html .= "<option value=\"$your_age_option\""; $your_age_html .= " selected" if ( $your_age_option eq $your_age ); $your_age_html .= ">$your_age_option</option>"; }
- 10. Framework sobre CGI <html> <body> Welcome <?php echo $_POST["fname"]; ?>!<br /> You are <?php echo $_POST["age"]; ?> years old. </body> </html>
- 11. Final dos anos 90 public class HelloWorld extends HttpServlet { public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { PrintWriter out = response.getWriter(); out.println("<form action=\"http://somesite.com/prog/adduser" method="post"> "); //... } }
- 12. Final dos anos 90 <%@ page import=java.util.Date %> <%@ page import=java.lang.String %> <% String msg = ""; String mesString = request.getParameter("mesNasceu"); int mes = Integer.parseInt(mesString); Date dateNow = new Date(); int monthNow = dateNow.getMonth() + 1; mes -= monthNow; if (mes == 1) msg = "Falta apenas "+ mes +" mês para o seu aniversário."; if (mes == -1) msg = "Seu aniversário foi no mês passado"; if (mes > 1) msg = "Faltam "+ mes +" meses para o seu aniversário."; if (mes == 0) msg = "Oba... estamos no mês do seu aniversário."; else if (mes < 1) { mes *= -1; msg = "Seu aniversário foi a "+ mes +" meses atrás."; } %> <html><body> <h3><%= msg %></h3> <br><br><br> <a href="Javascript:history.back(-1)">voltar</a> </body></html>
- 13. Início dos anos 2000 <jsp:root xmlns:jsp="http://java.sun.com/JSP/Page" xmlns:c="http://java.sun.com/jsp/jstl/core" version="2.0"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>c:forEach Example</title> </head> <body> <table> <c:forEach var="person" items="${people.people}"> <tr> <td>${person.name}</td> <td>${person.age}</td> <td>${person.height}</td> </tr> </c:forEach> </table> </body> </html>
- 14. Component-based <h:commandButton id="submit" value="#{msg.buttonHeader}" action="nextPage"> </h:commandButton> <input id="_id0:submit" type="submit" name="_id0:submit" value="Next Step"/>
- 15. MVC
- 16. MVC Model 2
- 17. XHR
- 18. New MVC
- 19. Camada [Tier] Server @Entity public class Project { @Id @GeneratedValue(strategy = GenerationType.AUTO) private Long id; private String name; public Long getId() { return id; } public void setId(Long id) { this.id = id; } public String getName() { return name; } public void setName(String name) { this.name = name; } public class AjaxFacade { public Project cadastrar(Project project) { //cadastra... return project; } }
- 20. Camada [Tier] Client var project = { name: “Projeto teste” } AjaxFacade.cadastrar(project, { callback: function(retorno) { /* Trata UI */ }, errorHandler: function(mensagem, erro) { /* trate os erros */ } });
- 21. Camada [Tier] Client var project = { name: “Projeto teste” } AjaxFacade.cadastrar(project, { callback: function(retorno) { /* Trata UI */ }, errorHandler: function(mensagem, erro) { /* trate os erros */ } });
- 22. Widgets
- 23. Demonstração Sorry, periferia que não foi ao evento!
- 24. Rest
- 25. Rest Isso não é Rest
- 26. VRaptor @Resource public class ExtjsController { private final Result result; public ExtjsController(Result result) { this.result = result; } @Path(" /usuario/{usuario.id} ") @Put public void altera(Long id) { Usuario usuario = usuarioService.buscaPorId(id); //alterar usuario result.use(json()).withoutRoot().from(usuario).serialize(); } }
- 27. VRaptor @Resource public class ExtjsController { private final Result result; public ExtjsController(Result result) { this.result = result; } @Path(" /usuario/{usuario.id} ") @Put public void altera(Long id) { Usuario usuario = usuarioService.buscaPorId(id); //alterar usuario result.use(json()).withoutRoot().from(usuario).serialize(); } }
- 28. MVC Javascript