Name: Curso Angular e Storybook: crie componentes compostos em um Design System
Rating: 4.6 (55 reviews)

Matricule-se com desconto especial do Gaules!

crie componentes compostos em um Design System

Quero estudar na alura

10h

Para conclusão

102

Pessoas nesse curso

9.2

Avaliação média

Certificado

De participação

O que você aprenderá_

Crie componentes dinâmicos com a função render e a diretiva ngComponentOutlet
Produza um componente de tipografia com variantes de estilo, peso e tamanho
Construa componentes compostos de botão e modal, lidando com as dependências entre eles
Evolua a documentação do Storybook com renderizações flexíveis, args personalizados e parâmetros
Desenvolva um componente de modal a partir de outros componentes
Elabore stories mais complexos com os decorators do Storybook
Publique componentes complexos e disponibilize-os para uso

Público alvo_

Pessoas desenvolvedoras em Angular que possuem familiaridade com Nx e Storybook e querem ampliar seus conhecimentos em Design System, construindo componentes mais complexos.

Antônio Evaldo

Instrutor e Desenvolvedor de Software nas escolas de Front-end e de Programação da Alura, com foco em JavaScript. Sou técnico em Informática pelo IFPI e cursei Engenharia Elétrica na UFPI. Sou apaixonado por desenvolvimento web e por compartilhar conhecimento de forma encantadora. No tempo livre, assisto séries, filmes e animes.

Curso atualizado em 03/01/2025

Já estuda na Alura?

Comece o curso agora

Ementa

Componente Typography
- Criando a biblioteca e o story do componente de tipografia
- Deixando o componente com conteúdo dinâmico por meio da função render
- Adicionando inputs e argToTemplate ao componente
Componente dinâmico
- Fazendo a renderização dinâmica com ngComponentOutlet
- Mapeando o Input à renderização do componente
- Projetando o conteúdo do componente de tipografia
- Passando inputs ao componente dinâmico
Control, parâmetros e args
- Criando os componentes restantes
- Documentando variantes
- Personalizando o controls com parâmetros
- Usando args personalizados no componente
Componentes compostos e dependências
- Construindo um botão com tipografia
- Configurando o pacote como dependência
- Publicando os pacotes
- Consumindo os pacotes
Componente de Modal
- Criando a biblioteca e o story do modal
- Exibindo o modal
- Desenvolvendo o componente modal
- Utilizando mais componentes no story
Acabamento e consumo do modal
- Emitindo o evento de fechamento do modal
- Documentando o modal
- Consumindo o modal

Descubra se esse curso é pra você! Leia as primeiras aulas

Comece essa formação agora mesmo e capacite-se para seu próximo projeto!

Conheça os planos

Este e mais 3 cursos fazem parte das seguintes formações

Nossas formações são uma sequência de cursos e conteúdo para você se profissionalizar e se tornar quem o mercado procura!

Formação
Angular: construa um Design System com Nx, Monorepo e Storybook

10h
De curso

64
Atividades

Escola

Front-end

Desenvolva experiências web incríveis com HTML, CSS e JavaScript, além de se aprofundar nos principais frameworks do mercado, como React, Angular e Vue.JS. Domine JavaScript a fundo, para não depender de copiar e colar.

Conheça a escola

Cursos relacionados em Angular

curso

Angular e Supabase

otimize a sua aplicação com SSR

Front-end

curso

Angular

transformando uma aplicação web em PWA

Front-end

curso

Angular e Storybook:

O que você aprenderá_