PRIMEIRO PROJETO IONIC USANDO ANGULAR

Neste tutorial, mostrarei como estar criando o seu primeiro projeto IONIC utilizando a tecnologia Angular. Para começarmos, é necessário que você tenha instalado algumas dependências, clicando aqui você pode estar conferindo-as.

Agora que tudo está nos trinks, vamos iniciar com o nosso primeiro projeto em IONIC!

CRIANDO UMA PASTA DE PROJETOS

É importante possuir pastas separadas para cada coisa no seu HD, além de agilizar na hora da busca, deixa uma satisfação maior para trabalhar. Como estudo um número razoável de tecnologias, deixo uma pasta "projetos" no "C:" e crio pastas de acordo com a tecnologia que irei utilizar. Para alguns tipos de projeto, como em PHP que necessita de um programa para ser compilado, isso pode não ser viável, mas daí em diante é apenas questão de adaptação.

CRIANDO O PROJETO

Criado o seu cantinho para projetos, começaremos com a aplicação. Ela é feita inicialmente pelo terminal, o console do cmd funciona bem para esse trabalho.

Um truque fácil é, na sua pasta de projetos, no explorer do Windows, vá na barra de caminhos e digite "cmd", isso irá abrir o seu console em qualquer pasta que queria, evitando aquelas chuvas de "cd" que faz parecer comércio pirata.

Em seu console, digite o comando:

ionic start HelloW blank --type=angular

Isso significa que seu projeto terá o nome "HelloWorld", com o template blank, ou seja, vazio, e com a plataforma Angular implementada.

Se por acaso for solicitada a instalação do Capacitor, apenas aperte Enter, o não está como padrão nesta etapa.

Após um tempo, seu projeto terá sido criado, se quiser vê-lo em seu Visual Studio Code, digite em sequência:

cd HelloW

. code

Isso fará com que seu editor abra diretamente o seu projeto, isso se estiver configurado corretamente, mas caso não funcione, simplesmente abra seu editor e procure sua pasta manualmente.

COMPILANDO E TESTANDO O IONIC SERVE

Não iremos implementar nenhuma funcionalidade por enquanto, o intuito é testar se tudo está trabalhando como deveria trabalhar. Ainda no terminal, na pasta da sua aplicação HelloWorld, digite:

ionic serve

Frisando que, se caso a sua máquina seja idosa como a minha, esse processo deve levar algum tempo.

Após tudo ocorrer bem, seu projeto será aberto no seu browser padrão, e todas as edições realizadas no programa serão atualizadas, sem necessidade de digitar "ionic serve" a cada save.

Para interromper o processo, apenas pressione ctrl + c no terminal e parabéns! Seu primeiro projeto IONIC foi criado.

Autor: Guilherme Santos Maciel