Web Components, A próxima revolução do desenvolvimento web.

Web Components, A próxima revolução do desenvolvimento web.

Nesta palestra é abordado conceitos envolvendo Web Components e exemplos práticos. Nela é avaliado todo o poder que este novo padrão trás consigo e também tópicos relacionados a como utilizá-la desde já de forma funcional, cross-browser e multi-plataforma. Sem dúvidas, depois desta apresentação você ficará fascinado por este novo mundo que está surgindo e que não está tão distante da realidade dos desenvolveres atuais.

Fff7258836f20ea66b061b49a51fe8dd?s=128

Beto Muniz

August 30, 2014
Tweet

Transcript

  1. None
  2. Beto Muniz @obetomuniz

  3. minasdev.org

  4. webcomponents.org

  5. None
  6. None
  7. Web Components A revolução do desenvolvimento web

  8. O que é?

  9. “Web Components é um padrão guarda-chuva que engloba outros padrões.”

    - Eu.
  10. None
  11. Componentizar a Web?

  12. OLD!

  13. None
  14. None
  15. None
  16. Mas espera aí! Mágico?! Vamos esquecer os elementos HTML e

    aprender novos?!
  17. None
  18. None
  19. Custom Elements Cria novos elementos. Extende elementos existentes.

  20. None
  21. Template Pedaço reutilizável e inerte de DOM, ativado apenas por

    Javascript.
  22. None
  23. None
  24. Shadow DOM Encapsulamento do DOM, Comportamento e Estilos

  25. None
  26. None
  27. HTML Imports Empacotamento. Distribuição. Compartilhamento. Reutilização.

  28. <iframe> AJAX ou

  29. None
  30. None
  31. None
  32. None
  33. Quer dizer...quais browser posso trabalhar com isso? E o ?

  34. Quer dizer...quais browser posso trabalhar com isso?

  35. jonrimmer.github.io/are-we-componentized-yet

  36. Então não posso colocar em produção!

  37. bosonic.github.io

  38. x-tags.org

  39. polymer-project.org

  40. None
  41. None
  42. None
  43. None
  44. None
  45. O Material Design

  46. None
  47. #mitos

  48. Componentizar é algo novo!

  49. None
  50. None
  51. Web Components não está pronto para ser colocado em produção

  52. None
  53. None
  54. None
  55. None
  56. None
  57. None
  58. None
  59. SEO e Acessibilidade, vish!

  60. None
  61. None
  62. O Angular/Ember atende tudo que esses padrões pregam.

  63. Não é Interoperável

  64. None
  65. E onde estudar?

  66. webcomponents.org

  67. customelements.io

  68. polymer-project.org

  69. None
  70. O futuro da web já foi inventado, basta começarmos a

    utilizá-lo.
  71. DÚVIDAS?