Pro Yearly is on sale from $80 to $50! »

Aplicações Web Modernas (2015)

Aplicações Web Modernas (2015)

5b6ee6fc4089c6f2e5f8403d9bf9ef08?s=128

Guilherme Farias

August 07, 2015
Tweet

Transcript

  1. Aplicações Web Modernas

  2. None
  3. None
  4. JavaScript Evoluiu

  5. None
  6. Não Há arquitetura “universalmente correta”

  7. Aplicações Web Moderna

  8. - Elas usam muito do HTML 5 para ter a

    sensação de ser uma aplicação nativa (desktop) - São desenvolvidas pensando-se que, ao ficar offline, o usuário possa continuar a utilizar a aplicação (como um aplicação desktop) - Elas reconhecem o dispositivo em que estão sendo executadas (celular, desktop, tablet, etc) - A aplicação é projetada num estilo client-side.
  9. - Apresentam uma performance bem maior que as aplicações Web

    antigas e seu uso é muito mais agradável - O cliente (navegador) se comunica de forma assíncrona com o servidor e muitas vezes o servidor envia dados sem haver uma requisição (push de conteúdo) usando AJAX, WebSockets ou WebRTC - Apresentam um estilo de navegação com poucos links e elementos de navegação tradicionais da Web
  10. Single Page App

  11. None
  12. None
  13. None
  14. REST

  15. GET POST PUT DELETE

  16. EXIBIR POST http://meusistema.com/cliente LISTAR POST http://meusistema.com/listar-cliente ADICIONAR POST http://meusistema.com/adicionar-cliente EDITAR

    POST http://meusistema.com/editar-cliente DELETAR POST http://meusistema.com/deletar-cliente
  17. EXIBIR GET http://meusistema.com/clientes/1 LISTAR GET http://meusistema.com/clientes ADICIONAR POST http://meusistema.com/clientes EDITAR

    PUT http://meusistema.com/clientes/1 DELETAR DELETE http://meusistema.com/clientes/1
  18. None
  19. Cross-domain / CORS Uma abordagem baseada em tokens permite que

    você faça chamadas de AJAX para qualquer servidor, em qualquer domínio. Stateless (Server side scalability) (PERFORMANCE) Não há necessidade de manter registros de sessão, o token é uma entidade que transmite nele mesmo, todas as informações do usuário. O resto do estado vive no lado do cliente. Mobile ready Quando você começar a trabalhar em uma plataforma nativa (iOS, Android, Windows 8, etc.) os cookies dificultam o trabalho de consumir uma API segura. A adoção de uma abordagem baseada em tokens simplifica muito isso.
  20. Flux

  21. Flux é uma idéia para organizar a sua aplicação que

    foi desenvolvida no Facebook, com base em um princípio simples: “Data moves in one direction through your application.”
  22. None
  23. None
  24. Modern Wokflow

  25. None
  26. NPM (Node Package Manager) 172.198 total packages 86.438.044 downloads no

    último dia 470.632.536 downloads na última semana 1.986.474.800 downloads no último mês
  27. 27/05/2015

  28. None
  29. None
  30. None
  31. None
  32. Node Frameworks

  33. None
  34. None
  35. None
  36. Offline

  37. - Application Cache - LocalStorage - SessionStorage - IndexedDB -

    WebSQL - Cookies - Cache Storage Offline
  38. Mobile

  39. Navegadores modernos como Firefox e Chrome são “IDE”

  40. Real-Time WebSockets / HTTP 2 / WebRTC

  41. WebSockets

  42. HTTP 2 – Server-Push

  43. WebRTC Web Real Time Comunications

  44. Dados: Troca de mensagens multimidia, jogos, compartilhamentos de arquivos e

    telas. Vídeo: Vídeo conferência, Reconhecimento facial e de objeto, conferência de várias pessoas (ex Hangout). Audio: Compartilhamento de audio, Telefonia, Reconhecimento de voz. SEM PLUGINS, É NATIVO DO JAVASCRIPT
  45. None
  46. None
  47. Browser as “IDE”

  48. None
  49. None
  50. JavaScript Atual

  51. None
  52. Futuro do JavaScript

  53. None
  54. None
  55. None
  56. None
  57. None
  58. None
  59. Obrigado!