Oi Ibrahim! Tudo ok contigo?
Posso lhe ajudar com isso sim!
Bom vamos lá.
Respondendo seu primeiro pedido, vou ensinar como testar o seu código. Como pré-requisito você já deve ter o Visual Studio Code instalado, se não tiver instale por aqui.
Depois vamos ir no gerenciador de arquivos e criar uma pasta para abrigar seu projeto (Deixe em um lugar fácil de achar, pois ela será de suma importância). Após isso você vai abrir o seu Visual Studio Code e ele provavelmente irá abrir uma tela de boas-vindas ou uma tela mostrando o arquivo que você estava trabalhando antes de fechar ele. Se qualquer forma o caminho para seguir agora é praticamente o mesmo, mas vamos pelo mais simples no momento:
- No canto superior da tela do App você vai ver uma seção com alguns botões:
- Se tiver em inglês provavelmente seria: "File Edit Selection View Go Run ...";
- Se tiver em português seria algo tipo: "Arquivo Editar Seleção Ver Acessar Executar ...".
Aqui você deve clicar no primeiro botão deles, no caso "File" ou "Arquivo" e então vai abrir uma lista de opções, procure pela opção "Add Folder to Workspace..." ou "Adicionar Pasta à Area de Trabalho" ou uma opção nesse sentido.
- Quando encontrar essa opção clique nela. Então uma aba de arquivos será aberta. Agora procure pelo arquivo que você criou para colocar o projeto. E selecione ele e clique em "Selecionar Pasta", ou "Abrir", ou o botão que estiver aparecendo para você.
- Feito isso você irá perceber que a aba se fechou e voltou para a tela do VS Code(Visual Studio Code), lá você só precisa clicar no botão de novo arquivo, ou nova pasta que aparece ao lado do nome da pasta adicionada ao App.
- Agora é só criar o arquivo que deseja e adicionar a extensão dele, no nosso caso seria o
app.js
Escreva o código ali e salve com o atalho do teclado "Ctrl + S". - Assim, se você voltar para o Gerenciador de Tarefas e abrir a pasta que você tinha antes, vai ver o arquivo criado no VS Code ali.
- Vou deixar um GIF resumindo esses passos abaixo:
Bom o próximo passo é executar o arquivo e abrir ele. Para isso depende muito da linguagem que você está usando, nesse caso acredito que o que você quer é executar ele no navegador, para isso precisamos de um arquivo com a extensão HTML, onde o projeto pode ser carregado.
Para isso você deve criar um arquivo com o nome index.html
ele quando aberto leva para uma página no seu navegador padrão, seja Edge, Chrome, Firefox, Opera, entre outros. Nesse arquivo você deve adicionar uma tag de script
que levará você ao arquivo JavaScript. No nosso caso seria algo assim <script src="app.js"></script>
, depois você salva o arquivo com o "Ctrl + S" e vai no gerenciador de tarefas e abre ele clicando duas vezes nele. E sempre que você fizer alguma mudança nele você pode só apertar a tecla "F5" que você irá recarregar a página e as mudanças que você adicionar ao código serão aplicadas no navegador.
Um resuminho disso bem aqui:
Sobre o segundo pedido, tem uma maneira bem fácil para isso. Você já sabe como criar um arquivo novo no VS Code e já sabe como funciona a mágica do index.html
, então digamos que você quer criar uma pasta de testes onde você vai fazer testes no seu código, então você pode só criar um arquivo com a extensão .html
com o nome que quiser, como, por exemplo, criandoUmAlert.html
e colocar uma tag de <script>
lá e dentro dela você escrever seu código e salvar depois abrir no navegador, você consegue fazer quantos testes quiser.
Exemplo abaixo:
Ali eu criei uma pasta chamada "Pasta para teste de códigos" e dentro dela criei 2 arquivos com extensões HTML e coloquei neles a tag <script></script>
e depois coloquei dentro das tags os códigos JavaScript e abri os arquivos no navegador.
Sempre antes de mudar de arquivo ou App eu usava o atalho "Ctrl + S" para salvar o arquivo.
E você pode fazer isso com códigos mais simples, tudo depende de você.
Esperto ter explicado bem.
Se tiver mais alguma dúvida é só falar, e se não entender algo ou tiver problemas com algo relacionado ao que foi passado acima é só falar.
Espero ter ajudado, abraços e bons estudos.
Caso este post tenha lhe ajudado, por favor marque ele como solução! ✓