globo.com ComponentSwarm

o problema

no início era difícil reaproveitar componentes...

...então criamos o globotv-ui

depois de um tempo...

depois de um tempo...

o problema

Componente de título de seção

Componente de thumbComponente de botão

globotv-ui base

o problema

Componente de título de seção

Componente de thumbComponente de botão

globotv-ui base

o problema

o problema

Componente de trilho

o problema

javascript

fontes

documentação

css

imagens

imagenscomponente

/* *= require globotv-ui/base *= require globotv-ui/base-responsive *= require globotv-ui/ficha *= require globotv-ui/ficha-responsive *= require globotv-ui/footer *= require globotv-ui/footer-responsive *= require globotv-ui/icon-font *= require globotv-ui/gradient-background *= require globotv-ui/header *= require globotv-ui/header-responsive *= require globotv-ui/grid *= require globotv-ui/grid-responsive *= require globotv-ui/hd *= require globotv-ui/page-title *= require globotv-ui/page-title-responsive *= require globotv-ui/palco-info *= require globotv-ui/palco-info-responsive *= require globotv-ui/pauta *= require globotv-ui/pauta-responsive *= require globotv-ui/popover *= require globotv-ui/section-title *= require globotv-ui/section-title-responsive *= require globotv-ui/thumb *= require globotv-ui/thumb-responsive *= require globotv-ui/track *= require globotv-ui/track-responsive *= require globotv-ui/pagination-buttons *= require globotv-ui/tooltip */

solução

Uma estrutura padronizada

!"" component_1#   !"" css#   #   !"" body.css.scss#   #   !"" header.css.scss#   #   %"" main.css.scss#   !"" docs#   #   %"" index.md#   !"" js#   #   %"" main.js#   %"" manifest.json

{ "css": ["main", "header", "body"], "js": ["main"], "libs": ["jquery"], "dependencies": [ "component_2" ], "docs": { "name": "Component 1", "description": "Lorem ipsum dolor", "category": "Base" }}

E um descritor do componente

sass e coffescript são válidos

/* *= use "globotv-ui/trilho" *= swarm_import */

o que o component swarm faz?

DEMO