ExtJS Jumpstart Parte 2
-
Upload
daniel-da-cunha-bueno -
Category
Internet
-
view
151 -
download
1
description
Transcript of ExtJS Jumpstart Parte 2
Ext JS
Jumpstart
Por Daniel da Cunha Bueno / 2014
Seja bem vindo(a)!Somos um grupo voluntário e
independente de desenvolvedores de software, com o intuito de disseminar
conhecimento e fortalecer a comunidade local
DevRioClaro [email protected]
Software não é feito por
máquinas,mas por
pessoas!
www.novatec.com.br
2 e-Books para sorteio no dia do evento!15% desconto - “DevRioClaro_16AGO ”
(válido até 01/11/2014)
www.casadocodigo.com.br
Desconto de 40% livro impresso e 10% eBook - “V00031”(válido até [while true])
www.lcm.com.br
Sobre Mim
{nome: ‘Daniel da Cunha Bueno’,idade: 31,email: ‘[email protected]’,entusiastaWebDesktopApps: true,
github: https://github.com/danielcbueno}
ExtJS – Jumpstar parte 2
» Lembrando a todos que essa é uma apresentação em continuação a apresentação feita no dia 19/07/2014.
» Interessados podem ver a apresentação no slideshare que esta dentro do grupo DevRioClaro no facebook.
» Se alguém ficar com a dúvida, por favor, me mande mande e-mail, ou entre em contato pelo facebook.
Mas o que é SenchaCMD?
» É um utilitário de comando de linha que permite várias operações dentro do ambiente de desenvolvimento sencha.
» Serve tanto para aplicações desenvolvida em ExtJS e Sencha Touch.
» Auxilia na organização dos fontes a serem gerados pela aplicação.
» Gera temas para a sua aplicação.
Instalação – Pré-requisitos
» Pré-requisitos (Ambiente Windows): ˃ Java˃ Ruby (versão 1.9.2)˃ Download do ExtJS ou SenchaTouch.˃ SenchaCmd através do site www.sencha.com
ou procure por “SenchaCmd Download” no google.
Rodando SenchaCmd
» Para rodar o SenchaCmd, basta digitar o commando “sencha” no prompt do DOS (Powershell / Terminal) você verá o resultado.
Antes de começar?
» Bem, agora que rodamos e descobrimos que o SenchaCMD oferece diversas opções de execução, uma das mais importantes a serem consideradas é a opção sencha help.
» Exemplos: ˃ sencha help generate˃ sencha help generate workspace˃ Sencha help generate app
Por onde começar?
» Como vimos no help, o comando oferece uma série opções, mas no caso da apresentação anterior, vamos começar com a geração de um workspace.
O que é um workspace ?
» Workspace, como o próprio nome diz é um espaço de trabalho.
» Auxilia para que o seu fonte não seja desorganizado.
» Cria todas as estruturas de diretório de acordo com o padrão de trabalho de aplicações ExtJS.
Como criar um workspace.
» sencha generate workspace --path c:\DevRioClaroWorkspace
» Ele irá criar o diretório pronto para hospedar as suas aplicações e seus packages.
O que são packages ?
» Packages são como uma biblioteca que você pode colocar o seu código isolado da aplicação.
» Podem organizar a regra de negócio de estrutura de componentes a ser utilizada pelas aplicações.
Antes de criar uma package
» Para comandos que funcionam com geração de packages e ou aplicações, é muito importante atentar para o diretório do SDK.
» No meu exemplo eu deixarei tudo no diretório D:\ExtJS\Frameworks a título de demonstração.
» Porque a geração de uma package ou de aplicação você vai precisar de um SDK já disponível na sua máquina.
» Existem duas maneiras de você utilizar o diretório de SDK, ou você vai até através do prompt ou vou utiliza o argumento --sdk.
Criando uma package
» sencha generate package˃ --name [Nome do Package]
˃ Exemplo:˃ Sencha generate package –name Calc˃ Esse comando deverá ser executado na raiz da workspace.
Criando um aplicação
» sencha generate app˃ --name [Nome da application]˃ --Path
˃ Exemplo:˃ Sencha generate app –name Demo01˃ Esse comando deverá ser executado na raiz do SDK ou utilizar o
parâmetro --sdk.
Outras opções
» Sencha web ˃ Servidor Web embutido para testar aplicações de maneira rápida.˃ sencha web --port 1234 [start|stop]
» Sencha generate theme˃ Gera temas para sua aplicação
» Sencha repositório˃ sencha repository init --name DevRioClaro --email
» Sencha generate theme˃ sencha generate theme --name Tema1˃ No diretório da aplicação.(Ele vai usar o tema da aplicação para gerar
um novo tema.)
Mais opções
» Sencha app build˃ Compila a aplicação.
» Sencha app refresh˃ Atualiza as referência do projeto.
» Sencha ant clean˃ Limpa o diretório de build.
JSDuck
» Uma ferramenta que auxilia na documentação de códigos fontes e de aplicação criada pela sencha labs.
» Gera a documentção similar a própria documentação do Ext 4.2.1.
» Fácil de usar.» O seu fonte tem que ser todo salvo em UTF-8
with boom.
Demo do JSDuck
Dúvidas ?
Links
» http://www.sencha.com» http://extjs.eu/ext-examples/
Obrigado!