Web-Dev-For-Beginners/translations/pt

Desenvolvimento Web para Iniciantes - Um Currículo

Aprenda os fundamentos do desenvolvimento web com o nosso curso abrangente de 12 semanas oferecido pelos Microsoft Cloud Advocates. Cada uma das 24 lições explora JavaScript, CSS e HTML através de projetos práticos como terrários, extensões de navegador e jogos espaciais. Participe de quizzes, discussões e tarefas práticas. Melhore suas habilidades e otimize a retenção de conhecimento com nossa metodologia eficaz baseada em projetos. Comece sua jornada de programação hoje!

🧑‍🎓 És estudante?

Visita a página Student Hub, onde encontrarás recursos para iniciantes, pacotes para estudantes e até formas de obter um voucher gratuito para certificação. Esta é a página que deves marcar nos favoritos e verificar regularmente, pois o conteúdo é atualizado mensalmente.

📣 Anúncio - Novo Currículo sobre IA Generativa para JavaScript foi lançado

Não percas o nosso novo currículo sobre IA Generativa!

Visita https://aka.ms/genai-js-course para começar!

• Lições que abrangem desde os fundamentos até RAG.
• Interage com personagens históricos usando GenAI e a nossa aplicação complementar.
• Narrativa divertida e envolvente, vais viajar no tempo!

Cada lição inclui uma tarefa para completar, uma verificação de conhecimento e um desafio para te guiar no aprendizado de tópicos como:

• Criação de prompts e engenharia de prompts
• Geração de aplicações de texto e imagem
• Aplicações de pesquisa

Visita https://aka.ms/genai-js-course para começar!

🌱 Começar

Professores, incluímos algumas sugestões sobre como usar este currículo. Adoraríamos receber o vosso feedback no nosso fórum de discussão!

Estudantes, para cada lição, começa com um quiz pré-aula e segue com a leitura do material da aula, completando as várias atividades e verificando a tua compreensão com o quiz pós-aula.

Para melhorar a tua experiência de aprendizagem, conecta-te com colegas para trabalharem juntos nos projetos! As discussões são incentivadas no nosso fórum de discussão, onde a nossa equipa de moderadores estará disponível para responder às tuas perguntas.

Para aprofundar a tua educação, recomendamos explorar Microsoft Learn para materiais de estudo adicionais.

📋 Configurar o teu ambiente

Este currículo tem um ambiente de desenvolvimento pronto para usar! Ao começar, podes optar por executar o currículo num Codespace (um ambiente baseado no navegador, sem necessidade de instalações), ou localmente no teu computador usando um editor de texto como Visual Studio Code.

Criar o teu repositório

Para guardares facilmente o teu trabalho, recomendamos que cries a tua própria cópia deste repositório. Podes fazer isso clicando no botão Use this template no topo da página. Isto criará um novo repositório na tua conta GitHub com uma cópia do currículo.

Segue estes passos:

1. Faz um Fork do Repositório: Clica no botão "Fork" no canto superior direito desta página.
2. Clona o Repositório: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git

Executar o currículo num Codespace

Na tua cópia deste repositório que criaste, clica no botão Code e seleciona Open with Codespaces. Isto criará um novo Codespace para trabalhares.

Executar o currículo localmente no teu computador

Para executar este currículo localmente no teu computador, vais precisar de um editor de texto, um navegador e uma ferramenta de linha de comando. A nossa primeira lição, Introdução às Linguagens de Programação e Ferramentas de Trabalho, vai guiar-te através de várias opções para cada uma destas ferramentas, para que possas escolher o que funciona melhor para ti.

A nossa recomendação é usar o Visual Studio Code como editor, que também tem um Terminal integrado. Podes descarregar o Visual Studio Code aqui.

1. Clona o teu repositório para o teu computador. Podes fazer isso clicando no botão Code e copiando o URL:

   

   Depois, abre o Terminal dentro do Visual Studio Code e executa o seguinte comando, substituindo <your-repository-url> pelo URL que acabaste de copiar:

   git clone <your-repository-url>
   

2. Abre a pasta no Visual Studio Code. Podes fazer isso clicando em File > Open Folder e selecionando a pasta que acabaste de clonar.

Extensões recomendadas para Visual Studio Code:

• Live Server - para pré-visualizar páginas HTML dentro do Visual Studio Code
• Copilot - para te ajudar a escrever código mais rapidamente

📂 Cada lição inclui:

• sketchnote opcional
• vídeo suplementar opcional
• quiz de aquecimento pré-aula
• lição escrita
• para lições baseadas em projetos, guias passo a passo sobre como construir o projeto
• verificações de conhecimento
• um desafio
• leitura suplementar
• tarefa
• quiz pós-aula

Nota sobre quizzes: Todos os quizzes estão contidos na pasta Quiz-app, 48 quizzes no total, cada um com três perguntas. Estão ligados dentro das lições e a aplicação de quizzes pode ser executada localmente ou implantada no Azure; segue as instruções na pasta quiz-app. Estão a ser gradualmente localizados.

🗃️ Lições

	Nome do Projeto	Conceitos Ensinados	Objetivos de Aprendizagem	Lição Ligada	Autor
01	Primeiros Passos	Introdução à Programação e Ferramentas de Trabalho	Aprende os fundamentos por trás da maioria das linguagens de programação e sobre software que ajuda os programadores profissionais	Introdução às Linguagens de Programação e Ferramentas de Trabalho	Jasmine
02	Primeiros Passos	Noções Básicas de GitHub, incluindo trabalho em equipa	Como usar o GitHub no teu projeto e colaborar com outros numa base de código	Introdução ao GitHub	Floor
03	Primeiros Passos	Acessibilidade	Aprende os fundamentos da acessibilidade na web	Fundamentos de Acessibilidade	Christopher
04	Noções de JS	Tipos de Dados em JavaScript	Os fundamentos dos tipos de dados em JavaScript	Tipos de Dados	Jasmine
05	Noções de JS	Funções e Métodos	Aprende sobre funções e métodos para gerir o fluxo lógico de uma aplicação	Funções e Métodos	Jasmine e Christopher
06	Noções de JS	Tomar Decisões com JS	Aprende como criar condições no teu código usando métodos de tomada de decisão	Tomar Decisões	Jasmine
07	Noções de JS	Arrays e Loops	Trabalha com dados usando arrays e loops em JavaScript	Arrays e Loops	Jasmine
08	Terrário	HTML na Prática	Constrói o HTML para criar um terrário online, focando na construção de um layout	Introdução ao HTML	Jen
09	Terrário	CSS na Prática	Constrói o CSS para estilizar o terrário online, focando nos fundamentos do CSS, incluindo tornar a página responsiva	Introdução ao CSS	Jen
10	Terrário	Closures em JavaScript, manipulação do DOM	Constrói o JavaScript para fazer o terrário funcionar como uma interface de arrastar e soltar, focando em closures e manipulação do DOM	Closures em JavaScript, manipulação do DOM	Jen
11	Jogo de Digitação	Constrói um Jogo de Digitação	Aprende como usar eventos de teclado para conduzir a lógica da tua aplicação JavaScript	Programação Orientada a Eventos	Christopher
12	Green Browser Extension	Trabalhar com Navegadores	Aprenda como os navegadores funcionam, sua história e como estruturar os primeiros elementos de uma extensão de navegador	Sobre Navegadores	Jen
13	Green Browser Extension	Criar um formulário, chamar uma API e armazenar variáveis no armazenamento local	Construa os elementos JavaScript da sua extensão de navegador para chamar uma API usando variáveis armazenadas no armazenamento local	APIs, Formulários e Armazenamento Local	Jen
14	Green Browser Extension	Processos em segundo plano no navegador, desempenho web	Use os processos em segundo plano do navegador para gerenciar o ícone da extensão; aprenda sobre desempenho web e algumas otimizações	Tarefas em Segundo Plano e Desempenho	Jen
15	Space Game	Desenvolvimento de Jogos Mais Avançado com JavaScript	Aprenda sobre Herança usando Classes e Composição e o padrão Pub/Sub, preparando-se para criar um jogo	Introdução ao Desenvolvimento Avançado de Jogos	Chris
16	Space Game	Desenhar no Canvas	Aprenda sobre a API Canvas, usada para desenhar elementos na tela	Desenhar no Canvas	Chris
17	Space Game	Mover elementos pela tela	Descubra como os elementos podem ganhar movimento usando coordenadas cartesianas e a API Canvas	Mover Elementos	Chris
18	Space Game	Detecção de colisão	Faça os elementos colidirem e reagirem uns aos outros usando teclas pressionadas e forneça uma função de cooldown para garantir o desempenho do jogo	Detecção de Colisão	Chris
19	Space Game	Contabilizar pontos	Realize cálculos matemáticos com base no status e desempenho do jogo	Contabilizar Pontos	Chris
20	Space Game	Finalizar e reiniciar o jogo	Aprenda sobre como finalizar e reiniciar o jogo, incluindo limpar recursos e redefinir valores de variáveis	Condição de Finalização	Chris
21	Banking App	Templates HTML e Rotas em uma Aplicação Web	Aprenda como criar a estrutura de uma arquitetura de site com várias páginas usando rotas e templates HTML	Templates HTML e Rotas	Yohan
22	Banking App	Criar um Formulário de Login e Registo	Aprenda sobre como criar formulários e lidar com rotinas de validação	Formulários	Yohan
23	Banking App	Métodos de Obtenção e Utilização de Dados	Como os dados fluem para dentro e fora da sua aplicação, como obtê-los, armazená-los e descartá-los	Dados	Yohan
24	Banking App	Conceitos de Gestão de Estado	Aprenda como a sua aplicação mantém o estado e como gerenciá-lo programaticamente	Gestão de Estado	Yohan

🏫 Pedagogia

O nosso currículo foi desenvolvido com dois princípios pedagógicos fundamentais:

• aprendizagem baseada em projetos
• questionários frequentes

O programa ensina os fundamentos de JavaScript, HTML e CSS, bem como as ferramentas e técnicas mais recentes utilizadas pelos desenvolvedores web de hoje. Os alunos terão a oportunidade de adquirir experiência prática ao criar um jogo de digitação, um terrário virtual, uma extensão de navegador ecológica, um jogo estilo "space invader" e uma aplicação bancária para empresas. Ao final da série, os alunos terão adquirido uma compreensão sólida do desenvolvimento web.

🎓 Pode realizar as primeiras lições deste currículo como um Learn Path no Microsoft Learn!

Ao garantir que o conteúdo esteja alinhado com os projetos, o processo torna-se mais envolvente para os alunos e a retenção dos conceitos será aumentada. Também escrevemos várias lições introdutórias sobre os fundamentos de JavaScript para apresentar conceitos, acompanhadas por um vídeo da coleção "Beginners Series to: JavaScript", cujos autores contribuíram para este currículo.

Além disso, um questionário de baixo impacto antes da aula define a intenção do aluno em aprender um tópico, enquanto um segundo questionário após a aula garante maior retenção. Este currículo foi projetado para ser flexível e divertido e pode ser realizado na íntegra ou em partes. Os projetos começam pequenos e tornam-se cada vez mais complexos ao final do ciclo de 12 semanas.

Embora tenhamos evitado intencionalmente introduzir frameworks de JavaScript para nos concentrarmos nas habilidades básicas necessárias como desenvolvedor web antes de adotar um framework, um bom próximo passo após completar este currículo seria aprender sobre Node.js através de outra coleção de vídeos: "Beginner Series to: Node.js".

Visite as nossas diretrizes de Código de Conduta e Contribuição. Agradecemos o seu feedback construtivo!

🧭 Acesso offline

Pode executar esta documentação offline utilizando o Docsify. Faça um fork deste repositório, instale o Docsify na sua máquina local e, na pasta raiz deste repositório, digite docsify serve. O site será servido na porta 3000 no seu localhost: localhost:3000.

📘 PDF

Um PDF de todas as lições pode ser encontrado aqui.

🎒 Outros Cursos

A nossa equipa produz outros cursos! Confira:

• Generative AI for Beginners
• Generative AI for Beginners .NET
• Generative AI with JavaScript
• Generative AI with Java
• AI for Beginners
• Data Science for Beginners
• ML for Beginners
• Cybersecurity for Beginners
• Web Dev for Beginners
• IoT for Beginners
• XR Development for Beginners
• Mastering GitHub Copilot for Agentic use
• Mastering GitHub Copilot for C#/.NET Developers
• Choose Your Own Copilot Adventure

Licença

Este repositório está licenciado sob a licença MIT. Consulte o arquivo LICENSE para mais informações.

Aviso Legal:
Este documento foi traduzido utilizando o serviço de tradução por IA Co-op Translator. Embora nos esforcemos para garantir a precisão, esteja ciente de que traduções automáticas podem conter erros ou imprecisões. O documento original no seu idioma nativo deve ser considerado a fonte autoritativa. Para informações críticas, recomenda-se uma tradução profissional realizada por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas resultantes do uso desta tradução.