cwco

CWCO

Biblioteca de componentes da Web contextfull criada para melhorar a experiência do usuário da APIs de componentes nativos da Web com:

• ✅ Não é necessário construção (plug and play)!
• ✅ Trabalha com outras bibliotecas e estruturas como React, Angular, Vue, Sieve, etc;
• ✅ Modelo verdadeiramente reativo
• ✅ Diretivas incorporadas poderosas (incluindo a capacidade de criar o seu próprio)
• ✅ Manipulação de dados de contexto interno
• ✅ Evento e ligação de dados em HTML e CSS
• ✅ Construa a visualização diretamente no arquivo HTML
• ✅ API simples
• ✅ Renderização rápida
• ✅ Pacote leve

Documentação (cwco.beforesemicolon.com)

• Começando
• WebComponent
• ContextProviderComponent
• Configurações
• Modelo
• Estilo
• Eventos
• Atributos
• Propriedades
• Contexto
• Diretivas
• Diretivas personalizadas
• LiveCycles
• Manuseio de erros

Instalar

Este módulo também pode ser usado diretamente no navegador no ambiente do nó. Você pode até usá -lo junto com outras bibliotecas e estruturas da Web, como React e Angular .

Navegador

 <!-- use the latest version -->
< script src =" https://unpkg.com/cwco/dist/cwco.min.js " > </ script >

<!-- use a specific version -->
< script src =" https://unpkg.com/[email protected]/dist/cwco.min.js " > </ script >

<!-- link your app script after -->
< script src =" app.js " > </ script > 

Nodejs

 npm install cwco

Você pode importar a classe dos construtores de acordo com o que está construindo.

 const { WebComponent , ContextProviderComponent , Directive } = require ( 'cwco' ) ;

Editores de código e IDEs

A CWCO é apenas HTML e, se você deseja destaque da sintaxe para o VSCODE, pode usar o Inline-Html

Vscode

Para destaque da sintaxe de HTML e CSS nos plugins JavaScript, use inline-html ou lit-html.

Você pode importar html da cwco que é apenas uma ajuda para o VSCode, que não faz nada de especial para a sequência HTML com a qual você a usa.

 import { html , css , WebComponent } from "./cwco" ;

class MyButton extends WebComponent {
  get template ( ) {
    return html `<button><slot></slot></button>`
  }
  
  get stylesheet ( ) {
    return css `<style>button {color: #222}</style>`
    // or 
    // return css`button {color: #222}`
  }
} 

Jet Brain Ides

Esses IDEs têm destaque em HTML-in-Javascript, que pode ser útil ao desenvolver componentes da Web da CWCO.

Quer ajudar?

Saiba como