Treinamento jQuery e AngularJS na prática
Objetivo: O treinamento tem como objetivo capacitar o aluno a usar o jQuery e AngularJS de forma profissional e organizada, abrangendo temas como manipulação de objetos DOM, eventos, AJAX, JSON, Controllers, Directives, Dependency Injection, Data Binding, Digest, Watchers, Services e muito mais. Usando exercícios realistas o treinamento ajuda ao aluno a criar um código limpo, organizado, testável e de alta performance para aplicações corporativas, modularizadas e com o conceito SPA (Single Page App). O treinamento ensina de forma gradual e lógica os conceitos do framework jQuery e AngularJS e aplica-os em exercícios claros e práticos.
Consulte nosso calendário de Treinamentos
Carga horária: 32 horas
Pré-requisitos: Conhecimento e experiência intermediária com HTML, CSS e JavaScript.
Metodologia de ensino: Exposição teórica seguida de aplicação de exercícios práticos para fixação do conteúdo.
Conteúdo programático:
- Ambiente de desenvolvimento jQuery e AngularJS
- Preparação do ambiente de trabalho, Chrome Dev Editor, Dev Tool
- Download, instalação e uso através de CDN
- Introdução ao jQuery: manipulação DOM
- Selecionando elementos
- Criando elementos
- Modificando elementos, propriedades e CSS
- Removendo elementos
- Interação com usuário através de eventos
- Capturando eventos de clicks
- Usando eventos de mudança de elementos
- Eventos de teclado
- Evento mouse hover
- Evento customizado
- Carregando e manipulando conteúdo dinâmico
- Usando AJAX e JSON
- Buscar objetos javascript
- Ordenar objetos
- Criar função de pesquisa e autossugestão
- Esperar por uma chamada AJAX
- Efeitos visuais com jQuery
- Básicos Slide, Hide, Show
- Fade, Stop, Toggle
- Criando uma galeria de fotos
- Manipulação de formulários
- Validação básica de formulários
- Validações de números, datas, e-mail
- Implementando validações complexas, cartão de crédito, força da senha, anti-spam
- Interface com usuário
- Manipulação do CSS
- Implementando drag-and-drop, accordion, tabs, pop-up
- Exemplos práticos de interface dinâmica
- Animações na interface com usuário
- Exemplo de formulário animado
- Implementando zoom em imagem
- Menu animado
- Desenvolvimento de Plugin jQuery
- Template de plugin
- Criando plugin tooltip
- Construindo um plugin de conteúdo e imagem
- Criando RSS reader
- Usando a biblioteca jQuery UI
- Criando botões com estilo
- Criando caixas de dialogo
- Usando date picker
- Introdução ao AngularJS e aplicações MVW
- O poder do AngularJS
- Anatomia de uma aplicação AngularJS
- O que é MVW?
- Estruturando nosso código MVC
- Quando e como não usar AngularJS
- Modules, Controllers & Data Binding
- Criando o primeiro Module
- Melhores práticas de programação Modular
- O que são Controllers?
- O papel de um Controller
- O que é Data Binding?
- Two-Way Binding no AngularJS
- Introdução a aplicação de uma página SPA (Single Page Application)
- Entendendo $Scope e seus Eventos
- Desmistificando $Scope
- Herança e prototipação $Scope
- Conceitos avançados $Scope
- Eventos de Broadcasting e Emitting
- Roteamento e várias Views (base para SPA)
- Criando várias Views
- Usando $routeParams no Controller
- Usando ng-template
- Usando API do serviço $location
- Eventos dos serviços $location e $route
- A diretiva ng-include
- Introdução ao Angular UI Router
- AngularJS Services, Factories, and Providers
- Serviços Service, Factory, Provider
- Serviços mais simples Value e Constant
- Usando Decorators para estender serviços de terceiros
- Desenvolvendo um Single Page Application (SPA)
- Desenvolvendo nossa aplicação
- Definindo Rotas
- Criando os Services, Controllers e Templates
- Ponto de entrada (index.html)
- Entendendo formulários AngularJS
- Usando REST API
- Entendendo e usando Promises
- Entendendo o serviço $http
- Entendendo o serviço $resource
- Aplicando $resource no nosso SPA
- Diretivas AngularJS
- O que são diretivas AngularJS?
- Criando diretivas customizadas e suas opções
- Funções Link e Compile
- Ligação entre Scope externo o Scope da diretiva
- Usando ‘@’, ‘=’ e ‘&’ para fazer a ligação de escopos
- Parent Scope vs. Child Scope vs. Isolated Scope
- O que é Transclusion?
- Injeção de dependência no AngularJS
- Os serviços $provide e $injector
- Injetando dependencia dinamicamente
- O registro de Controllers, Filters, e Directives
- AngularJS Filters – manipulando o formato dos dados
- Filtros básicos: number, date, currency, json, uppercase, lowercase.
- Filtros customizados
- Usando vários Filters
- Usando Filters em Controllers, Services, e Directives
- Outros Filters úteis: filter, orderBy, limitTo
- Usando $filter Service
- Enriquecendo a experiência do usuário com AngularJS Animation
- Animação com CSS3 Transitions
- Indo além do básico com: Keyframes, jQuery, ngClass
- Animação com Diretivas customizadas
- Deployment e Internacionalização
- Os passos para um deployment profissional
- Tradução automática com $translateProvider
- Autenticação e autorização no AngularJS
- Adicionando a funcionalidade de Login
- Fazendo o seu Authorization Service usando $http e $cookieStore