Nesse artigo eu vou mostrar como preparar seu ambiente de desenvolvimento para você criar apps usando o Ionic.
Eu não vou mostrar detalhadamente como instalar cada software pois a instalação é igual a de qualquer outro software.
Node.js e npm
Para instalar o Ionic no seu PC, você precisa apenas do Node.js e do npm, porem para fazer o build do app para Android ou iOS você vai precisa de mais coisas que serão exibidas mais abaixo nesse tutorial. O npm é automaticamente instalado ao instalar o Node.js. A versão recomendada do Node.js que você deve instalar no seu PC é a LTS.
Git
O Git é uma ferramenta de versionamento de código altamente recomendada. A instalação não é obrigatória, mas eu recomendo para você não perca mais seu código fonte.
Instalando o Ionic
Depois de ter instalado o Node.js, o próximo passo é abrir o terminal do Windows ou Mac e rodar o comando abaixo:
npm install -g ionic
O -g significa que você vai instalar o Ionic de maneira global, ou
seja, todo projeto que você criar com o Ionic vai usar a mesma versão
instalada.
Visual Studio Code
O Visual Studo Code ou VSCode é o melhor editor de texto/ide para você criar seus apps com Ionic. A instalação dele é muito simples e ele possui vários complementos que podem ser instalados e facilitar seu dia a dia.
Ionic Extension Pack
O Ionic Extension Pack é um agrupamento de complementos do VSCode que você pode instalar no VSCode que vai facilitar sua vida durante do desenvolvimento.
Para instalar é muito simples, é só seguir os passos abaixo
- Abra o VSCode
- Vá até a aba Extensões
- Digite “Ionic Extension Pack”
- Clique em cima da opção “Install”
Instalando o Cordova
O Cordova é uma das maneiras de fazer o build nativo de um app Ionic para Android o iOS. E para instalar é muito simples, basta rodar o comando abaixo no terminal do Windows ou Mac
npm install -g cordova
Para saber qual foi a versão que você instalou, basta rodar o comando abaixo:
cordova -v
Android Setup
Para fazer o build de um app Ionic para a versão Android é necessário instalar os softwares abaixo:
Efetuar download do Java SE Development Kit
Efetuar download do Android Studio
Configurando o Android SDK
Depois de instalar os softwares acima é hora de configurar a Android SDK. Para isso você vai abrir o Android Studio e seguir os passos abaixo.
- Clique em Configure e depois em SDK Manager
- Uma nova tela vai abir e nela você vai marcar alguns pacotes para ser instalado conforme explicado abaixo.
Aba SDK Platform
Nessa aba você vai escolher qual SDK do Android você vai instalar. Para fazer essa escolha é necessário saber qual versão do Cordova você instalou na sua maquina, ou seja, se você instalou a versão 7 do Cordova, você precisa instalar a SDK Platform de API Level entre 19 – 27. Para saber mais, no site do cordova tem uma tabela simples e você pode acessar clicando aqui.
Bom aqui eu tenho a versão 7 do Cordova e marquei a opção Android 8.1 (Oreo) conforme imagem abaixo.
Aba SDK Tools
Nessa aba você vai marcar a opção Android Support Repository
Depois de marcar os pacotes é só clicar em OK, aceitar as licenças e aguardar a instalação.
iOS Setup
Para fazer o build de um app Ionic para a versão iOS é necessário instalar o software abaixo:
O xcode é a IDE para criar apps nativos para o iOS, ela inclui a SDK do iOS e as linhas de comando.
O download é gratuito e você precisa apenas de um MAC e uma conta da Apple.
Configurando um time de desenvolvimento
Todo app iOS precisa ter seu código assinado, até em ambiente de desenvolvimento. O Xcode já facilita sua vida fazendo essa assinatura automática. Para configurar é só seguir os passos abaixo:
- Abra o Xcode e navegue pelas opções Xcode > Preferencias > Contas
- Na tela que abrir você precisa preencher com sua conta da Apple
Emuladores
Particularmente eu não gosto de emuladores, eu acho eles lentos e pesados rodando no meu PC. Uma alternativa que funciona muito bem pra mim é rodar o app direto no celular.
Mas se você preferir usar um emulador, vou te passar duas opções:
- Criar um emulador a partir do Android Studio ou XCode
- Usar o Genymotion
O Genymotion é um dos melhores emuladores para Android que eu conheço e você pode usar ele gratuitamente se o uso for estritamente pessoal.
Para fazer o download da versão pessoal é só clicar aqui e depois seguir os passos da instalação.
Conclusão
Preparar o seu ambiente de desenvolvimento é muito simples, porem você precisa ter atenção durante o processo para não esquecer nada.
Um outro detalhe é que você sempre deve buscar novas ferramentas que vão facilitar seu dia a dia durante o desenvolvimento.
Você conhece alguma ferramenta legal que poderia ser adicionada nesse post? deixa aí nos comentários!