CoatingCLI

Coating

Customizing your CLI

Documentação https://github.com/devjefferson/coating.git

Comando para Instalar

>npm install -g coatingcli

>yarn add global coatingcli

Componentes :

Componentes Simples

Chamada de componente Simples.

>coating componente Exemple

Criando uma pasta src/component/. com 2 arquivos sendo index.js e styles.js

Index.js

import React from 'react';

import { Container } from './styles';

export default function Exemple(){
  return (
    <Container>

    </Container>
  );
}

O arquivo index.js contém todo o codigo do componentes:

React Styles.js

import styled from 'styled-components';

export const Container = styled.div`
  
`;

React-Native Styles.js

import styled from 'styled-components/native';

export const Container = styled.View`
  
`;

O arquivo styles.js contém todo o codigo de estilo dependendo dos modulos instalado React ou React-native:

Componentes com Graphql Ultilizado com Gatsby

Chamada de componente com Graphql.

>coating componente:graphql Exemple

Criando uma pasta src/component/. com 2 arquivos sendo index.js e styles.js

Index.js

import React from 'react';
import { useStaticQuery, graphql } from "gatsby"
import { Container } from './styles';

export default function <%= props.name %>(){
  const data = useStaticQuery(graphql`
  {
    
  }
  `)
  return (
    <Container>

    </Container>
  );
}

O arquivo index.js contém todo o codigo do componentes:

React Styles.js

import styled from 'styled-components';

export const Container = styled.div`
  
`;

O arquivo styles.js contém todo o codigo de estilo styled-component e React:

Pagina :

Pagina Simples

Chamada de Pagina Simples.

>coating pagina Exemple

Criando uma pasta src/pages/. com 2 arquivos sendo index.js e styles.js

Index.js

import React from 'react';

import { Container } from './styles';

export default function Exemple(){
  return (
    <Container>

    </Container>
  );
}

O arquivo index.js contém todo o codigo do componentes:

React Styles.js

import styled from 'styled-components';

export const Container = styled.div`
  
`;

React-Native Styles.js

import styled from 'styled-components/native';

export const Container = styled.View`
  
`;

O arquivo styles.js contém todo o codigo de estilo dependendo dos modulos instalado React ou React-native:

Pagina com Graphql Ultilizado com Gatsby

Chamada de pagina com Graphql.

>coating pagina:graphql Exemple

Criando uma pasta src/component/. com 2 arquivos sendo index.js e styles.js

Index.js

import React from 'react';
import { useStaticQuery, graphql } from "gatsby"
import { Container } from './styles';

export default function <%= props.name %>(){
  const data = useStaticQuery(graphql`
  {
    
  }
  `)
  return (
    <Container>

    </Container>
  );
}

O arquivo index.js contém todo o codigo da pagina:

React Styles.js

import styled from 'styled-components';

export const Container = styled.div`
  
`;

O arquivo styles.js contém todo o codigo de estilo styled-component e React:

License

MIT - see LICENSE