curso de

Angular: Avançando no design de componentes com acessibilidade

Estudando este mês:

e mais 121 alunos(as)

Resumo do curso

  • Crie uma API modal do zero
  • Aplique regras de acessibilidade da WCAG
  • Aprenda a criar componentes dinamicamente
  • Descubra como o Angular funciona por debaixo dos panos
  • Avance no uso de diretivas
  • Crie animações com auxílio do módulo Animations

Público alvo

Desenvolvedores e desenvolvedoras Angular experientes e preocupados com a acessibilidade da sua aplicação.

Conteúdo relacionado

Cursos de Angular em Front-end

Leia nossos artigos de Front-end

Última atualização

21/10/2020

Já é aluno?

Comece o curso agora

10h

p/ conclusão

68

Atividades

186

Minutos de video

517

Alunos nesse curso

9.3

Nota deste curso

Certificado de participação

Um pouco mais do conteúdo

Descubra se esse curso é pra você lendo as primeiras aulas de Angular: Avançando no design de componentes com acessibilidade

Formação com esse curso

Instrutores

  • Flávio é desenvolvedor e instrutor, focado no desenvolvimento com Angular e procurando conciliar o frontend com o backend. Palestrou em conferências como QCON e MobileConf. É autor do best-seller "Cangaceiro JavaScript". Além da sua graduação e MBA em TI, também é graduado em Psicologia, aplicando os aprendizados desta área no desenvolvimento de software e de aplicações web.

Conteúdo Detalhado

  1. Definição de uma API

    • Visão geral da API Modal
    • Sobre uma API minimalista
    • Definindo a interface da nossa API
    • Injeção de ng-template
  2. Componente Modal

    • Minimizando as dependências do componente
    • Modal Component
    • ngTemplateOutlet
    • ComponentFactoryResolver
    • ComponentRef vs ModalRef
    • Um pouco sobre z-index e stacking order
    • O serviço BodyInjector
    • Sobre ApplicationRef
    • AttachView
    • Hostview
    • Sobre EmbeddedViewRef
  3. Lapidando nosso Componente

    • Estilizando o componente
    • Angular e o velho problema com animações
    • Introdução ao módulo Animations
    • FadeIn
    • As funções trigger, transition e style
    • FadeOut
    • Bônus: Animações com ngIf
    • Marcando um template para animação
    • Fechando o modal ao clicar no overlay
    • Parando a propagação de eventos
  4. Acessibilidade

    • A diretiva FocusTrap
    • HostListener
    • Finalizando FocusTrap
    • Atalho para fechamento do modal
    • A diretiva FocusBack
    • document.activeElement
  5. Avançando na acessibilidade

    • Suportando Screen Readers
    • Reactive Forms
    • Lidando com botões desabilitados
    • disabled vs aria-disabled
    • Acessibilidade e validação
    • O atributo aria-invalid
    • Diferenças entre screen readers

Ainda não estuda com a gente?

Invista na transformação da sua carreira!

Comece agora

nossos alunos e alunas

Experiências de quem já mergulhou com a gente.

Flavio é foda, cara totalmente fora da curva... Nao importa por qual lado eu olhe, o curso foi muito bom.

Angular: Avançando no design de componentes com acessibilidade

LUIZ FELIPE

Mais um curso excelente. Neste curso foi feita introdução de animações com Angular. Eu faria com certeza um curso específico de animações indo do básico ao avançado.

Angular: Avançando no design de componentes com acessibilidade

PAULO ROBERTO KUN

Além da profundidade do conteúdo apresentado, a didática do Professor Flávio e fantástica. Conhecimento profundo e prático do Angular e também dos princípios e dos contornos para tornar um componente Acessível é domínio e praia do Professor Flávio. Parabéns Professor Flávio, Parabéns a ALURA por está criando uma cultura de desenvolvimento acessível. Incentivo fortemente ao Professor Flávio e a ALURA a darem continuidade com novos módulos desse assunto pois muitas questões de Acessibilidade precisam ser exploradas e apresentadas. Aguardo ansiosamente por estes novos módulos em breve.

Angular: Avançando no design de componentes com acessibilidade

Antulio de Oliveira

Aprenda Angular com esse e outros cursos, comece agora!

Plus

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$85
à vista R$1.020
Matricule-se

Pro

  • Acesso a TODOS os cursos da plataforma

    Mais de 1200 cursos completamente atualizados, com novos lançamentos todas as semanas, em Programação, Front-end, UX & Design, Data Science, Mobile, DevOps e Inovação & Gestão.

  • Alura Challenges

    Desafios temáticos para você turbinar seu portfólio. Você aprende na prática, com exercícios e projetos que simulam o dia a dia profissional.

  • Alura Cases

    Webséries exclusivas com discussões avançadas sobre arquitetura de sistemas com profissionais de grandes corporações e startups.

  • Certificado

    Emitimos certificados para atestar que você finalizou nossos cursos e formações.

  • Alura Língua (incluindo curso Inglês para Devs)

    Estude a língua inglesa com um curso 100% focado em tecnologia e expanda seus horizontes profissionais.

12X
R$120
à vista R$1.440
Matricule-se
Conheça os Planos para Empresas

Acesso completo
durante 1 ano

Estude 24h/dia
onde e quando quiser

Novos cursos
todas as semanas