Configurando o ambiente de desenvolvimento

5.1 Escolhendo IDE

Para escrever programas, você precisa escrever programas. Faz sentido nessa citação. Mas para começar a escrever programas, você precisa instalar uma IDE (programa especial para escrever programas) e criar o primeiro projeto.

Existem várias opções de IDEs que você pode escolher para aprender desenvolvimento web. Todas elas são praticamente equivalentes, já que o código do seu projeto será executado no navegador 😊

Aqui estão as 4 mais populares:

• Visual Studio Code da Microsoft
• Intellij IDEA Community Edition
• Atom do GitHub
• WebStorm Community Edition ()

Eu gosto do WebStorm, mas você pode escolher qualquer outro produto e não notar muita diferença. Abaixo vou mostrar capturas de tela de algumas etapas-chave da configuração da IDE.

5.2 Baixando o WebStorm

Passo 1. Para instalar o WebStorm, primeiro você precisa baixá-lo. Digite no Google WebStorm ou simplesmente vá até o link. Lá você verá uma imagem bonita como essa:

Passo 2. Clica sem medo no botão «Download», e o download começará imediatamente. Se tudo correr bem, você verá uma mensagem como esta:

Passo 3. O sistema operacional necessário deve ser identificado automaticamente. Mas se isso não acontecer, você pode escolher nesta página — download WebStorm:

5.3 Instalando o WebStorm

Depois de baixar a versão necessária do WebStorm, é hora de instalá-lo. Aqui estão algumas etapas-chave:

Passo 1. Inicie o instalador — deve aparecer uma janela assim:

Passo 2. Marque algumas opções, como na minha tela:

Passo 3. Não é necessário reiniciar nada:

5.4 WebStorm para uso não comercial

Se você estiver usando essas IDEs para fins não comerciais, como aprendizado, você pode usá-las gratuitamente.

1. Abra o WebStorm.
2. Ao iniciar, aparecerá uma janela onde você pode selecionar a opção de uso não comercial.
3. Faça login na sua conta JetBrains ou crie uma nova.
4. Aceite o "Acordo de Assinatura da Caixa de Ferramentas para Uso Não Comercial".
5. Curta o desenvolvimento.

Se você já iniciou o período de teste ou ativou sua IDE com uma licença paga, ainda pode mudar para a assinatura não comercial seguindo estes passos:

1. Para o WebStorm, vá até Help | Register.
2. Na janela aberta, clique no botão Remove License.
3. Selecione Non-commercial use (Uso não comercial).
4. Faça login na sua conta JetBrains ou crie uma nova.
5. Aceite o "Acordo de Assinatura da Caixa de Ferramentas para Uso Não Comercial".
6. Curta o desenvolvimento.

5.5 Criando o primeiro projeto

Depois de instalar o WebStorm, só falta iniciá-lo e criar o primeiro projeto. Siga as instruções:

Passo 1. Inicie o WebStorm. Você verá uma janela como esta:

Passo 2. Crie um novo projeto — clique no botão New Project.

Depois você precisa:

• Escolher um nome para seu primeiro projeto.
• Especificar a pasta para seu primeiro projeto (campo Location). Se o WebStorm sugerir a pasta Admin por padrão, é melhor mudá-la. Menos problemas depois.

O meu ficou mais ou menos assim:

Passo 3. Se você fez tudo certinho, verá uma imagem como essa: