A árvore de arquivos exibe hierarquicamente os arquivos e diretórios existentes no seu projeto, detalharemos aqui os principais arquivos e diretórios.

Atalhos da árvore de arquivos

A árvore de arquivos possui atalhos na parte superior que agilizam a navegação entre os diretórios do seu projeto. A quantidade de atalhos varia com o tipo de projeto aberto, por exemplo, quando um projeto for somente web, os atalhos (5) e (6) da figura 1.1 não serão exibidos, pois se tratam de diretórios de projeto mobile.

Figura 1.1 - Atalhos da árvore de arquivos


  1. Ir para código fonte Servidor: expande o diretório Código Fonte Servidor (Java).
  2. Ir para pasta relatórios: expande o diretório Relatórios (reports). Esse atalho criará esse diretório caso não exista.
  3. Ir para blocos do tipo servidor: expande o diretório Bloco de Programação (blockly) do lado servidor. Esse atalho criará esse diretório caso não exista.
  4. Ir para pasta de diagrama: expande a pasta Diagrama de Dados (diagram) que contém o(s) diagrama(s) do projeto.
  5. Ir para pasta mobile: conduzirá para a pasta views do projeto mobile.
  6. Ir para blocos do tipo mobile: expande o diretório Bloco de Programação (blockly) do projeto mobile. Esse atalho criará esse diretório caso não exista.
  7. Ir para pasta de views: expande para a pasta Autenticados (logged), dentro do diretório Formulários (views) do projeto web.
  8. Ir para blocos tipo cliente: expande para o diretório Bloco de Programação (blockly) do projeto web. Esse atalho criará esse diretório caso não exista.
  9. Visualização da árvore (Figura 1.2)
    • Visualização de pasta: exibe os diretórios e arquivos com seus nomes originais.

    • Visualização de categoria: exibe alguns diretórios e arquivos com nomes mais amigáveis.

  10. Diretório do projeto: pasta raiz do projeto.


Figura 1.2 - Visualização da árvore

Árvore de arquivos 

A árvore de arquivos exibe todos os diretórios e arquivos existentes do projeto, ordenados de forma hierárquica. O ponto inicial dessa árvore, a raiz, é intitulado com o nome do projeto, definido durante a criação. Possui quatro pastas e quatro arquivos que estão diretamente abaixo da pasta raiz (Figura 2).



Figura 2 - Divisão da Árvore de Arquivos


Os subdiretórios e arquivos da raiz do projeto:

  • Códigos Fonte (main): dependendo de como foi criado o projeto, esse diretório possuirá subdiretórios:
    • Códigos Fonte Servidor: armazena a camada DAO, Entity, código Java, arquivo de configuração do projeto, relatórios e outros;
    • Códigos Fonte mobile: armazena os formulários html que gerarão as telas dos aplicativos, código JavaScript, plugins, css, Splash e outros;
    • Códigos Fonte web: armazena os formulários html, código JavaScript, plugins, css e outros;
  • Configurações (config): contém as funcionalidades de Configurações do projeto (app.config) e banco de dados (context.xml).
  • Diagrama de Dados (diagram): contém os arquivos de diagrama de classe do projeto.
  • Documentação (docs): arquivos de documentação do projeto, nele você poderá criar diagramas UML, fluxogramas, diversos recursos para ajudar no desenvolvimento do projeto.
  • .gitignore: nesse arquivo estão descritos os arquivos que serão ignorados na hora de fazer o commit / push para o git.
  • Definições Maven (pom.xml): ferramenta que gerencia os plugins e bibliotecas Maven do projeto.
  • README.md: arquivo de texto que apresenta um pequeno tutorial de importar projeto GIT. O conteúdo é exibido na tela inicial do seu projeto na página git.
  • template.properties: propriedades do template utilizado pelo projeto.

Códigos fonte servidor

Dentro do diretório Códigos Fonte Servidor estão contidas pastas com arquivos de configurações, entidade, segurança, internacionalização e mais.

Figura 3 - Árvore de arquivos de código fonte servidor


Os subdiretórios e arquivos da pasta Código Fonte Servidor:

  • app: o diretório principal dos código-fonte do aplicativo:
    • dao: diretório de arquivos referentes a comunicação da aplicação com o servidor;
    • entity: diretório de arquivos referentes as entidades da aplicação;
    • AppConfiguration.java: arquivo de configurações iniciais do projeto java.
    • populate.json: arquivo que contém os dados para popular o banco no momento que o , por padrão o usuário administrador já vem configurado. 
  • auth: diretório com os arquivos de autenticação do projeto:
    • permission: subdiretório.
      • SecurityPermission.java: arquivo responsável pela segurança do projeto, armazena os grupos de acesso e as permissões para esses grupos. A funcionalidade Permissão de Segurança é responsável por manipular essa classe de forma low-code.

  • Bloco de programação: diretório onde contém as funções de blocos de programação do projeto. Por padrão esse diretório não é criado junto com o projeto, para o faze-lo basta clicar em seu ícone na barra de atalhos da arvore de arquivos (item 3 da Figura 1.1).

  • i18n: diretório de arquivos referentes às propriedades de internacionalização no lado Servidor do projeto.
  • META-INF: diretório relacionados a arquivos JAR para configurar aplicações, extensões, carregadores de classes e serviços.
  • Relatórios: diretório que armazena os relatórios criados no projeto.  Por default essa pasta não é criada, para o faze-lo, basta clicar em seu ícone na barra de atalhos da arvore de arquivos.
  • SpringBootMain.java: classe que inicia o contexto de aplicação do SpringBoot.

Códigos fonte mobile

Arquivos responsáveis por gerar a aplicação mobile (Android e iOS).


Figura 4 - Árvore de arquivos código fonte mobile


  • certs: Certificate Enrollment Requests, diretório que contém certificados que foram requisitados e estão com status pendentes ou já foram rejeitados. 
  • hooks: representa o diretório de scripts especiais que podem ser adicionados ao sistema para customizar comandos Cordova, que é uma estrutura apache de desenvolvimento de aplicativos moveis. 
  • res: pasta criada por default para uso de recursos na aplicação:
    • icon: ícones disponíveis para serem utilizados na aplicação.
    • screen: telas disponíveis para serem utilizadas na aplicação.
  • www: o conteúdo desse diretório está descrito no próximo tópico.
  • .gitignore: arquivo onde são descritos os arquivos que serão ignorados na hora de fazer o commit / push para o git.
  • config.xml: arquivo de configuração global que controle aspectos de uma aplicação Cordova.
  • package.json: responsável por descrever o projeto, informar as engines (versão do node e do npm), url do repositório, versão do projeto entre outros coisas.


Diretório www no mobile

Diretório que armazena a estrutura da aplicação mobile, como telas, imagens, os blocos de programação que geram código fonte JavaScript, internacionalização e mais.

Alguns arquivos foram ocultados na figura abaixo.


Figura 5 - diretório www expandido


  • bowerscript: arquivo referente ao Bower, uma ferramenta que ajuda no gerenciamento das dependências do front-end.
  • css: local onde ficam armazenadas as estilizações feitas em low-code na janela de edição visual.
  • i18n: diretório onde ficam os arquivos de internacionalização da aplicação mobile,
  • img: local usado para armazenar imagens usadas na aplicação.
  • js: diretório de arquivos JavaScript e blockly do lado cliente mobile. 
    • bloco de programação (blockly): diretório onde ficam as funções de bloco de programação, possui um subdiretório com funções usadas durante a autenticação. Por padrão esse diretório não é criado junto com o projeto, para o faze-lo basta clicar em seu ícone na barra de atalhos da arvore de arquivos (item 6 da Figura 1.1).
  • plugins: local onde ficam armazenadas diversas bibliotecas usadas no projeto. Durante as atualizações do Cronapp, o conteúdo dessa pasta é alterado ou substituído, por isso não recomendamos atualizar ou adicionar nada manualmente.
  • view: diretório que organiza as telas do aplicativo mobile:
    • error: telas de erro do sistema, os usuários serão encaminhados para essas telas quando ocorrer um erro no sistema;
    • logged: contém as páginas com permissão de acesso apenas para os logados no sistema;
    • public: páginas sem restrição de acesso.
    • login.view.html: por padrão é a primeira página exibida para o usuário. Acesse Alterar tela inicial, caso queira mudar a tela inicial.
  • index.html: contém as referências de plugins e css usados nas telas do sistema.

Códigos fonte web

Diretório armazena a estrutura do sistema web, como as páginas, os blocos de programação que geram código fonte JavaScript, internacionalização e mais.


Figura 6 - Árvore de arquivos fonte do projeto web


  • Bowerscripts: arquivo referente ao Bower, uma ferramenta que ajuda no gerenciamento das dependências do front-end.
  • css: local onde ficam armazenadas as estilizações feitas em low-code na janela de edição visual.
  • i18n: diretório onde ficam os arquivos de internacionalização do sistema web.
  • js: diretório de arquivos JavaScript e blockly do lado cliente web. 
    • bloco de programação (blockly): diretório onde ficam as funções de bloco de programação. Por padrão esse diretório não é criado junto com o projeto, para o faze-lo basta clicar em seu ícone na barra de atalhos da arvore de arquivos (item 8 da Figura 1.1).
  • plugins: local onde ficam armazenadas diversas bibliotecas usadas no projeto. Durante as atualizações do Cronapp, o conteúdo dessa pasta é alterado ou substituído, por isso não recomendamos atualizar ou adicionar nada manualmente.
  • formulários (views): diretório onde ficam as páginas web:
    • administrativo (admin): contém as páginas com permissão de acesso apenas para os usuários com perfil de administrador do sistema;
    • erros (error): páginas de erro do sistema, os usuários serão encaminhados para essas páginas quando ocorrer um erro no sistema;
    • autenticado (logged): contém as páginas com permissão de acesso apenas para os logados no sistema;
    • Público (public): páginas sem restrição de acesso.
  • .bowerrc: pacote de gerenciamento dos componentes web, bibliotecas, frameworks.
  • bower.json: arquivo de gerenciamento das dependências do json do projeto.
  • Index.html: contém as referências de plugins e css usados nas páginas do sistema.

Menu de contexto da árvore de arquivos

Existem algumas ações que podem ser feitas ao clicar com o botão direito dou mouse na raiz do projeto (nome do projeto). O conteúdo exibido no menu de contexto varia com o tipo de projeto: servidor, mobile e web.


Figura 7 - Ações na árvore de arquivos


  • Importar: importa um projeto Cronapp em formato zip ou obtém serviços de uma estrutura SOAP.
  • Exportar: exporta o projeto em um dos seguintes formatos: GIT/SVN, War ou Zip.
  • Banco de dados: abre a funcionalidade de configuração do banco de dados do projeto.
  • Recompilar projeto: compila novamente o projeto.
  • Recompilar e reabrir projeto: o projeto será recompilado, fechado e reaberto.
  • Recarregar: recarrega novamente a árvore de arquivos.
  • Baixar: faz o download do conteúdo selecionado, no caso de diretórios o mesmo é compactado em formato .zip.
  • Compartilhar Pasta: abre uma janela que disponibiliza um link que permite que o usuário faça o download dessa pasta. Também é possível enviar esse link por e-mail. Para saber mais sobre essa funcionalidade, clique aqui.
  • Abrir terminal: abre o diretório selecionado em um terminal linux.
  • Arquivar projeto: arquiva o projeto, seus arquivos serão mantidos no sistema, porém as funcionalidades dele estarão desligadas.
  • Fazer Backup: Cria uma cópia do projeto no estado atual. Acesse o backup através da funcionalidade Gerenciamento de Backup.
  • Conceder acesso remoto: abre uma janela que gera um link para permitir o acesso remoto por outro usuário, o cronapp solicitará sua autorização quando o novo usuário abrir o projeto. Também é possível enviar o link de compartilhamento por e-mail, basta inserir os e-mails que deseja enviar notificação.
  • Novo: Cria ou adiciona um novo arquivo.
    • Fazer upload: faz upload de um arquivo do computador para o projeto;
    • Fazer upload de um zip: faz upload de um .zip para o projeto, esse processo descompacta automaticamente o conteúdo compactado no local selecionado;
    • Fazer upload de um link: permite realizar o upload de um arquivo passando uma url.
    • Existem diversas opções de arquivos para serem criados, como JavaScript, Json, XML, HTML, relatório ou você pode usar a opção Outro para criar um arquivo com outra extensão.
  • Adicionar novo plugin: abre a janela para selecionar e adicionar um plugin ao projeto.
  • Aplicar modelo: retorna a tela de seleção do tipo de projeto e tema, então os arquivos serão sobrescritos pelos do novo modelo.
  • Compartilhar Projeto: abre uma janela que disponibiliza um link que permite que outro usuário copie o projeto para sua conta. Também é possível enviar esse link por e-mail. Para saber mais sobre essa funcionalidade, clique aqui.
  • Configuração: abre a janela de configurações gerais do projeto.
  • Fechar: fecha o projeto.

Ações em diretórios e arquivos

Existem algumas ações que podem ser feitas ao clicar com o botão direito num diretório ou arquivo na árvore da IDE


Nessa página

Figura 8 e 9 - Menu de contexto de um arquivo e um diretório respectivamente


  • Abrir: abre o arquivo selecionado;
  • Renomear: renomeia o arquivo ou diretório selecionado;
  • Remover: exclui o arquivo ou diretório selecionado;
  • Copiar: copia o arquivo ou diretório selecionado;
  • Recortar: recorta o arquivo ou diretório selecionado;
  • Colar: cola o arquivo ou diretório que foi recortado ou copiado;
  • Duplicar: duplica o arquivo ou diretório selecionado;
  • Baixar: faz o download do conteúdo selecionado, no caso de diretórios o mesmo é compactado em formato .zip;
  • Compartilhar Arquivo: abre uma janela que disponibiliza um link que permite que o usuário faça o download desse arquivo. Também é possível enviar esse link por e-mail. Para saber mais sobre essa funcionalidade, clique aqui;
  • Propriedades: mostra as propriedades do arquivo ou diretório selecionado;
  • Recarregar: recarrega novamente a árvore de arquivos;
  • Compartilhar Pasta: abre uma janela que disponibiliza um link que permite que o usuário faça o download dessa pasta. Também é possível enviar esse link por e-mail. Para saber mais sobre essa funcionalidade, clique aqui;
  • Abrir terminal: abre o diretório selecionado em um terminal linux;
  • Arquivar projeto: arquiva o projeto, seus arquivos serão mantidos no sistema, porém as funcionalidades dele estarão desligadas;
  • Fazer Backup: Cria uma cópia do projeto no estado atual. Acesse o backup através da funcionalidade Gerenciamento de Backup;
  • Conceder acesso remoto: abre uma janela que disponibiliza um link que permite o acesso remoto para outro usuário, o Cronapp solicitará sua autorização quando o novo usuário abrir o projeto. Também é possível enviar esse link por e-mail. Para saber mais sobre essa funcionalidade, clique aqui;
  • Novo: Cria ou adiciona um novo arquivo;
    • Fazer upload: faz upload de um arquivo do computador para o projeto;
    • Fazer upload de um zip: faz upload de um .zip para o projeto, esse processo descompacta automaticamente o conteúdo compactado no local selecionado;
    • Fazer upload de um link: permite realizar o upload de um arquivo passando uma url.
    • Existem diversas opções de arquivos para serem criados, como JavaScript, Json, XML, HTML, relatório ou você pode usar a opção Outro para criar um arquivo com outra extensão.

Ações arquivos Maven

O arquivo Definições Maven (pom.xml) possui uma categoria a parte em seu menu de contexto.


Figura 10 - Ações específicas para o Maven

  • Maven: ferramenta que faz o gerenciamento de dependências da aplicação e automatização de builds (versionamento e documentação). Acesse sua documentação para mais detalhes.
    • Processar alvos: abre uma janela para executar comando do tipo Maven.
    • Empacotar e baixar WAR: compacta os arquivos Maven e faz o download do .war gerado.

Customização de Templates

Para clientes do Cronapp Enterprise, um novo mecanismo de customização de templates foi adicionado à árvore de recursos. Trata-se do item Arquivos de Template. Esses arquivos são todos os templates que o Cronapp usa para gerar arquivos, camadas de dados e CRUDs. Ao abrir um arquivo e modificá-lo, você customizará um determinado template e o Cronapp passará usar ele ao invés do padrão de fábrica (figura 11).

Figura 11 - Arquivos usados para customização de templates


Existem duas subpastas dentro da pasta arquivos do template, são elas:

  • files: Onde ficam os templates de arquivos gerais como formulários, cruds, etc e
  • data-layer: Armazena os templates de geração dos arquivos java da camada de dados.

Os arquivos de template ficam com uma cor diferente dos demais. A cor laranja significa que o template está com o padrão de fábrica e a branca, que ele foi customizado. Para voltar alguma parte ao padrão de fábrica, basta excluir o arquivo ou pasta customizada. Para voltar todo o conteúdo para o padrão de fábrica, exclua a pasta Arquivos de Template.

Personalizando o crud

Para customizar a forma como o Cronapp gera os formulários de CRUD é necessário realizar algumas ações:

Duplicar a pasta: Arquivos de Template/files/crud/angular_crud_view

E inserir um novo nome ao template, editando o arquivo templates.properties


Figura 12.1 - Edição das propriedades do Templates


No exemplo acima, o template do CRUD fica no arquivo __FileName__.view.ftl (Figura 12.2). Esse arquivo segue um padrão do FreeMarker (Uma biblioteca java que gera, páginas html, emails, saídas de texto, arquivos de configuração e etc) para definição de templates .


Figura 12.2 - Arquivo do template do CRUD