SlideShare uma empresa Scribd logo
Storybook com Angular pra
quê?
por Karol Suzuki
Quem sou ?
Graduada em Sistemas de
Informações pela UMC
Dev Front no MJV
Organizadora
Nerdzão/Nerdgilrz
Coordenadora CaquiCoders e
Caqui for Ladies
Incentivadora de mais
mulheres no T.I
Contatos
https://linktr.ee/KarolSuzuki
O que é Storybook?
Uma ferrramenta open source para
desenvolvimento de componentes ui
para desenvolvedores front-end
e o que isso quer
dizer?
Quer dizer que, você vai poder criar
histórias diferentes do seu
componente, documentar e facilitar a
exploração visual deles!
incrível !!!
Então vamos
experimentar?
Vou deixar o link do passo a passo que já
existe em portuguÊs :
https://dev.to/klauskpm/como-criar-uma-biblioteca-de-
componentes-com-angular-e-storybook-420p
vamos as referências!
Storybook :
https://storybook.js.org/docs/guid
es/guide-angular/
comunidade storybook:
https://storybook.js.org/community/
Repositório do exemplo:
https://github.com/suzukikarol/an
gular-storybook
Node:
https://nodejs.org/en/download/
Angular cli:
https://cli.angular.io/
Obrigada pela atenção!

Mais conteúdo relacionado

Semelhante a Storybook com angular pra quê?

Algaworks livro-spring-boot-v3.0
Algaworks livro-spring-boot-v3.0Algaworks livro-spring-boot-v3.0
Algaworks livro-spring-boot-v3.0
MoisesInacio
 
Html5 para estudantes universitários
Html5 para estudantes universitáriosHtml5 para estudantes universitários
Html5 para estudantes universitários
Paullo Norato
 
TDC 2015 Floripa - Testes de Unidade com Robolectric
TDC 2015 Floripa - Testes de Unidade com RobolectricTDC 2015 Floripa - Testes de Unidade com Robolectric
TDC 2015 Floripa - Testes de Unidade com Robolectric
Stefan Teixeira
 
TDC 2015 - Testes de Unidade com Robolectric
TDC 2015 - Testes de Unidade com Robolectric TDC 2015 - Testes de Unidade com Robolectric
TDC 2015 - Testes de Unidade com Robolectric
Lucas Albuquerque
 
Criação e utilização do we.js na comunidade de práticas um relato de experiê...
Criação e utilização do we.js na comunidade de práticas  um relato de experiê...Criação e utilização do we.js na comunidade de práticas  um relato de experiê...
Criação e utilização do we.js na comunidade de práticas um relato de experiê...
Alberto Souza
 
Mobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com RobolectricMobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com Robolectric
Lucas Albuquerque
 
Mobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com RobolectricMobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com Robolectric
Stefan Teixeira
 
SimulaRSO - Simulador de Recursos de Sistemas Operacionais
SimulaRSO - Simulador de Recursos de Sistemas OperacionaisSimulaRSO - Simulador de Recursos de Sistemas Operacionais
SimulaRSO - Simulador de Recursos de Sistemas Operacionais
Caio Ribeiro Pereira
 
School of Net Webinar: ExtJS 4
School of Net Webinar: ExtJS 4School of Net Webinar: ExtJS 4
School of Net Webinar: ExtJS 4
Loiane Groner
 
Introdução JQuery
Introdução JQueryIntrodução JQuery
Introdução JQuery
info_cimol
 
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E JpaDominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Ana Albert
 
2° Codelab - Por onde começar com AngularJS
2° Codelab  - Por onde começar com AngularJS2° Codelab  - Por onde começar com AngularJS
2° Codelab - Por onde começar com AngularJS
GDGFoz
 
Webapp, já posso investir nisso ? Latinoware 2011
Webapp, já posso investir nisso ? Latinoware 2011Webapp, já posso investir nisso ? Latinoware 2011
Webapp, já posso investir nisso ? Latinoware 2011
Bruno Fernandes "PorKaria"
 
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Getúlio Strapazzon
 
iOS libraries
iOS librariesiOS libraries
iOS libraries
Marcelo Quinta
 
Apresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UIApresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UI
Cecília Rosa
 
Pouch db tdc2016
Pouch db tdc2016Pouch db tdc2016
Pouch db tdc2016
Itacir Pompeu
 
Pouch db tdc2016
Pouch db tdc2016Pouch db tdc2016
Pouch db tdc2016
Itacir Pompeu
 
Tecnologias na sala de aula
Tecnologias na sala de aulaTecnologias na sala de aula
Tecnologias na sala de aula
Naira Delazari
 
Componentes Transformers: Combinando o melhor de cada framework
Componentes Transformers: Combinando o melhor de cada frameworkComponentes Transformers: Combinando o melhor de cada framework
Componentes Transformers: Combinando o melhor de cada framework
Flávio Lisboa
 

Semelhante a Storybook com angular pra quê? (20)

Algaworks livro-spring-boot-v3.0
Algaworks livro-spring-boot-v3.0Algaworks livro-spring-boot-v3.0
Algaworks livro-spring-boot-v3.0
 
Html5 para estudantes universitários
Html5 para estudantes universitáriosHtml5 para estudantes universitários
Html5 para estudantes universitários
 
TDC 2015 Floripa - Testes de Unidade com Robolectric
TDC 2015 Floripa - Testes de Unidade com RobolectricTDC 2015 Floripa - Testes de Unidade com Robolectric
TDC 2015 Floripa - Testes de Unidade com Robolectric
 
TDC 2015 - Testes de Unidade com Robolectric
TDC 2015 - Testes de Unidade com Robolectric TDC 2015 - Testes de Unidade com Robolectric
TDC 2015 - Testes de Unidade com Robolectric
 
Criação e utilização do we.js na comunidade de práticas um relato de experiê...
Criação e utilização do we.js na comunidade de práticas  um relato de experiê...Criação e utilização do we.js na comunidade de práticas  um relato de experiê...
Criação e utilização do we.js na comunidade de práticas um relato de experiê...
 
Mobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com RobolectricMobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com Robolectric
 
Mobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com RobolectricMobile Conf 2015 - Testes de Unidade com Robolectric
Mobile Conf 2015 - Testes de Unidade com Robolectric
 
SimulaRSO - Simulador de Recursos de Sistemas Operacionais
SimulaRSO - Simulador de Recursos de Sistemas OperacionaisSimulaRSO - Simulador de Recursos de Sistemas Operacionais
SimulaRSO - Simulador de Recursos de Sistemas Operacionais
 
School of Net Webinar: ExtJS 4
School of Net Webinar: ExtJS 4School of Net Webinar: ExtJS 4
School of Net Webinar: ExtJS 4
 
Introdução JQuery
Introdução JQueryIntrodução JQuery
Introdução JQuery
 
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E JpaDominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
Dominando Jsf E Facelets Utilizando Spring 2.5, Hibernate E Jpa
 
2° Codelab - Por onde começar com AngularJS
2° Codelab  - Por onde começar com AngularJS2° Codelab  - Por onde começar com AngularJS
2° Codelab - Por onde começar com AngularJS
 
Webapp, já posso investir nisso ? Latinoware 2011
Webapp, já posso investir nisso ? Latinoware 2011Webapp, já posso investir nisso ? Latinoware 2011
Webapp, já posso investir nisso ? Latinoware 2011
 
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
Angular5, vue js ou react redux (Trilha de Javascript - TDC 2018 )
 
iOS libraries
iOS librariesiOS libraries
iOS libraries
 
Apresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UIApresentação AngularJS - Angular UI
Apresentação AngularJS - Angular UI
 
Pouch db tdc2016
Pouch db tdc2016Pouch db tdc2016
Pouch db tdc2016
 
Pouch db tdc2016
Pouch db tdc2016Pouch db tdc2016
Pouch db tdc2016
 
Tecnologias na sala de aula
Tecnologias na sala de aulaTecnologias na sala de aula
Tecnologias na sala de aula
 
Componentes Transformers: Combinando o melhor de cada framework
Componentes Transformers: Combinando o melhor de cada frameworkComponentes Transformers: Combinando o melhor de cada framework
Componentes Transformers: Combinando o melhor de cada framework
 

Mais de Karoline Suzuki

Styled Component Pra Quê
Styled Component Pra QuêStyled Component Pra Quê
Styled Component Pra Quê
Karoline Suzuki
 
Comunidade pra quê?
Comunidade pra quê?Comunidade pra quê?
Comunidade pra quê?
Karoline Suzuki
 
Entrei no_ti_e_agora
Entrei no_ti_e_agoraEntrei no_ti_e_agora
Entrei no_ti_e_agora
Karoline Suzuki
 
Css pra quê ?
Css pra quê ?Css pra quê ?
Css pra quê ?
Karoline Suzuki
 
Http pra quê?
Http pra quê?Http pra quê?
Http pra quê?
Karoline Suzuki
 
Pitch Perfeito e Startups Unicórnios
Pitch Perfeito e Startups UnicórniosPitch Perfeito e Startups Unicórnios
Pitch Perfeito e Startups Unicórnios
Karoline Suzuki
 
Comunidade nosso de cada dia
Comunidade nosso de cada diaComunidade nosso de cada dia
Comunidade nosso de cada dia
Karoline Suzuki
 

Mais de Karoline Suzuki (7)

Styled Component Pra Quê
Styled Component Pra QuêStyled Component Pra Quê
Styled Component Pra Quê
 
Comunidade pra quê?
Comunidade pra quê?Comunidade pra quê?
Comunidade pra quê?
 
Entrei no_ti_e_agora
Entrei no_ti_e_agoraEntrei no_ti_e_agora
Entrei no_ti_e_agora
 
Css pra quê ?
Css pra quê ?Css pra quê ?
Css pra quê ?
 
Http pra quê?
Http pra quê?Http pra quê?
Http pra quê?
 
Pitch Perfeito e Startups Unicórnios
Pitch Perfeito e Startups UnicórniosPitch Perfeito e Startups Unicórnios
Pitch Perfeito e Startups Unicórnios
 
Comunidade nosso de cada dia
Comunidade nosso de cada diaComunidade nosso de cada dia
Comunidade nosso de cada dia
 

Último

Logica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptxLogica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptx
Momento da Informática
 
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdfTOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
Momento da Informática
 
DESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdf
DESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdfDESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdf
DESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdf
Momento da Informática
 
ATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docxATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docx
2m Assessoria
 
História da Rádio- 1936-1970 século XIX .2.pptx
História da Rádio- 1936-1970 século XIX   .2.pptxHistória da Rádio- 1936-1970 século XIX   .2.pptx
História da Rádio- 1936-1970 século XIX .2.pptx
TomasSousa7
 
Certificado Jornada Python Da Hashtag.pdf
Certificado Jornada Python Da Hashtag.pdfCertificado Jornada Python Da Hashtag.pdf
Certificado Jornada Python Da Hashtag.pdf
joaovmp3
 
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdfEscola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Gabriel de Mattos Faustino
 
Segurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas PráticasSegurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas Práticas
Danilo Pinotti
 
Manual-de-Credenciamento ANATER 2023.pdf
Manual-de-Credenciamento ANATER 2023.pdfManual-de-Credenciamento ANATER 2023.pdf
Manual-de-Credenciamento ANATER 2023.pdf
WELITONNOGUEIRA3
 
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
Faga1939
 

Último (10)

Logica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptxLogica de Progamacao - Aula (1) (1).pptx
Logica de Progamacao - Aula (1) (1).pptx
 
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdfTOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
TOO - TÉCNICAS DE ORIENTAÇÃO A OBJETOS aula 1.pdf
 
DESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdf
DESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdfDESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdf
DESENVOLVIMENTO DE SOFTWARE I_aula1-2.pdf
 
ATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docxATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docx
ATIVIDADE 1 - ADSIS - ESTRUTURA DE DADOS II - 52_2024.docx
 
História da Rádio- 1936-1970 século XIX .2.pptx
História da Rádio- 1936-1970 século XIX   .2.pptxHistória da Rádio- 1936-1970 século XIX   .2.pptx
História da Rádio- 1936-1970 século XIX .2.pptx
 
Certificado Jornada Python Da Hashtag.pdf
Certificado Jornada Python Da Hashtag.pdfCertificado Jornada Python Da Hashtag.pdf
Certificado Jornada Python Da Hashtag.pdf
 
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdfEscola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
Escola Virtual - Fundação Bradesco - ITIL - Gabriel Faustino.pdf
 
Segurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas PráticasSegurança Digital Pessoal e Boas Práticas
Segurança Digital Pessoal e Boas Práticas
 
Manual-de-Credenciamento ANATER 2023.pdf
Manual-de-Credenciamento ANATER 2023.pdfManual-de-Credenciamento ANATER 2023.pdf
Manual-de-Credenciamento ANATER 2023.pdf
 
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
PRODUÇÃO E CONSUMO DE ENERGIA DA PRÉ-HISTÓRIA À ERA CONTEMPORÂNEA E SUA EVOLU...
 

Storybook com angular pra quê?