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 as suas competências e otimize a retenção de conhecimento com a nossa pedagogia eficaz baseada em projetos. Comece a sua jornada de programação hoje!

Junte-se à Comunidade Discord do Azure AI Foundry

Siga estes passos para começar a usar estes recursos:

1. Faça um Fork do Repositório: Clique
2. Clone o Repositório: git clone https://github.com/microsoft/Web-Dev-For-Beginners.git
3. Junte-se ao Discord do Azure AI Foundry e conheça especialistas e outros programadores

🌐 Suporte Multilíngue

Suportado via GitHub Action (Automatizado e Sempre Atualizado)

Árabe | Bengali | Búlgaro | Birmanês (Myanmar) | Chinês (Simplificado) | Chinês (Tradicional, Hong Kong) | Chinês (Tradicional, Macau) | Chinês (Tradicional, Taiwan) | Croata | Checo | Dinamarquês | Holandês | Estoniano | Finlandês | Francês | Alemão | Grego | Hebraico | Hindi | Húngaro | Indonésio | Italiano | Japonês | Coreano | Lituano | Malaio | Marathi | Nepalês | Norueguês | Persa (Farsi) | Polaco | Português (Brasil) | Português (Portugal) | Punjabi (Gurmukhi) | Romeno | Russo | Sérvio (Cirílico) | Eslovaco | Esloveno | Espanhol | Swahili | Sueco | Tagalog (Filipino) | Tâmil | Tailandês | Turco | Ucraniano | Urdu | Vietnamita

Se desejar ter traduções adicionais, os idiomas suportados estão listados aqui

🧑‍🎓 És estudante?

Visita Página do Hub de Estudantes onde encontrarás recursos para iniciantes, pacotes para estudantes e até formas de obter um voucher para certificado gratuito. Esta é a página que deves marcar como favorita e verificar regularmente, pois o conteúdo é atualizado mensalmente.

📣 Anúncio - Novo Projeto para criar usando IA Generativa

Acabámos de adicionar um novo projeto de Assistente de IA, confere projeto

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

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

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

• Lições que cobrem tudo, 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 na aprendizagem 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 verifica a tua compreensão com o quiz pós-aula.

Para melhorar a tua experiência de aprendizagem, conecta-te com os teus 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 vivamente explorar Microsoft Learn para materiais de estudo adicionais.

📋 Configurar o teu ambiente

Este currículo tem um ambiente de desenvolvimento pronto a 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.

Cria 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 Visual Studio Code como editor, que também tem um Terminal integrado. Podes fazer o download do 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:

   CodeSpace

   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 complementar
• tarefa
• questionário pós-lição

Uma nota sobre os questionários: Todos os questionários estão contidos na pasta Quiz-app, 48 questionários no total, cada um com três perguntas. Estão disponíveis aqui. A aplicação de questionários pode ser executada localmente ou implantada no Azure; siga as instruções na pasta quiz-app.

🗃️ Lições

	Nome do Projeto	Conceitos Ensinados	Objetivos de Aprendizagem	Lição Vinculada	Autor
01	Primeiros Passos	Introdução à Programação e Ferramentas de Trabalho	Aprenda os fundamentos básicos por trás da maioria das linguagens de programação e sobre o software que ajuda os desenvolvedores profissionais	Introdução às Linguagens de Programação e Ferramentas de Trabalho	Jasmine
02	Primeiros Passos	Noções Básicas do GitHub, incluindo trabalho em equipe	Como usar o GitHub no seu projeto e colaborar com outros em uma base de código	Introdução ao GitHub	Floor
03	Primeiros Passos	Acessibilidade	Aprenda os fundamentos da acessibilidade na web	Fundamentos de Acessibilidade	Christopher
04	Fundamentos de JS	Tipos de Dados em JavaScript	Os fundamentos dos tipos de dados em JavaScript	Tipos de Dados	Jasmine
05	Fundamentos de JS	Funções e Métodos	Aprenda sobre funções e métodos para gerenciar o fluxo lógico de uma aplicação	Funções e Métodos	Jasmine e Christopher
06	Fundamentos de JS	Tomando Decisões com JS	Aprenda a criar condições no seu código usando métodos de tomada de decisão	Tomando Decisões	Jasmine
07	Fundamentos de JS	Arrays e Loops	Trabalhe com dados usando arrays e loops em JavaScript	Arrays e Loops	Jasmine
08	Terrário	HTML na Prática	Construa 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	Construa 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	Construa o JavaScript para fazer o terrário funcionar como uma interface de arrastar/soltar, focando em closures e manipulação do DOM	Closures em JavaScript, manipulação do DOM	Jen
11	Jogo de Digitação	Construa um Jogo de Digitação	Aprenda a usar eventos de teclado para conduzir a lógica da sua aplicação JavaScript	Programação Orientada a Eventos	Christopher
12	Extensão Verde para Navegador	Trabalhando com Navegadores	Aprenda como os navegadores funcionam, sua história e como estruturar os primeiros elementos de uma extensão para navegador	Sobre Navegadores	Jen
13	Extensão Verde para Navegador	Construindo um formulário, chamando uma API e armazenando variáveis no armazenamento local	Construa os elementos JavaScript da sua extensão para navegador para chamar uma API usando variáveis armazenadas no armazenamento local	APIs, Formulários e Armazenamento Local	Jen
14	Extensão Verde para Navegador	Processos em segundo plano no navegador, desempenho na web	Use os processos em segundo plano do navegador para gerenciar o ícone da extensão; aprenda sobre desempenho na web e algumas otimizações	Tarefas em Segundo Plano e Desempenho	Jen
15	Jogo Espacial	Desenvolvimento de Jogos Mais Avançado com JavaScript	Aprenda sobre Herança usando Classes e Composição e o padrão Pub/Sub, em preparação para construir um jogo	Introdução ao Desenvolvimento de Jogos Avançado	Chris
16	Jogo Espacial	Desenhando no Canvas	Aprenda sobre a API Canvas, usada para desenhar elementos na tela	Desenhando no Canvas	Chris
17	Jogo Espacial	Movendo elementos pela tela	Descubra como os elementos podem ganhar movimento usando coordenadas cartesianas e a API Canvas	Movendo Elementos	Chris
18	Jogo Espacial	Detecção de Colisões	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ões	Chris
19	Jogo Espacial	Mantendo a Pontuação	Realize cálculos matemáticos com base no status e desempenho do jogo	Mantendo a Pontuação	Chris
20	Jogo Espacial	Finalizando e Reiniciando 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	Aplicação Bancária	Templates HTML e Rotas em uma Aplicação Web	Aprenda como criar a estrutura de arquitetura de um site multipágina usando rotas e templates HTML	Templates HTML e Rotas	Yohan
22	Aplicação Bancária	Construindo um Formulário de Login e Registro	Aprenda sobre como construir formulários e lidar com rotinas de validação	Formulários	Yohan
23	Aplicação Bancária	Métodos de Busca e Uso de Dados	Como os dados fluem para dentro e fora da sua aplicação, como buscá-los, armazená-los e descartá-los	Dados	Yohan
24	Aplicação Bancária	Conceitos de Gestão de Estado	Aprenda como sua aplicação mantém o estado e como gerenciá-lo programaticamente	Gestão de Estado	Yohan
25	Editor de Código Browser/VScode	Trabalhando com VScode	Aprenda a usar um editor de código	Usando o Editor de Código VScode	Chris
26	Assistentes de IA	Trabalhando com IA	Aprenda a construir seu próprio assistente de IA	Projeto de Assistente de IA	Chris

🏫 Pedagogia

O nosso currículo foi projetado com dois princípios pedagógicos fundamentais em mente:

• 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 usadas pelos desenvolvedores web de hoje. Os alunos terão a oportunidade de desenvolver experiência prática ao construir 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 fazer as primeiras lições deste currículo como um Caminho de Aprendizagem 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 "Série para Iniciantes: JavaScript", cujos autores contribuíram para este currículo.

Além disso, um questionário de baixo risco antes de uma aula define a intenção do aluno em aprender um tópico, enquanto um segundo questionário após a aula garante uma 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 concentrar-nos 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: "Série para Iniciantes: Node.js".

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

🧭 Acesso offline

Pode executar esta documentação offline usando 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:

• MCP para Iniciantes
• Edge AI para Iniciantes
• Agentes de IA para Iniciantes
• IA Generativa para Iniciantes .NET
• IA Generativa com JavaScript
• IA Generativa com Java
• IA para Iniciantes
• Ciência de Dados para Iniciantes
• ML para Iniciantes
• Cibersegurança para Iniciantes
• Desenvolvimento Web para Iniciantes
• IoT para Iniciantes
• Desenvolvimento XR para Iniciantes
• Dominar o GitHub Copilot para Uso Agente
• Dominar o GitHub Copilot para Programadores C#/.NET
• Escolhe a Tua Própria Aventura com Copilot

Obter Ajuda

Se tiveres dúvidas ou perguntas sobre como criar aplicações de IA, junta-te a:

Se tiveres feedback sobre o produto ou erros durante o desenvolvimento, visita:

Licença

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

---

Aviso:
Este documento foi traduzido utilizando o serviço de tradução por IA Co-op Translator. Embora nos esforcemos para garantir a precisão, é importante notar que traduções automáticas podem conter erros ou imprecisões. O documento original na sua língua nativa deve ser considerado a fonte autoritária. Para informações críticas, recomenda-se a tradução profissional realizada por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas decorrentes da utilização desta tradução.