Page tree
Skip to end of metadata
Go to start of metadata

Nessa página mostraremos uma visão geral sobre o desenvolvimento no Cronapp e iniciaremos nosso projeto de reserva de livros para uma biblioteca.

Essa página é parte de um tutorial, veja mais detalhes sobre o conteúdo abordado aqui em Criar projeto.

Desenvolvimento

Um dos diferenciais do Cronapp é dar ao usuário a possibilidade de desenvolver seu projeto de diferentes formas. Desenvolvedores mais experientes ou que já tenham iniciado seu projeto em outra plataforma e queiram migrar para o Cronapp, pode se sentir à vontade de usar o modelo high code, enquanto usuários menos experientes ou que desejam maior agilidade na criação de projetos podem preferir o modo low code. Essa escolha deve ser feita durante a criação do projeto.

Também é possível trabalhar de forma híbrida, criar seu projeto em modo Low code para utilizar os diversos recursos do Cronapp e desenvolver outras partes do projeto em High code. No Cronapp você é livre para escolher como deseja trabalhar.

High code

No modelo de projeto high code, o desenvolvimento ocorre como em outros ambientes de desenvolvimento integrado (IDE), com a codificação de todo o conteúdo e instalação de plugins de acordo a necessidade do seu projeto. Por padrão, quando você criar seu projeto nesse modo, ele já vem com uma estrutura simples criada, porém sem banco configurado ou qualquer lógica de programação previamente montada.

Nenhum recurso visual do Cronapp estará disponível neste modo.

Na Figura 1.1 vemos os ambientes disponíveis no modo High codeJava, NodeJs.Net e Python em back-end; JavaScript e TypeScript para o front-end. Também é possível criar plugins Cronapp para serem usados no modo Low Code.


Figura 1.1 - Ambientes disponíveis para o modo High code

Low code

Nos projetos low code são adicionados vários recursos e biblioteca que facilitam e agilizam o desenvolvimento, citamos alguns:

  • Diagrama de dados: permite criar ou gerar a engenharia reversa da modelagem usada no seu sistema. Também gera as camadas DAO, entity e toda as tabelas no banco de dados cadastrado.
  • Blocos de programação: criação da lógica de programação sem codificar em modo textual.
  • Editor visual: facilita a criação de telas apenas arrastando os componentes, aplicando eventos, adicionando estilos e outros.
  • Fonte de dados: faz a ligação entre o conteúdo do banco de dados e os blocos de programação ou componentes na tela.
  • Permissão de segurança: define regras e autorizações para diferentes perfis de usuário do sistema.

Como informado acima, este modo não impede que você trabalhe em modo high code, apenas lhe dá novos recursos para desenvolver o seu projeto de forma mais simples e ágil.

Low code em Modo Avançado

Após abrir seu projeto low code é possível desabilitar a opção Modo Avançado, simplificando ainda mais o desenvolvimento (destaque 1 da Figura 1.2)


Figura 1.2 - Alternar entre o desenvolvimento low code Avançado ou Simplificado


Desabilitando o Modo Avançado, o Cronapp oculta a maioria dos recursos que permitem o desenvolvimento high code. Assim, exibirá apenas as funcionalidades de desenvolvimento visual.

Na Figura 1.3 vemos o modo low code utilizando Java em sua linguagem de servidor e JavaScript no lado cliente. A estrutura do seu projeto não muda ao trabalhar com a opção Avançado desativada, apenas oculta os códigos fontes.


Figura 1.3 - Ambiente disponível para o modo low code


Neste tutorial vamos utilizar sempre opção Modo Avançado desativada.



Passos

Novo usuário

Caso você ainda não possua uma conta Cronapp, é possível criar uma conta Free e utilizar os principais recursos da nossa plataforma. 

Acesso

Após a criação da conta, acesse o site da IDE (ide.cronapp.io) e logue com seu usuário (Figura 2.1). A plataforma ficará disponível para abrir um projeto existente, importar um criado em outra plataforma ou iniciar um novo. 


Figura 2.1 - Logue com seu usuário

Seleção de memória

Após logar, você será direcionado para a tela de seleção de memória RAM, ela será utilizada durante o desenvolvimento e execução de testes do seu projeto.

No geral, 1gb é suficiente para a maioria dos projetos. Porém, projetos grandes e com muitos recursos podem demandar mais memória.

Contas com plano free só podem utilizar 1gb de memória RAM e não visualizarão essa tela.


Figura 2.2 - Seleção de memória para rodar o projeto

Ajuda e exemplo

Um assistente exibirá informações sobre o Cronapp para cada janela aberta, você pode clicar em Próximo para ver as informações ou em clique para fechar para parar o assistente.



Figura 2.3 - Assistente de ajuda


Caso não queira exibir mais o assistente, clique no botão atalho Assistente > Parar todos os Assistentes (Figura 2.4).



Figura 2.4 - Parar todos os Assistentes


Por fim, no primeiro acesso ao Cronapp será aberta uma janela que irá sugerir que você baixe um projeto exemplo de farmácia com várias funcionalidades desenvolvidas apenas em low code. Mas para esse tutorial, clique em Não.

Caso queira acessar o nosso projeto de exemplo mais tarde, clique no botão Projeto Exemplo na aba de Bem Vindo.


Figura 2.5 - Na aba Bem Vindo é possível baixar o projeto exemplo

Definindo o projeto

Seguindo os passos como na Figura 2.6: clique no ícone Novo Projeto (destaque 1 da Figura 2.6) e na janela que abrir, selecione o projeto mobile e Web do tipo Low-code (2), informe o nome do projeto "Get_Started" e por fim, selecione a opção Copiar do Modelo (4). Após isso, clique em Finalizar.


Figura 2.6 - Definições iniciais do novo projeto

Modelo

A próxima tela é a de seleção do modelo, cada modelo possuem uma série de tecnologias que facilitarão o desenvolvimento de seu sistema. Atualmente o Cronapp Low code trabalha apenas com o modelo Mobile Low-Code Project, selecione-o e clique em Avançar, como na Figura 2.7.


Figura 2.7 - Seleção do modelo do projeto

Informações do projeto

Na janela de definições do projeto mobile (Figura 2.8), informe o Identificador da sua aplicação, por exemplo: "br.com.minhaempresa.nomedomeuapp" ou deixe o padrão. Ao selecionar a opção Incluir Front-End será criado a parte web da sua aplicação, já a opção Incluir Back-End adicionará o lado servidor. No nosso caso vamos criar um projeto completo, com servidor, web e mobile, então deixe as duas opções selecionadas.

Deixe também a opção Tipo de Autenticação selecionada como Token, exigindo que o usuário logue no sistema. Deixe as opções de Login por redes sociais e Autenticação Mútua como Não.



Figura 2.8 - Configurações do projeto

Temas

As opções de temas foram importadas do Bootstrap, ao selecionar um tema, tanto o projeto web quanto o mobile seguirão o mesmo padrão. Nesse projeto usaremos o tema Material, padrão do Cronapp e com suporte à acessibilidade.


Figura 2.9 - Seleção de temas do Bootstrap


Clique em Finalizar e aguarde o Cronapp configurar todo o projeto para você!


  • No labels