Roteiro JavaScript

Guia visual completo para desenvolvimento HTML, Bootstrap e JS

Fase 1: HTML e Bootstrap

1 Abrir o Visual Studio Code

Passo 1

2 Abrir arquivo e selecionar e criar base HTML

Passo 2

3 Digite html:5 e pressione Enter. Após, troque para pt-br e mude o título para o nome do programa.

Passo 3

4 Pesquise na internet getbootstrap.com e pegue o link do bootstrap href etc. Use o atalho Alt + Shift + F para formatar o código.

Passo 4

5 Digite o H1, crie o input e label e também o comentário com Ctrl + ; (Todo input precisa de ID!).

Passo 5

6 Ir para o Bootstrap e escolher a opção Forms Control e também pegar os botões na aba Components (Colocar um ID também no botão).

Passo 6

7 Inserir um comando para exibir o resultado.

Passo 7

8 E após, inserir o comando <script src="..."> com o nome do arquivo JavaScript antes do final do body.

Passo 8

Fase 2: JavaScript

1 Um novo programa base.js

Fase 2 Passo 1

2 Declarar o botão e relacionar o botão com o clique exibir.addEventListener

Fase 2 Passo 2A Fase 2 Passo 2B

3 O nome da função é igual ao segundo parâmetro

Fase 2 Passo 3

4 Relacionar o input no JavaScript document.getElementById. Todo input deve ter .value

Fase 2 Passo 4

5 Criar uma condição com os valores sexo F ou M

Fase 2 Passo 5

6 div row e div col Fase 2 Passo 5

Roteiro Concluído!

Voltar