Aplicações Web Modernas (2015)

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!