Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (13)
Semelhante a Introdução ao AngularJS - Framework para desenvolvimento de aplicações web
Semelhante a Introdução ao AngularJS - Framework para desenvolvimento de aplicações web (20)
Introdução ao AngularJS - Framework para desenvolvimento de aplicações web
- 2. Olá! Eu sou Márcio Lucas Técnico em Informática e formando em Tecnologia em Sistemas para Internet. Você pode me encontrar nas redes sociais: @marciioluucas 2
- 4. 1. Pra que? É de comer? De passar no cabelo?
- 5. 5 AngularJS é um framework SPA (Single Page Applications), isto significa que você pode criar aplicações web (webapps) com ele. Fazer páginas que funcionam sem precisar de reload e que se comporte verdadeiramente como uma aplicação.
- 6. 6 Alguns pequenos motivos para aprender AngularJS Produtividade O AngularJS foi pensando para que o desenvolvedor possa escrever o mínimo de código possível, assim desenvolver uma aplicação com ele requer bem menos código do que usando jQuery, por exemplo. Facilidade no entendimento O AngularJS é extremamente declarativo, sendo muito fácil entender o funcionamento das aplicações lendo apenas o HTML. Curva de aprendizado Consegue-se capacitar os profissionais em no máximo 3 dias dada a facilidade e intuitividade do desenvolvimento com AngularJS.
- 7. 2. Frameworks Antes de mais nada, o que são?
- 8. “ Um framework em desenvolvimento de software, é uma abstração que une códigos comuns entre vários projetos de software provendo uma funcionalidade genérica. 8
- 9. Algumas frameworks conhecidas ○ Bootstrap ○ Laravel ○ Materialize Citei essas, mas existem “muuuuitas” outras. 9
- 10. 10 URL APRESENTAÇÃO BOOTSTRAP & MATERIALIZE https://goo.gl/qWTF8k
- 11. 3. História A humanidade é feita dela, porque não contar a do AngularJS?
- 12. 12 AngularJS foi originalmente desenvolvido em 2009 por Miško Hevery e Adam Abrons como um software por trás de um serviço de armazenamento JSON online.
- 13. 13 Mas eles viram que não iam lucrar muito com isso, aí decidiram fazer uma coisa meio arriscada.
- 15. 15 Disponibilizar o Angular gratuitamente (open- source) como uma framework.
- 16. 3. Sintaxe Como eu escrevo um código para o AngularJS?
- 17. Três passos para criar a aplicação. ○ Importar os arquivos necessários na sua index.html ○ Abrir uma tag Script no final da página, mas antes de terminar a tag <body> ○ CODIFICAR! 17
- 18. 18
- 20. “ 20 A propriedade ng-app
- 21. “ Ela serve para apontar ao Angular onde vai ser nosso escopo, ou seja. Onde ele vai ter que processar os códigos e renderizar o que for preciso no template. 21
- 22. “ Dentro do Escopo (ng-app) 22 Resultado: 1 + 2 = 3
- 23. “ Fora do Escopo (ng-app) 23 Resultado: 1 + 2 = {{1+2}}
- 24. “ Tudo que é declarado fora do escopo, não é processado pelo AngularJS 24
- 26. “ Quando querer renderizar algo dinâmico no template (dentro do html) utilizamos duas chaves {{aqui é dinâmico}} 26
- 27. Mãos a obra! 27 Proposta: ○ Criar um app de lista telefônica. ◦ Adicione um contato ◦ Apague contatos
- 28. 28 O que é necessário saber...
- 29. 29 ng-repeat
- 30. 30 Ele é basicamente um foreach que passa por todos as posições de um array retornando seus respectivos valores.
- 31. 31 ng-model
- 32. 32 Serve para “linkar” o template ao controller, ou seja. O valor que está no controller vai estar também no template.
- 33. 33 Chamamos isso de data-binding
- 34. Obrigado! Dúvidas? Você pode me encontrar no Github e no Facebook: /marciioluucas. 34