[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
ਸਭ ਪਾਠਾਂ ਦੀ ਇੱਕ PDF [ਇਥੇ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) ਮਿਲ ਸਕਦੀ ਹੈ।
ਸਾਰੇ ਪਾਠਾਂ ਦੀ PDF ਤੁਸੀਂ [ਇਥੇ](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf) ਲੱਭ ਸਕਦੇ ਹੋ।
## 🎒 ਹੋਰ ਕੋਰਸ
ਸਾਡੀ ਟੀਮ ਹੋਰ ਕੋਰਸ ਤਿਆਰ ਕਰਦੀ ਹੈ! ਦੇਖੋ:
ਸਾਡੀ ਟੀਮ ਹੋਰ ਕੋਰਸ ਵੀ ਬਣਾਉਂਦੀ ਹੈ! ਚੈੱਕ ਕਰੋ:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
@ -241,7 +240,7 @@
---
### Core Learning
### ਕੋਰ ਸਿੱਖਿਆ
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
@ -252,29 +251,25 @@
---
### Copilot Series
### ਕੋਪਾਇਲਟ ਸੀਰੀਜ਼
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
Este é um repositório de currículo educacional para ensinar fundamentos de desenvolvimento web para iniciantes. O currículo é um curso abrangente de 12 semanas desenvolvido pelos Microsoft Cloud Advocates, contendo 24 aulas práticas com JavaScript, CSS e HTML.
Este é um repositório educacional para ensinar fundamentos de desenvolvimento web para iniciantes. O currículo é um curso completo de 12 semanas desenvolvido pelos Microsoft Cloud Advocates, com 24 aulas práticas cobrindo JavaScript, CSS e HTML.
### Componentes Principais
- **Conteúdo Educacional**: 24 aulas estruturadas organizadas em módulos baseados em projetos
- **Projetos Práticos**: Terrarium, Jogo de Digitação, Extensão de Navegador, Jogo Espacial, Aplicativo Bancário, Editor de Código e Assistente de Chat com IA
- **Quizzes Interativos**: 48 quizzes com 3 perguntas cada (avaliações pré e pós-aula)
- **Suporte Multilíngue**: Traduções automáticas para mais de 50 idiomas via GitHub Actions
- **Questionários Interativos**: 48 questionários com 3 perguntas cada (avaliações pré/pós-aula)
- **Suporte Multilíngue**: Traduções automatizadas para mais de 50 idiomas via GitHub Actions
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recomendado para aprendizes
- [Módulos Microsoft Learn](https://docs.microsoft.com/learn/)
- [Recursos do Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recomendado para estudantes
- Cursos adicionais: AI Generativa, Ciência de Dados, ML, IoT disponíveis
### Trabalhando com Projetos Específicos
Para instruções detalhadas sobre projetos individuais, consulte os arquivos README em:
- `quiz-app/README.md` - Aplicação de quiz em Vue 3
- `7-bank-project/README.md` - Aplicativo bancário com autenticação
- `5-browser-extension/README.md` - Desenvolvimento de extensão de navegador
- `6-space-game/README.md` - Desenvolvimento de jogo baseado em canvas
- `9-chat-project/README.md` - Projeto de assistente de chat com IA
- `quiz-app/README.md` - aplicação de quiz Vue 3
- `7-bank-project/README.md` - aplicativo bancário com autenticação
- `5-browser-extension/README.md` - desenvolvimento de extensão de navegador
- `6-space-game/README.md` - desenvolvimento de jogo baseado em canvas
- `9-chat-project/README.md` - projeto assistente de chat com IA
### Estrutura Monorepo
Embora não seja um monorepo tradicional, este repositório contém múltiplos projetos independentes:
- Cada aula é autocontida
- Cada aula é autossuficiente
- Projetos não compartilham dependências
- Trabalhe em projetos individuais sem afetar outros
- Clone o repositório inteiro para a experiência completa do currículo
- Clone o repositório completo para a experiência do curso completo
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Aviso Legal**:
Este documento foi traduzido utilizando o serviço de tradução por IA [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos empenhemos pela precisão, esteja ciente de que traduções automáticas podem conter erros ou imprecisões. O documento original em sua língua nativa deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se tradução profissional feita por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações equivocadas decorrentes do uso desta tradução.
Este documento foi traduzido usando o serviço de tradução por IA [Co-op Translator](https://github.com/Azure/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 em seu idioma nativo deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se a tradução profissional humana. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas decorrentes do uso desta tradução.
# Desenvolvimento Web para Iniciantes - Um Currículo
Aprenda os fundamentos do desenvolvimento web com nosso curso abrangente de 12 semanas ministrado pelos Microsoft Cloud Advocates. Cada uma das 24 aulas mergulha em JavaScript, CSS e HTML por meio de projetos práticos como terrários, extensões de navegador e jogos espaciais. Participe de quizzes, discussões e tarefas práticas. Aprimore suas habilidades e otimize a retenção do conhecimento com nossa eficaz pedagogia baseada em projetos. Comece sua jornada de programação hoje!
Aprenda os fundamentos do desenvolvimento web com nosso curso abrangente de 12 semanas ministrado pelos Advocates da Microsoft Cloud. Cada uma das 24 aulas explora JavaScript, CSS e HTML por meio de projetos práticos como terrários, extensões de navegador e jogos espaciais. Envolva-se com quizzes, discussões e tarefas práticas. Aprimore suas habilidades e otimize a retenção de conhecimento com nossa pedagógica eficaz baseada em projetos. Comece sua jornada de programação hoje!
Participe da Comunidade Azure AI Foundry no Discord
Siga estas etapas para começar a usar esses recursos:
Siga estes passos para começar a usar esses recursos:
1. **Faça um Fork do Repositório**: Clique em [](https://GitHub.com/microsoft/Web-Dev-For-Beginners/fork)
2. **Clone o Repositório**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
3. [**Junte-se ao Azure AI Foundry no Discord e conheça especialistas e outros desenvolvedores**](https://discord.com/invite/ByRwuEEgH4)
3. [**Participe do Discord Azure AI Foundry e conheça especialistas e outros desenvolvedores**](https://discord.com/invite/ByRwuEEgH4)
### 🌐 Suporte a Múltiplos Idiomas
### 🌐 Suporte Multilíngue
#### Suportado via GitHub Action (Automatizado & Sempre Atualizado)
> Este repositório contém mais de 50 traduções de idiomas que aumentam significativamente o tamanho do download. Para clonar sem traduções, use sparse checkout:
> Este repositório inclui mais de 50 traduções de idiomas, o que aumenta significativamente o tamanho do download. Para clonar sem as traduções, use sparse checkout:
>
> **Bash / macOS / Linux:**
> ```bash
@ -48,26 +48,26 @@ Siga estas etapas para começar a usar esses recursos:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> Isso fornece tudo o que você precisa para completar o curso com um download muito mais rápido.
> Isso fornece tudo que você precisa para completar o curso com um download muito mais rápido.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Se você deseja que línguas adicionais sejam suportadas, elas estão listadas [aqui](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**Se desejar que línguas adicionais sejam suportadas, elas estão listadas [aqui](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _Você é estudante?_
Visite a [**página Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) onde você encontrará recursos para iniciantes, pacotes para estudantes e até formas de obter um voucher de certificado gratuito. Esta é a página que você deve adicionar aos favoritos e consultar de tempos em tempos, pois atualizamos o conteúdo mensalmente.
Visite a [**página Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) onde você encontrará recursos para iniciantes, pacotes estudantis e até maneiras de obter um voucher gratuito para certificação. Esta é a página que você deve salvar nos favoritos e consultar de tempos em tempos, pois o conteúdo é atualizado mensalmente.
### 📣 Anúncio - Novos desafios no modo GitHub Copilot Agent para completar!
### 📣 Anúncio - Novos desafios do modo GitHub Copilot Agent para completar!
Novo desafio adicionado, procure por "GitHub Copilot Agent Challenge 🚀" na maioria dos capítulos. Este é um novo desafio para você completar usando GitHub Copilot e o modo Agent. Se você nunca usou o modo Agent, ele é capaz não apenas de gerar texto, mas também criar e editar arquivos, executar comandos e muito mais.
Novo desafio adicionado, procure por "GitHub Copilot Agent Challenge 🚀" na maioria dos capítulos. É um novo desafio para você completar usando o GitHub Copilot e o modo Agent. Se você nunca usou o modo Agent antes, ele é capaz não apenas de gerar texto, mas também criar e editar arquivos, executar comandos e muito mais.
### 📣 Anúncio - _Novo Projeto para construir usando IA Generativa_
Novo projeto de Assistente de IA adicionado, confira o [projeto](./9-chat-project/README.md)
Novo projeto Assistente de IA adicionado, confira o [projeto](./9-chat-project/README.md)
### 📣 Anúncio - _Novo Currículo_ sobre IA Generativa para JavaScript foi lançado
### 📣 Anúncio - _Novo Currículo_ sobre IA Generativa para JavaScript acaba de ser lançado
Não perca nosso novo currículo de IA Generativa!
@ -75,17 +75,17 @@ Visite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para com
Cada aula inclui uma tarefa para completar, um teste de conhecimento e um desafio para guiar você em temas como:
Cada aula inclui uma tarefa para completar, uma verificação de conhecimento e um desafio para orientar você em tópicos como:
- Prompting e engenharia de prompt
- Geração de apps de texto e imagem
- Apps de busca
- Geração de aplicativos de texto e imagem
- Aplicativos de busca
Visite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para começar!
@ -93,20 +93,20 @@ Visite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para com
## 🌱 Começando
> **Professores**, incluímos [algumas sugestões](for-teachers.md) de como usar este currículo. Adoraríamos seu feedback [em nosso fórum de discussões](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
> **Professores**, incluímos [algumas sugestões](for-teachers.md) sobre como usar este currículo. Adoraríamos seu feedback [em nosso fórum de discussões](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Alunos](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, para cada aula, comece com um quiz pré-aula e siga com a leitura do material da aula, completando as diversas atividades e verifique seu entendimento com o quiz pós-aula.
**[Alunos](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, para cada aula, comece com um quiz pré-aula e continue lendo o material da aula, completando as várias atividades e verificando seu entendimento com o quiz pós-aula.
Para aprimorar sua experiência de aprendizado, conecte-se com seus colegas para trabalhar nos projetos juntos! Discussões são incentivadas em nosso [fórum de discussões](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) onde nossa equipe de moderadores estará disponível para responder suas perguntas.
Para aprimorar sua experiência de aprendizado, conecte-se com seus colegas para trabalharem juntos nos projetos! Discussões são incentivadas em nosso [fórum de discussões](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) onde nossa equipe de moderadores estará disponível para responder suas perguntas.
Para avançar em seus estudos, recomendamos fortemente explorar [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) para materiais de estudo adicionais.
Para aprofundar sua educação, recomendamos fortemente explorar o [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) para materiais adicionais de estudo.
### 📋 Configurando seu ambiente
Este currículo já possui um ambiente de desenvolvimento pronto para usar! Ao começar, você pode optar por executar o currículo em um [Codespace](https://github.com/features/codespaces/) (_um ambiente baseado em navegador, sem necessidade de instalação_), ou localmente em seu computador usando um editor de texto como [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
Este currículo já possui um ambiente de desenvolvimento pronto para uso! Ao começar, você pode escolher executar o currículo em um [Codespace](https://github.com/features/codespaces/) (_um ambiente baseado em navegador, sem necessidade de instalações_), ou localmente em seu computador usando um editor de texto como o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Crie seu repositório
Para que você possa salvar seu trabalho facilmente, é recomendado que crie sua própria cópia deste repositório. Você pode fazer isso clicando no botão **Use this template** no topo da página. Isso criará um novo repositório em sua conta do GitHub com uma cópia do currículo.
Para facilitar o salvamento do seu trabalho, recomenda-se criar sua própria cópia deste repositório. Você pode fazer isso clicando no botão **Use this template** no topo da página. Isso criará um novo repositório em sua conta do GitHub com uma cópia do currículo.
Siga estes passos:
1. **Faça um Fork do Repositório**: Clique no botão "Fork" no canto superior direito desta página.
@ -120,10 +120,10 @@ Na sua cópia deste repositório que você criou, clique no botão **Code** e se
#### Executando o currículo localmente no seu computador
Para executar este currículo localmente no seu computador, você precisará de um editor de texto, um navegador e uma ferramenta de linha de comando. Nossa primeira aula, [Introdução a Linguagens de Programação e Ferramentas do Ofício](../../1-getting-started-lessons/1-intro-to-programming-languages), orientará você por várias opções para cada uma dessas ferramentas para você escolher o que melhor funciona para você.
Para executar este currículo localmente no seu computador, você precisará de um editor de texto, um navegador e uma ferramenta de linha de comando. Nossa primeira aula, [Introdução às Linguagens de Programação e Ferramentas do Ofício](../../1-getting-started-lessons/1-intro-to-programming-languages), apresentará várias opções para cada uma dessas ferramentas para você escolher a que melhor funciona para você.
Nossa recomendação é usar o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) como seu editor, que também possui um [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) embutido. Você pode baixar o Visual Studio Code [aqui](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Clone o seu repositório para o seu computador. Você pode fazer isso clicando no botão **Code** e copiando a URL:
Nossa recomendação é usar o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) como seu editor, que também possui um [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) integrado. Você pode baixar o Visual Studio Code [aqui](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Clone seu repositório para o seu computador. Você pode fazer isso clicando no botão **Code** e copiando a URL:
[CodeSpace](./images/createcodespace.png)
@ -133,81 +133,82 @@ Nossa recomendação é usar o [Visual Studio Code](https://code.visualstudio.co
git clone <your-repository-url>
```
2. Abra a pasta no Visual Studio Code. Você pode fazer isso clicando em **File** > **Open Folder** e selecionando a pasta que acabou de clonar.
2. Abra a pasta no Visual Studio Code. Você pode fazer isso clicando em **File** > **Open Folder** e selecionando a pasta que você acabou de clonar.
> Extensões recomendadas para Visual Studio Code:
> Extensões recomendadas para o Visual Studio Code:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - para pré-visualizar páginas HTML dentro do Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - para ajudar você a escrever código mais rápido
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - para ajudar a escrever código mais rápido
## 📂 Cada aula inclui:
## 📂 Cada lição inclui:
- sketchnote opcional
- vídeo suplementar opcional
- quiz de aquecimento pré-aula
- aula escrita
- para aulas baseadas em projeto, guias passo a passo sobre como construir o projeto
- verificações de conhecimento
- quiz de aquecimento pré-licão
- lição escrita
- para lições baseadas em projeto, guias passo a passo sobre como construir o projeto
> **Uma nota sobre quizzes**: Todos os quizzes estão contidos na pasta Quiz-app, totalizando 48 quizzes com três perguntas cada. Eles estão disponíveis [aqui](https://ff-quizzes.netlify.app/web/). O aplicativo de quiz pode ser executado localmente ou implantado no Azure; siga as instruções na pasta `quiz-app`.
## 🗃️ Aulas
| | Nome do Projeto | Conceitos Ensinados | Objetivos de Aprendizagem | Aula Correspondente | Autor |
| 01 | Começando | Introdução à Programação e Ferramentas da Área | Aprender os fundamentos básicos por trás da maioria das linguagens de programação e sobre softwares que ajudam desenvolvedores profissionais | [Introdução a Linguagens de Programação e Ferramentas da Área](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Começando | Noções básicas de GitHub, incluindo trabalho em equipe | Como usar o GitHub em seu projeto, como colaborar com outros em uma base de código | [Introdução ao GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Começando | Acessibilidade | Aprender o básico sobre acessibilidade na web | [Fundamentos de Acessibilidade](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Fundamentos de JS | Tipos de Dados em JavaScript | O básico sobre tipos de dados em JavaScript | [Tipos de Dados](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Fundamentos de JS | Funções e Métodos | Aprender sobre funções e métodos para gerenciar o fluxo lógico de uma aplicação | [Funções e Métodos](./2-js-basics/2-functions-methods/README.md) | Jasmine e Christopher |
| 06 | Fundamentos de JS | Tomando Decisões com JS | Aprender como criar condições no código usando métodos de tomada de decisão | [Tomando Decisões](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Fundamentos de JS | Arrays e Loops | Trabalhar com dados usando arrays e loops em JavaScript | [Arrays e Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrário](./3-terrarium/solution/README.md) | HTML na Prática | Construir o HTML para criar um terrário online, com foco em construção de layout | [Introdução ao HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrário](./3-terrarium/solution/README.md) | CSS na Prática | Construir o CSS para estilizar o terrário online, focando no básico do CSS, incluindo tornar a página responsiva | [Introdução ao CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrário](./3-terrarium/solution/README.md) | Closures em JavaScript, manipulação do DOM | Construir o JavaScript para fazer o terrário funcionar como uma interface drag/drop, focando em closures e manipulação do DOM | [Closures em JavaScript, manipulação do DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Jogo de Digitação](./4-typing-game/solution/README.md) | Construindo um Jogo de Digitação | Aprender a usar eventos de teclado para controlar a lógica do seu aplicativo em JavaScript | [Programação Orientada a Eventos](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Extensão Verde para Navegador](./5-browser-extension/solution/README.md) | Trabalhando com Navegadores | Aprender como os navegadores funcionam, sua história e como estruturar os primeiros elementos de uma extensão de navegador | [Sobre Navegadores](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Extensão Verde para Navegador](./5-browser-extension/solution/README.md) | Construindo um formulário, chamando uma API e armazenando variáveis no armazenamento local | Construir 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](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Extensão Verde para Navegador](./5-browser-extension/solution/README.md) | Processos em segundo plano no navegador, desempenho da web | Usar os processos em segundo plano do navegador para gerenciar o ícone da extensão; aprender sobre desempenho web e algumas otimizações | [Tarefas em Segundo Plano e Desempenho](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Jogo Espacial](./6-space-game/solution/README.md) | Desenvolvimento de Jogos mais Avançado com JavaScript | Aprender 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 Avançado de Jogos](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Jogo Espacial](./6-space-game/solution/README.md) | Desenhando na tela | Aprender sobre a API Canvas, usada para desenhar elementos na tela | [Desenhando na Tela](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Jogo Espacial](./6-space-game/solution/README.md) | Movendo elementos na tela | Descobrir como elementos podem ganhar movimento usando coordenadas cartesianas e a API Canvas | [Movendo Elementos na Tela](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Jogo Espacial](./6-space-game/solution/README.md) | Detecção de colisões | Fazer elementos colidirem e reagirem uns aos outros usando pressionamentos de tecla e fornecer uma função cooldown para garantir desempenho | [Detecção de Colisões](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Jogo Espacial](./6-space-game/solution/README.md) | Manter a pontuação | Realizar cálculos matemáticos com base no status e desempenho do jogo | [Mantendo a Pontuação](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Jogo Espacial](./6-space-game/solution/README.md) | Encerrar e reiniciar o jogo | Aprender sobre encerrar e reiniciar o jogo, incluindo limpeza de ativos e reinicialização de valores das variáveis | [Condição de Encerramento](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Aplicativo Bancário](./7-bank-project/solution/README.md) | Templates HTML e Rotas em um Aplicativo Web | Aprender a criar a estrutura arquitetônica de um site multipágina usando roteamento e templates HTML | [Templates HTML e Rotas](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Aplicativo Bancário](./7-bank-project/solution/README.md) | Construir Formulário de Login e Registro | Aprender sobre construção de formulários e rotinas de validação | [Formulários](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Aplicativo Bancário](./7-bank-project/solution/README.md) | Métodos de Obtenção e Uso de Dados | Como os dados fluem dentro e fora do seu app, como buscá-los, armazená-los e descartá-los| [Dados](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Aplicativo Bancário](./7-bank-project/solution/README.md) | Conceitos de Gerenciamento de Estado | Aprender como seu aplicativo retém o estado e como gerenciá-lo programaticamente | [Gerenciamento de Estado](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Código Browser/VScode](../../8-code-editor) | Trabalhando com VScode | Aprender a usar um editor de código | [Usar Editor de Código VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [Assistentes de IA](./9-chat-project/README.md) | Trabalhando com IA | Aprender a construir seu próprio assistente de IA | [Projeto Assistente de IA](./9-chat-project/README.md) | Chris |
> **Uma nota sobre quizzes**: Todos os quizzes estão contidos na pasta Quiz-app, totalizando 48 quizzes com três perguntas cada. Eles estão disponíveis [aqui](https://ff-quizzes.netlify.app/web/); o aplicativo de quiz pode ser executado localmente ou implantado 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 | Getting Started | Introdução à Programação e Ferramentas do Ofício | Aprender os fundamentos básicos por trás da maioria das linguagens de programação e sobre software que ajuda desenvolvedores profissionais | [Intro to Programming Languages and Tools of the Trade](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Getting Started | Noções básicas do GitHub, inclui trabalho em equipe | Como usar o GitHub em seu projeto, como colaborar com outros em uma base de código | [Intro to GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | Acessibilidade | Aprender o básico sobre acessibilidade web | [Accessibility Fundamentals](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | Tipos de Dados em JavaScript | Os fundamentos dos tipos de dados em JavaScript | [Data Types](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Basics | Funções e Métodos | Aprender sobre funções e métodos para gerenciar o fluxo lógico de uma aplicação | [Functions and Methods](./2-js-basics/2-functions-methods/README.md) | Jasmine e Christopher |
| 06 | JS Basics | Tomando Decisões com JS | Aprender como criar condições no seu código usando métodos de tomada de decisão | [Making Decisions](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Basics | Arrays e Loops | Trabalhar com dados usando arrays e loops em JavaScript | [Arrays and Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML na Prática | Construir o HTML para criar um terrário online, focando na construção de um layout | [Introduction to HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS na Prática | Criar o CSS para estilizar o terrário online, focando no básico do CSS, incluindo tornar a página responsiva | [Introduction to CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | Closures em JavaScript, manipulação do DOM | Construir o JavaScript para fazer o terrário funcionar como uma interface de arrastar e soltar, focando em closures e manipulação do DOM | [JavaScript Closures, DOM manipulation](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Construindo um Jogo de Digitação | Aprender a usar eventos do teclado para conduzir a lógica do seu app em JavaScript | [Event-Driven Programming](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Trabalhando com Navegadores | Aprender como os navegadores funcionam, sua história e como estruturar os primeiros elementos de uma extensão de navegador | [About Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Construindo um formulário, chamada a uma API e armazenamento local | Construir os elementos em JavaScript da sua extensão para navegador para chamar uma API usando variáveis armazenadas localmente | [APIs, Forms, and Local Storage](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Green Browser Extension](./5-browser-extension/solution/README.md) | Processos em segundo plano no navegador, desempenho web | Usar processos em segundo plano do navegador para gerenciar o ícone da extensão; aprender sobre desempenho web e algumas otimizações para melhorar | [Background Tasks and Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Space Game](./6-space-game/solution/README.md) | Desenvolvimento de Jogos Mais Avançado com JavaScript | Aprender sobre Herança usando Classes e Composição e o padrão Pub/Sub, preparando para construir um jogo | [Introduction to Advanced Game Development](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Space Game](./6-space-game/solution/README.md) | Desenho no canvas | Aprender sobre a API Canvas, usada para desenhar elementos na tela | [Drawing to Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Space Game](./6-space-game/solution/README.md) | Movendo elementos na tela | Descobrir como elementos podem se mover usando coordenadas cartesianas e a API Canvas | [Moving Elements Around](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Space Game](./6-space-game/solution/README.md) | Detecção de colisões | Fazer elementos colidirem e reagirem uns aos outros usando pressionamento de teclas e fornecer uma função cooldown para garantir o desempenho do jogo | [Collision Detection](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Space Game](./6-space-game/solution/README.md) | Mantendo a pontuação | Realizar cálculos matemáticos baseados no status e desempenho do jogo | [Keeping Score](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Space Game](./6-space-game/solution/README.md) | Finalizando e reiniciando o jogo | Aprender sobre encerrar e reiniciar o jogo, incluindo limpar ativos e redefinir valores de variáveis | [The Ending Condition](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [Banking App](./7-bank-project/solution/README.md) | Templates HTML e Rotas em um App Web | Aprender a criar a estrutura arquitetural de um website multipáginas usando roteamento e templates HTML | [HTML Templates and Routes](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [Banking App](./7-bank-project/solution/README.md) | Construir um Formulário de Login e Registro | Aprender sobre construção de formulários e rotinas de validação | [Forms](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [Banking App](./7-bank-project/solution/README.md) | Métodos para Buscar e Usar Dados | Como os dados fluem para dentro e fora do seu app, como buscá-los, armazená-los e descartá-los | [Data](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [Banking App](./7-bank-project/solution/README.md) | Conceitos de Gerenciamento de Estado | Aprender como seu app mantém o estado e como gerenciá-lo programaticamente | [State Management](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Browser/VScode Code](../../8-code-editor) | Trabalhando com VScode | Aprender a usar um editor de código | [Use VScode Code Editor](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [AI Assistants](./9-chat-project/README.md) | Trabalhando com IA | Aprender a construir seu próprio assistente de IA | [AI Assistant project](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogia
Nosso currículo é projetado com dois princípios pedagógicos-chave:
Nosso currículo é projetado com dois princípios pedagógicos principais em mente:
* aprendizagem baseada em projetos
* quizzes frequentes
O programa ensina os fundamentos de JavaScript, HTML e CSS, assim como as ferramentas e técnicas mais recentes usadas pelos desenvolvedores web hoje. Os estudantes terão a oportunidade de adquirir experiência prática construindo um jogo de digitação, um terrário virtual, uma extensão de navegador ecológica, um jogo estilo invasores espaciais e um aplicativo bancário para negócios. Ao final da série, os alunos terão uma compreensão sólida do desenvolvimento web.
O programa ensina os fundamentos de JavaScript, HTML e CSS, bem como as ferramentas e técnicas mais recentes usadas pelos desenvolvedores web atuais. Os alunos terão a oportunidade de adquirir experiência prática construindo um jogo de digitação, terrário virtual, extensão de navegador ecológica, jogo no estilo space-invader e um aplicativo bancário para empresas. Ao final da série, os alunos terão uma sólida compreensão do desenvolvimento web.
> 🎓 Você pode realizar as primeiras aulas deste currículo como um [Caminho de Aprendizagem](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) no Microsoft Learn!
> 🎓 Você pode fazer as primeiras aulas deste currículo como um [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) no Microsoft Learn!
Ao garantir que o conteúdo esteja alinhado a projetos, o processo se torna mais envolvente para os alunos e a retenção de conceitos será aprimorada. Também escrevemos várias aulas iniciais sobre os fundamentos de JavaScript para introduzir conceitos, acompanhadas de um vídeo da coleção "[Série para Iniciantes em: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", alguns dos quais tiveram autores que contribuíram com este currículo.
Ao garantir que o conteúdo esteja alinhado com 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 iniciais sobre conceitos básicos de JavaScript para introduzir conceitos, combinadas com um vídeo da coleção de tutoriais em vídeo "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", alguns dos autores dos quais contribuíram para este currículo.
Além disso, um quiz de baixa pressão antes da aula define a intenção do aluno em aprender um tópico, enquanto um segundo quiz após a aula assegura retenção adicional. Este currículo foi projetado para ser flexível e divertido, podendo ser realizado na íntegra ou em partes. Os projetos começam pequenos e se tornam progressivamente mais complexos ao longo do ciclo de 12 semanas.
Além disso, um quiz de baixo impacto antes da aula define a intenção do aluno em aprender um tema, enquanto um segundo quiz após a aula assegura maior retenção. Este currículo foi projetado para ser flexível e divertido e pode ser feito inteiro ou em partes. Os projetos começam pequenos e tornam-se progressivamente mais complexos ao longo do ciclo de 12 semanas.
Embora tenhamos evitado propositalmente introduzir frameworks JavaScript para concentrar nas habilidades básicas necessárias para um desenvolvedor web antes de adotar um framework, um próximo passo adequado para completar este currículo seria aprender sobre Node.js por meio de outra coleção de vídeos: "[Série para Iniciantes em: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Embora tenhamos evitado propositalmente a introdução de frameworks JavaScript para concentrar-se nas habilidades básicas necessárias para um desenvolvedor web antes de adotar um framework, um próximo passo interessante para completar este currículo seria aprender sobre Node.js por meio de outra coleção de vídeos: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Visite nosso [Código de Conduta](CODE_OF_CONDUCT.md) e as diretrizes de [Contribuição](CONTRIBUTING.md). Agradecemos seu feedback construtivo!
> Visite nossas diretrizes de [Código de Conduta](CODE_OF_CONDUCT.md) e [Contribuição](CONTRIBUTING.md). Agradecemos seu feedback construtivo!
## 🧭 Acesso offline
Você pode executar esta documentação offline usando [Docsify](https://docsify.js.org/#/). Faça um fork deste repositório, [instale o Docsify](https://docsify.js.org/#/quickstart) em sua máquina local e então na pasta raiz deste repositório digite `docsify serve`. O site será servido na porta 3000 no seu localhost: `localhost:3000`.
## 🧭 Acesso Offline
Você pode executar esta documentação offline usando o [Docsify](https://docsify.js.org/#/). Faça um fork deste repositório, [instale o Docsify](https://docsify.js.org/#/quickstart) em sua máquina local e então, 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](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
@ -224,7 +225,7 @@ Nossa equipe produz outros cursos! Confira:
[](https://github.com/microsoft/langchain-for-beginners?WT.mc_id=m365-94501-dwahlin)
---
### Azure / Edge / MCP / Agents
### Azure / Edge / MCP / Agentes
[](https://github.com/microsoft/AZD-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/edgeai-for-beginners?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mcp-for-beginners?WT.mc_id=academic-105485-koreyst)
@ -240,7 +241,7 @@ Nossa equipe produz outros cursos! Confira:
---
### Aprendizado Básico
### Aprendizado Fundamental
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
@ -252,20 +253,20 @@ Nossa equipe produz outros cursos! Confira:
---
### Série Copilot
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/GitHubCopilotAI?WT.mc_id=academic-105485-koreyst)
[](https://github.com/microsoft/mastering-github-copilot-for-dotnet-csharp-developers?WT.mc_id=academic-105485-koreyst)
Se você ficar travado ou tiver alguma dúvida sobre como criar aplicativos de IA, junte-se a outros alunos e desenvolvedores experientes em discussões sobre MCP. É uma comunidade acolhedora onde perguntas são bem-vindas e o conhecimento é compartilhado livremente.
Se você ficar travado ou tiver dúvidas sobre como construir aplicativos de IA, junte-se a outros aprendizes e desenvolvedores experientes em discussões sobre MCP. É uma comunidade receptiva onde perguntas são bem-vindas e o conhecimento é compartilhado livremente.
[](https://aka.ms/foundry/forum)
## Licença
@ -274,6 +275,6 @@ Este repositório está licenciado sob a licença MIT. Veja o arquivo [LICENSE](
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Aviso Legal**:
Este documento foi traduzido utilizando o serviço de tradução automática [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos esforcemos pela precisão, esteja ciente de que traduções automáticas podem conter erros ou imprecisões. O documento original, em sua língua nativa, deve ser considerado a fonte autoritária. Para informações críticas, recomenda-se tradução profissional humana. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas decorrentes do uso desta tradução.
**Aviso Legal**:
Este documento foi traduzido usando o serviço de tradução por IA [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos esforcemos para garantir a precisão, por favor, esteja ciente de que traduções automatizadas podem conter erros ou imprecisões. O documento original em seu idioma nativo deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se tradução profissional feita por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas decorrentes do uso desta tradução.
Este é um repositório de currículo educacional para ensinar os fundamentos do desenvolvimento web a iniciantes. O currículo é um curso abrangente de 12 semanas desenvolvido pelos Microsoft Cloud Advocates, com 24 aulas práticas que abrangem JavaScript, CSS e HTML.
Este é um repositório de currículo educativo para ensinar os fundamentos do desenvolvimento web a iniciantes. O currículo é um curso abrangente de 12 semanas desenvolvido pelos Microsoft Cloud Advocates, com 24 lições práticas que cobrem JavaScript, CSS e HTML.
### Componentes Principais
- **Conteúdo Educacional**: 24 lições estruturadas organizadas em módulos baseados em projetos
- **Projetos Práticos**: Terrário, Jogo de Digitação, Extensão de Navegador, Jogo Espacial, Aplicação Bancária, Editor de Código e Assistente de Chat AI
- **Questionários Interativos**: 48 questionários com 3 perguntas cada (avaliações pré e pós aula)
- **Suporte Multilíngue**: Traduções automáticas para mais de 50 idiomas através do GitHub Actions
- **Conteúdo Educativo**: 24 lições estruturadas organizadas em módulos baseados em projetos
- **Projetos Práticos**: Terrário, Jogo de Digitação, Extensão de Navegador, Jogo Espacial, Aplicação Bancária, Editor de Código e Assistente de Chat de IA
- **Questionários Interativos**: 48 questionários com 3 perguntas cada (avaliações pré e pós-lição)
- **Suporte Multilíngue**: Traduções automáticas para mais de 50 idiomas via GitHub Actions
- [Recursos do Student Hub](https://docs.microsoft.com/learn/student-hub/)
- [GitHub Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot) recomendado para aprendizes
- Cursos adicionais: AI Generativa, Ciência de Dados, ML, currículos IoT disponíveis
- Cursos adicionais: Currículos de IA Generativa, Ciência de Dados, ML, IoT disponíveis
### Trabalhar com Projetos Específicos
Para instruções detalhadas sobre projetos individuais, consulte os arquivos README em:
Para instruções detalhadas sobre projetos individuais, consulte os ficheiros README em:
- `quiz-app/README.md` - Aplicação de quiz Vue 3
- `7-bank-project/README.md` - Aplicação bancária com autenticação
- `5-browser-extension/README.md` - Desenvolvimento de extensão de navegador
- `6-space-game/README.md` - Desenvolvimento de jogo baseado em Canvas
- `9-chat-project/README.md` - Projeto de assistente de chat AI
- `6-space-game/README.md` - Desenvolvimento de jogo em Canvas
- `9-chat-project/README.md` - Projeto assistente de chat IA
### Estrutura Monorepo
@ -398,11 +398,11 @@ Embora não seja um monorepo tradicional, este repositório contém múltiplos p
- Cada lição é autónoma
- Projetos não partilham dependências
- Trabalhe em projetos individuais sem afetar os outros
- Clone o repositório completo para a experiência do currículo completo
- Clone o repositório completo para a experiência total do currículo
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Aviso Legal**:
Este documento foi traduzido utilizando o serviço de tradução automática [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos esforcemos pela precisão, por favor esteja ciente de que traduções automáticas podem conter erros ou imprecisões. O documento original, na sua língua nativa, deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se tradução profissional humana. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações erradas resultantes do uso desta tradução.
Este documento foi traduzido utilizando o serviço de tradução automática [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos esforcemos pela precisão, esteja ciente de que traduções automáticas podem conter erros ou imprecisões. O documento original na sua língua nativa deve ser considerado a fonte autoritativa. Para informações críticas, recomenda-se a tradução profissional por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações erradas decorrentes do uso desta tradução.
# Desenvolvimento Web para Iniciantes - Um Currículo
Aprenda os fundamentos do desenvolvimento web com o nosso curso abrangente de 12 semanas pelos Microsoft Cloud Advocates. Cada uma das 24 aulas mergulha em JavaScript, CSS e HTML através de projetos práticos como terrários, extensões de navegador e jogos espaciais. Participe em questionários, discussões e tarefas práticas. Melhore as suas competências e otimize a retenção do seu conhecimento com a nossa pedagógica eficaz baseada em projetos. Comece hoje mesmo a sua jornada de programação!
Aprende os fundamentos do desenvolvimento web com o nosso curso abrangente de 12 semanas pelos Microsoft Cloud Advocates. Cada uma das 24 lições aprofunda JavaScript, CSS e HTML através de projetos práticos como terrários, extensões de navegador e jogos espaciais. Participa em questionários, discussões e tarefas práticas. Melhora as tuas competências e otimiza a tua retenção de conhecimento com a nossa pedagógica eficaz baseada em projetos. Começa a tua jornada de programação hoje!
> Este repositório inclui traduções em mais de 50 idiomas o que aumenta significativamente o tamanho do download. Para clonar sem traduções, utilize o sparse checkout:
> Este repositório inclui traduções em mais de 50 idiomas, o que aumenta significativamente o tamanho do download. Para clonar sem traduções, usa sparse checkout:
>
> **Bash / macOS / Linux:**
> ```bash
@ -48,85 +48,86 @@ Siga estes passos para começar a usar estes recursos:
> git sparse-checkout set --no-cone "/*" "!translations" "!translated_images"
> ```
>
> Isto fornece tudo o que precisa para completar o curso com um download muito mais rápido.
> Isto dá-te tudo o que precisas para completar o curso com um download muito mais rápido.
<!-- CO-OP TRANSLATOR LANGUAGES TABLE END -->
**Se desejar que sejam suportados idiomas adicionais, estes encontram-se listados [aqui](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
**Se desejas que idiomas adicionais sejam suportados, estão listados [aqui](https://github.com/Azure/co-op-translator/blob/main/getting_started/supported-languages.md)**
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
[](https://open.vscode.dev/microsoft/Web-Dev-For-Beginners)
#### 🧑🎓 _É estudante?_
#### 🧑🎓 _És estudante?_
Visite a [**página Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) onde encontrará recursos para principiantes, pacotes para estudantes e até formas de obter um voucher de certificado gratuito. Esta é a página que deve guardar nos favoritos e consultar de vez em quando, pois atualizamos o conteúdo mensalmente.
Visita a [**página Student Hub**](https://docs.microsoft.com/learn/student-hub/?WT.mc_id=academic-77807-sagibbon) onde encontrarás recursos para iniciantes, pacotes para estudantes e até formas de obter um voucher gratuito para certificado. Esta é a página que deves guardar nos favoritos e consultar de vez em quando, pois o conteúdo é atualizado mensalmente.
### 📣 Anúncio - Novos desafios do modo Agente GitHub Copilot para completar!
### 📣 Anúncio - Novos desafios modo Agente GitHub Copilot para completar!
Novo desafio adicionado, procure "GitHub Copilot Agent Challenge 🚀" em maioria dos capítulos. É um novo desafio para completar usando o GitHub Copilot e o modo Agente. Se nunca usou o modo Agente antes, ele é capaz não só de gerar texto, mas também criar e editar ficheiros, executar comandos e muito mais.
Novo desafio adicionado, procura por "GitHub Copilot Agent Challenge 🚀" na maioria dos capítulos. É um novo desafio para completares usando GitHub Copilot e o modo Agente. Se nunca usaste o modo Agente, ele pode não só gerar texto como criar e editar ficheiros, executar comandos e muito mais.
### 📣 Anúncio - _Novo Projeto para construir usando IA Generativa_
### 📣 Anúncio - _Novo projeto para construir usando IA Generativa_
Novo projeto de Assistente AI acabado de adicionar, veja o [projeto](./9-chat-project/README.md)
Novo projeto Assistente IA acaba de ser adicionado, confere o [projeto](./9-chat-project/README.md)
### 📣 Anúncio - _Novo Currículo_ sobre IA Generativa para JavaScript acabou de ser lançado
### 📣 Anúncio - _Novo Currículo_ sobre IA Generativa para JavaScript foi lançado
Não perca o nosso novo currículo de IA Generativa!
Não percas o nosso novo currículo de IA Generativa!
Visite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para começar!
Visita [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para começares!
Cada aula inclui uma tarefa para completar, um controlo de conhecimento e um desafio para guiá-lo na aprendizagem de tópicos como:
Cada lição inclui um exercício para completares, um teste de conhecimento e um desafio para te guiar na aprendizagem de tópicos como:
- Prompting e engenharia de prompts
- Geração de aplicações de texto e imagem
- Aplicações de pesquisa
Visite [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para começar!
Visita [https://aka.ms/genai-js-course](https://aka.ms/genai-js-course) para começares!
## 🌱 Começar
> **Professores**, incluímos [algumas sugestões](for-teachers.md) sobre como utilizar este currículo. Adoraríamos o seu feedback [no nosso fórum de discussão](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
> **Professores**, incluímos [algumas sugestões](for-teachers.md) sobre como usar este currículo. Adoraríamos o vosso feedback [no nosso fórum de discussão](https://github.com/microsoft/Web-Dev-For-Beginners/discussions/categories/teacher-corner)!
**[Alunos](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, para cada aula, comece com um questionário pré-aula, siga lendo o material da aula, complete as várias atividades e verifique a sua compreensão com o questionário pós-aula.
**[Estudantes](https://aka.ms/student-page/?WT.mc_id=academic-77807-sagibbon)**, para cada lição, começa com um questionário pré-lectura e segue lendo o material da aula, completando as várias atividades e verifica a tua compreensão com o questionário pós-lectura.
Para melhorar a sua experiência de aprendizagem, conecte-se com seus colegas para trabalharem juntos nos projetos! Discussões são incentivadas no nosso [fórum de discussão](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) onde a nossa equipa de moderadores estará disponível para responder às suas perguntas.
Para melhorar a tua experiência de aprendizagem, conecta-te com os seus pares para trabalharem juntos nos projetos! As discussões são encorajadas no nosso [fórum de discussão](https://github.com/microsoft/Web-Dev-For-Beginners/discussions) onde a nossa equipa de moderadores estará disponível para responder às tuas perguntas.
Para aprofundar a sua educação, recomendamos vivamente explorar o [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) para materiais de estudo adicionais.
Para aprofundares a tua educação, recomendamos vivamente que explores o [Microsoft Learn](https://learn.microsoft.com/users/wirelesslife/collections/p1ddcy5jwy0jkm?WT.mc_id=academic-77807-sagibbon) para materiais de estudo adicionais.
### 📋 Configurar o seu ambiente
### 📋 Configurar o teu ambiente
Este currículo tem um ambiente de desenvolvimento pronto a usar! À medida que começa pode optar por executar o currículo num [Codespace](https://github.com/features/codespaces/) (_um ambiente baseado em browser, sem necessidade de instalações_), ou localmente no seu computador usando um editor de texto como o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
Este currículo tem um ambiente de desenvolvimento pronto a usar! Ao começares, podes optar por executar o currículo num [Codespace](https://github.com/features/codespaces/) (_um ambiente baseado no navegador, sem necessidade de instalações_), ou localmente no teu computador usando um editor de texto como o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
#### Crie o seu repositório
Para guardar facilmente o seu trabalho, é recomendado que crie a sua própria cópia deste repositório. Pode fazê-lo clicando no botão **Usar este modelo** no topo da página. Isto criará um novo repositório na sua conta GitHub com uma cópia do currículo.
#### Cria o teu repositório
Para guardares facilmente o teu trabalho, recomenda-se 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. Isso criará um novo repositório na tua conta GitHub com uma cópia do currículo.
Siga estes passos:
1. **Faça Fork do Repositório**: Clique no botão "Fork" no canto superior direito desta página.
2. **Clone o Repositório**: `git clone https://github.com/microsoft/Web-Dev-For-Beginners.git`
Segue estes passos:
1. **Faz 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 sua cópia deste repositório que criou, clique no botão **Code** e selecione **Open with Codespaces**. Isto criará um novo Codespace para trabalhar.
Na tua cópia do repositório que criaste, clica no botão **Code** e seleciona **Open with Codespaces**. Isso criará um novo Codespace para trabalhares.
#### Executar o currículo localmente no seu computador
#### Executar o currículo localmente no teu computador
Para executar este currículo localmente no seu computador, vai precisar de um editor de texto, um navegador e uma ferramenta de linha de comandos. A nossa primeira aula, [Introdução às Linguagens de Programação e Ferramentas do Ofício](../../1-getting-started-lessons/1-intro-to-programming-languages), orienta-o através das várias opções para cada uma destas ferramentas para que escolha a que funciona melhor para si.
Para executares este currículo localmente no teu computador, precisas de um editor de texto, um navegador e uma ferramenta de linha de comandos. A nossa primeira lição, [Introdução às Linguagens de Programação e Ferramentas do Ofício](../../1-getting-started-lessons/1-intro-to-programming-languages), irá guiar-te por várias opções para cada uma destas ferramentas para selecionares o que melhor te convém.
A nossa recomendação é usar o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) como seu editor, que também tem um [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) incorporado. Pode fazer o download do Visual Studio Code [aqui](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Clone o seu repositório para o seu computador. Pode fazer isto clicando no botão **Code** e copiando o URL:
A nossa recomendação é usar o [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) como editor, que também tem um [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) incorporado. Podes descarregar o Visual Studio Code [aqui](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon).
1. Clone o seu repositório para o seu computador. Pode fazer isto clicando no botão **Code** e copiando a URL:
[CodeSpace](./images/createcodespace.png)
Depois, abra o [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) dentro do [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) e execute o seguinte comando, substituindo `<your-repository-url>` pelo URL que acabou de copiar:
Depois, abra o [Terminal](https://code.visualstudio.com/docs/terminal/basics/?WT.mc_id=academic-77807-sagibbon) dentro do [Visual Studio Code](https://code.visualstudio.com/?WT.mc_id=academic-77807-sagibbon) e execute o seguinte comando, substituindo `<your-repository-url>` pela URL que acabou de copiar:
```bash
git clone <your-repository-url>
@ -135,79 +136,79 @@ A nossa recomendação é usar o [Visual Studio Code](https://code.visualstudio.
2. Abra a pasta no Visual Studio Code. Pode fazer isto clicando em **File** > **Open Folder** e selecionando a pasta que acabou de clonar.
> Extensões recomendadas do Visual Studio Code:
> Extensões recomendadas para o Visual Studio Code:
>
> * [Live Server](https://marketplace.visualstudio.com/items?itemName=ritwickdey.LiveServer&WT.mc_id=academic-77807-sagibbon) - para pré-visualizar páginas HTML dentro do Visual Studio Code
> * [Copilot](https://marketplace.visualstudio.com/items?itemName=GitHub.copilot&WT.mc_id=academic-77807-sagibbon) - para ajudar a escrever código mais rapidamente
## 📂 Cada lição inclui:
## 📂 Cada aula inclui:
- sketchnote opcional
- vídeo suplementar opcional
- questionário pré-aula
- lição escrita
- para lições baseadas em projetos, guias passo a passo para construir o projeto
- quiz de aquecimento pré-aula
- aula escrita
- para aulas baseadas em projetos, guias passo-a-passo sobre como construir o projeto
> **Uma nota sobre os questionários**: Todos os questionários estão contidos na pasta Quiz-app, totalizando 48 questionários com três perguntas cada. Estão disponíveis [aqui](https://ff-quizzes.netlify.app/web/), 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 Ligada | Autor |
| 01 | Getting Started | Introdução à Programação e Ferramentas do Ofício | Aprender os fundamentos básicos da maioria das linguagens de programação e sobre o software que ajuda os programadores profissionais | [Introdução a Linguagens de Programação e Ferramentas do Ofício](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | Getting Started | Noções básicas de GitHub, inclui trabalho em equipa | Como usar o GitHub no seu projeto, como colaborar com outros numa base de código | [Introdução ao GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | Getting Started | Acessibilidade | Aprender os conceitos básicos de acessibilidade na web | [Fundamentos de Acessibilidade](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | JS Basics | Tipos de Dados em JavaScript | Os conceitos básicos dos tipos de dados em JavaScript | [Tipos de Dados](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | JS Basics | Funções e Métodos | Aprender sobre funções e métodos para gerir o fluxo lógico de uma aplicação | [Funções e Métodos](./2-js-basics/2-functions-methods/README.md) | Jasmine and Christopher |
| 06 | JS Basics | Tomar Decisões com JS | Aprender a criar condições no seu código usando métodos de tomada de decisão | [Tomar Decisões](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | JS Basics | Arrays e Loops | Trabalhar com dados utilizando arrays e loops em JavaScript | [Arrays e Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrarium](./3-terrarium/solution/README.md) | HTML na Prática | Construir o HTML para criar um terrário online, focando na criação de um layout | [Introdução ao HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrarium](./3-terrarium/solution/README.md) | CSS na Prática| Construir o CSS para estilizar o terrário online, focando nos conceitos básicos de CSS incluindo tornar a página responsiva | [Introdução ao CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrarium](./3-terrarium/solution/README.md) | Fechos JavaScript, manipulação do DOM | Construir o JavaScript para fazer o terrário funcionar como uma interface drag/drop, focando em fechamentos e manipulação do DOM | [Fechos JavaScript, manipulação do DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Typing Game](./4-typing-game/solution/README.md) | Construir um Jogo de Digitação | Aprender a usar eventos do teclado para conduzir a lógica da sua app em JavaScript | [Programação Orientada a Eventos](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Extensão de Navegador Verde](./5-browser-extension/solution/README.md) | Trabalhar com Navegadores | Aprender como os navegadores funcionam, a sua história e como criar os primeiros elementos de uma extensão para navegador | [Sobre Navegadores](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Extensão de Navegador Verde](./5-browser-extension/solution/README.md) | Construir um formulário, chamar uma API e armazenar variáveis em armazenamento local | Construir os elementos JavaScript da sua extensão para navegador para chamar uma API usando variáveis armazenadas localmente | [APIs, Formulários e Armazenamento Local](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Extensão de Navegador Verde](./5-browser-extension/solution/README.md) | Processos em segundo plano no navegador, desempenho web | Usar os processos em segundo plano do navegador para gerir o ícone da extensão; aprender sobre desempenho web e algumas otimizações | [Tarefas em Segundo Plano e Desempenho](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Jogo Espacial](./6-space-game/solution/README.md) | Desenvolvimento de Jogos Mais Avançado em JavaScript | Aprender sobre Herança utilizando Classes e Composição e o padrão Pub/Sub, em preparação para criar um jogo | [Introdução ao Desenvolvimento Avançado de Jogos](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Jogo Espacial](./6-space-game/solution/README.md) | Desenhar no canvas | Aprender sobre a API Canvas, usada para desenhar elementos num ecrã | [Desenhar no Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Jogo Espacial](./6-space-game/solution/README.md) | Mover elementos pelo ecrã | Descobrir como os elementos podem ganhar movimento usando coordenadas cartesianas e a API Canvas | [Mover Elementos](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Jogo Espacial](./6-space-game/solution/README.md) | Detetar colisões | Fazer elementos colidirem e reagirem entre si usando pressionar de teclas e fornecer uma função de cooldown para garantir o desempenho | [Deteção de Colisões](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Jogo Espacial](./6-space-game/solution/README.md) | Manter a pontuação | Realizar cálculos matemáticos baseados no estado e desempenho do jogo | [Manter Pontuação](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Jogo Espacial](./6-space-game/solution/README.md) | Terminar e reiniciar o jogo | Aprender sobre terminar e reiniciar o jogo, incluindo limpeza de recursos e reposição de valores de variáveis | [A Condição de Fim](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [App Bancária](./7-bank-project/solution/README.md) | Modelos HTML e Rotas numa Aplicação Web | Aprender a criar a estrutura de arquitetura de um site multipágina usando roteamento e modelos HTML | [Modelos HTML e Rotas](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [App Bancária](./7-bank-project/solution/README.md) | Construir um Formulário de Login e Registo | Aprender sobre construção de formulários e rotinas de validação | [Formulários](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [App Bancária](./7-bank-project/solution/README.md) | Métodos de Obtenção e Uso de Dados | Como os dados entram e saem da sua aplicação, como os obter, armazenar e descartar | [Dados](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [App Bancária](./7-bank-project/solution/README.md) | Conceitos de Gestão de Estado | Aprender como a sua app mantém o estado e como geri-lo programaticamente | [Gestão de Estado](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Código Browser/VScode](../../8-code-editor) | Trabalhar com VScode | Aprender a usar um editor de código| [Usar Editor de Código VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [Assistentes AI](./9-chat-project/README.md) | Trabalhar com AI | Aprender a construir o seu próprio assistente AI | [Projeto Assistente AI](./9-chat-project/README.md) | Chris |
> **Uma nota sobre quizzes**: Todos os quizzes estão contidos na pasta Quiz-app, com um total de 48 quizzes de três perguntas cada. Estão disponíveis [aqui](https://ff-quizzes.netlify.app/web/) e a aplicação de quiz pode ser executada localmente ou implantada no Azure; siga as instruções na pasta `quiz-app`.
## 🗃️ Aulas
| | Nome do Projeto | Conceitos Ensinados | Objetivos de Aprendizagem | Aula Ligada | Autor |
| 01 | A Começar | Introdução à Programação e Ferramentas do Ofício | Aprender os fundamentos básicos por trás da maioria das linguagens de programação e sobre o software que ajuda desenvolvedores profissionais a fazerem o seu trabalho | [Introdução a Linguagens de Programação e Ferramentas do Ofício](./1-getting-started-lessons/1-intro-to-programming-languages/README.md) | Jasmine |
| 02 | A Começar | Noções básicas de GitHub, inclui trabalho em equipa | Como usar o GitHub no seu projeto, como colaborar com outros numa base de código | [Introdução ao GitHub](./1-getting-started-lessons/2-github-basics/README.md) | Floor |
| 03 | A Começar | Acessibilidade | Aprender os fundamentos da acessibilidade web | [Fundamentos da Acessibilidade](./1-getting-started-lessons/3-accessibility/README.md) | Christopher |
| 04 | Fundamentos de JS | Tipos de Dados em JavaScript | Os fundamentos dos tipos de dados em JavaScript | [Tipos de Dados](./2-js-basics/1-data-types/README.md) | Jasmine |
| 05 | Fundamentos de JS | Funções e Métodos | Aprender sobre funções e métodos para gerir o fluxo lógico de uma aplicação | [Funções e Métodos](./2-js-basics/2-functions-methods/README.md) | Jasmine e Christopher |
| 06 | Fundamentos de JS | Tomando Decisões com JS | Aprender a criar condições no seu código usando métodos de tomada de decisão | [Tomando Decisões](./2-js-basics/3-making-decisions/README.md) | Jasmine |
| 07 | Fundamentos de JS | Arrays e Loops | Trabalhar com dados usando arrays e loops em JavaScript | [Arrays e Loops](./2-js-basics/4-arrays-loops/README.md) | Jasmine |
| 08 | [Terrário](./3-terrarium/solution/README.md) | HTML na Prática | Construir o HTML para criar um terrário online, focando na construção do layout | [Introdução ao HTML](./3-terrarium/1-intro-to-html/README.md) | Jen |
| 09 | [Terrário](./3-terrarium/solution/README.md) | CSS na Prática | Construir o CSS para estilizar o terrário online, focando no básico do CSS incluindo tornar a página responsiva | [Introdução ao CSS](./3-terrarium/2-intro-to-css/README.md) | Jen |
| 10 | [Terrário](./3-terrarium/solution/README.md) | Closures em JavaScript, manipulação do DOM | Construir o JavaScript para fazer o terrário funcionar como uma interface de arrastar e largar, focando em closures e manipulação do DOM | [Closures em JavaScript, manipulação do DOM](./3-terrarium/3-intro-to-DOM-and-closures/README.md) | Jen |
| 11 | [Jogo de Digitação](./4-typing-game/solution/README.md) | Construir um Jogo de Digitação | Aprender a usar eventos do teclado para conduzir a lógica da sua app em JavaScript | [Programação Orientada a Eventos](./4-typing-game/typing-game/README.md) | Christopher |
| 12 | [Extensão Verde para Navegador](./5-browser-extension/solution/README.md) | Trabalhar com Browsers | Aprender como os browsers funcionam, a sua história, e como estruturar os primeiros elementos de uma extensão de browser | [Sobre Browsers](./5-browser-extension/1-about-browsers/README.md) | Jen |
| 13 | [Extensão Verde para Navegador](./5-browser-extension/solution/README.md) | Construir um formulário, chamar uma API e armazenar variáveis localmente | Construir os elementos JavaScript da extensão do browser para chamar uma API usando variáveis armazenadas em local storage | [APIs, Formulários e Armazenamento Local](./5-browser-extension/2-forms-browsers-local-storage/README.md) | Jen |
| 14 | [Extensão Verde para Navegador](./5-browser-extension/solution/README.md) | Processos em background no browser, performance web | Usar os processos em background do browser para gerir o ícone da extensão; aprender sobre performance web e algumas otimizações para melhorar | [Tarefas em Background e Performance](./5-browser-extension/3-background-tasks-and-performance/README.md) | Jen |
| 15 | [Jogo Espacial](./6-space-game/solution/README.md) | Desenvolvimento Avançado de Jogos com JavaScript | Aprender 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 Avançado de Jogos](./6-space-game/1-introduction/README.md) | Chris |
| 16 | [Jogo Espacial](./6-space-game/solution/README.md) | Desenhar no canvas | Aprender sobre a API Canvas, usada para desenhar elementos num ecrã | [Desenhar no Canvas](./6-space-game/2-drawing-to-canvas/README.md) | Chris |
| 17 | [Jogo Espacial](./6-space-game/solution/README.md) | Mover elementos pelo ecrã | Descobrir como os elementos podem ganhar movimento usando coordenadas cartesianas e a API Canvas | [Mover Elementos](./6-space-game/3-moving-elements-around/README.md) | Chris |
| 18 | [Jogo Espacial](./6-space-game/solution/README.md) | Detetar colisões | Fazer os elementos colidirem e reagirem uns aos outros usando pressionar de teclas e fornecer uma função de cooldown para garantir o desempenho do jogo | [Deteção de Colisões](./6-space-game/4-collision-detection/README.md) | Chris |
| 19 | [Jogo Espacial](./6-space-game/solution/README.md) | Contabilizar pontos | Realizar cálculos matemáticos baseados no estado e desempenho do jogo | [Contabilização de Pontos](./6-space-game/5-keeping-score/README.md) | Chris |
| 20 | [Jogo Espacial](./6-space-game/solution/README.md) | Terminar e reiniciar o jogo | Aprender sobre terminar e reiniciar o jogo, incluindo limpar recursos e reiniciar valores de variáveis | [Condição de Termino](./6-space-game/6-end-condition/README.md) | Chris |
| 21 | [App Bancária](./7-bank-project/solution/README.md) | Templates HTML e Rotas numa Web App | Aprender como criar a estrutura da arquitetura de um website multipágina usando rotas e templates HTML | [Templates HTML e Rotas](./7-bank-project/1-template-route/README.md) | Yohan |
| 22 | [App Bancária](./7-bank-project/solution/README.md) | Construir um Formulário de Login e Registro | Aprender sobre construir formulários e gerir rotinas de validação | [Formulários](./7-bank-project/2-forms/README.md) | Yohan |
| 23 | [App Bancária](./7-bank-project/solution/README.md) | Métodos de Obter e Usar Dados | Como os dados entram e saem da aplicação, como obtê-los, armazená-los e descartá-los | [Dados](./7-bank-project/3-data/README.md) | Yohan |
| 24 | [App Bancária](./7-bank-project/solution/README.md) | Conceitos de Gestão de Estado | Aprender como a sua app mantém estado e como gerir isso programaticamente | [Gestão de Estado](./7-bank-project/4-state-management/README.md) | Yohan |
| 25 | [Código do Browser/VScode](../../8-code-editor) | Trabalhar com VScode | Aprender a usar um editor de código| [Usar Editor de Código VScode](./8-code-editor/1-using-a-code-editor/README.md) | Chris |
| 26 | [Assistentes de IA](./9-chat-project/README.md) | Trabalhar com IA | Aprender a construir o seu próprio assistente de IA | [Projeto Assistente de IA](./9-chat-project/README.md) | Chris |
## 🏫 Pedagogia
O nosso currículo foi desenhado com dois princípios pedagógicos chave em mente:
O nosso currículo foi concebido com dois princípios pedagógicos fundamentais em mente:
* aprendizagem baseada em projetos
* questionários frequentes
* quizzes frequentes
O programa ensina os fundamentos de JavaScript, HTML e CSS, bem como as ferramentas e técnicas mais recentes usadas pelos programadores web atuais. Os estudantes terão a oportunidade de adquirir experiência prática construindo um jogo de digitação, um terrário virtual, uma extensão de navegador amiga do ambiente, um jogo ao estilo space-invader e uma app bancária para negócios. Ao final da série, os estudantes terão adquirido uma compreensão sólida do desenvolvimento web.
O programa ensina os fundamentos de JavaScript, HTML e CSS, bem como as últimas ferramentas e técnicas usadas pelos desenvolvedores web de hoje. Os alunos terão a oportunidade de desenvolver experiência prática construindo um jogo de digitação, um terrário virtual, uma extensão de browser ecológica, um jogo estilo invasores do espaço e uma app bancária para negócios. No final da série, os alunos terão adquirido uma sólida compreensão do desenvolvimento web.
> 🎓 Pode fazer as primeiras lições deste currículo como um [Learn Path](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
> 🎓 Pode fazer as primeiras aulas deste currículo como um [Caminho de Aprendizagem](https://docs.microsoft.com/learn/paths/web-development-101/?WT.mc_id=academic-77807-sagibbon) na Microsoft Learn!
Ao garantir que o conteúdo está alinhado com os projetos, o processo torna-se mais envolvente para os estudantes e a retenção dos conceitos será aumentada. Também escrevemos várias lições introdutórias de JavaScript para introduzir conceitos, acompanhadas por um vídeo da coleção de tutoriais "[Beginners Series to: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", alguns dos autores dos quais contribuíram para este currículo.
Ao garantir que o conteúdo está alinhado com projetos, o processo torna-se mais envolvente para os alunos e a retenção de conceitos será aumentada. Também escrevemos várias aulas introdutórias aos fundamentos de JavaScript para introduzir conceitos, combinadas com um vídeo da coleção de tutoriais em vídeo "[Série para Iniciantes em: JavaScript](https://channel9.msdn.com/Series/Beginners-Series-to-JavaScript/?WT.mc_id=academic-77807-sagibbon)", alguns dos quais os autores contribuíram para este currículo.
Além disso, um questionário de baixo risco antes da aula estabelece a intenção do estudante em aprender um tema, enquanto um segundo questionário após a aula assegura uma maior retenção. Este currículo foi desenhado para ser flexível e divertido e pode ser seguido na íntegra ou em parte. Os projetos começam pequenos e tornam-se progressivamente mais complexos até ao final do ciclo de 12 semanas.
Além disso, um quiz de baixo risco antes da aula define a intenção do aluno em aprender um tópico, enquanto um segundo quiz após a aula assegura uma retenção adicional. Este currículo foi desenhado para ser flexível e divertido e pode ser feito na totalidade ou em parte. Os projetos começam pequenos e tornam-se progressivamente mais complexos até ao final do ciclo de 12 semanas.
Embora tenhamos evitado intencionalmente introduzir frameworks de JavaScript para nos concentrarmos nas competências básicas necessárias como programador web antes de adotar um framework, um bom próximo passo para completar este currículo seria aprender sobre Node.js através de outra coleção de vídeos: "[Beginner Series to: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
Embora tenhamos evitado propositadamente introduzir frameworks JavaScript para nos concentrarmos nas habilidades básicas necessárias como desenvolvedor web antes de adotar um framework, um bom próximo passo para completar este currículo seria aprender sobre Node.js através de outra coleção de vídeos: "[Série para Iniciantes em: Node.js](https://channel9.msdn.com/Series/Beginners-Series-to-Nodejs/?WT.mc_id=academic-77807-sagibbon)".
> Visite as nossas diretrizes de [Código de Conduta](CODE_OF_CONDUCT.md) e [Contribuição](CONTRIBUTING.md). Apreciamos o seu feedback construtivo!
> Visite as nossas diretrizes [Código de Conduta](CODE_OF_CONDUCT.md) e [Contribuição](CONTRIBUTING.md). Agradecemos o seu feedback construtivo!
## 🧭 Acesso offline
## 🧭 Acesso Offline
Pode executar esta documentação offline usando o [Docsify](https://docsify.js.org/#/). Faça um fork deste repositório, [instale o Docsify](https://docsify.js.org/#/quickstart) na sua máquina local e depois na pasta raiz deste repositório digite `docsify serve`. O website será servido na porta 3000 no seu localhost: `localhost:3000`.
Pode executar esta documentação offline usando o [Docsify](https://docsify.js.org/#/). Faça um fork deste repositório, [instale o Docsify](https://docsify.js.org/#/quickstart) na sua máquina local e depois, na pasta raiz deste repositório, escreva`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](https://microsoft.github.io/Web-Dev-For-Beginners/pdf/readme.pdf).
@ -215,7 +216,7 @@ Um PDF de todas as lições pode ser encontrado [aqui](https://microsoft.github.
## 🎒 Outros Cursos
A nossa equipa produz outros cursos! Confira:
A nossa equipa produz outros cursos! Veja:
<!-- CO-OP TRANSLATOR OTHER COURSES START -->
### LangChain
@ -240,7 +241,7 @@ A nossa equipa produz outros cursos! Confira:
---
### Aprendizagem Fundamental
### Aprendizagem Base
[](https://aka.ms/ml-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/datascience-beginners?WT.mc_id=academic-105485-koreyst)
[](https://aka.ms/ai-beginners?WT.mc_id=academic-105485-koreyst)
@ -259,21 +260,21 @@ A nossa equipa produz outros cursos! Confira:
## Obter Ajuda
Se ficar bloqueado ou tiver alguma dúvida sobre como construir aplicações de IA. Junte-se a outros aprendizes e desenvolvedores experientes nas discussões sobre MCP. É uma comunidade solidária onde as perguntas são bem-vindas e o conhecimento é partilhado livremente.
Se ficar bloqueado ou tiver alguma pergunta sobre como construir aplicações de IA, junte-se a outros alunos e desenvolvedores experientes em discussões sobre MCP. É uma comunidade de apoio onde as perguntas são bem-vindas e o conhecimento é partilhado livremente.
Este repositório está licenciado sob a licença MIT. Consulte o ficheiro [LICENSE](../../LICENSE) para mais informações.
Este repositório está licenciado sob a licença MIT. Veja o ficheiro [LICENSE](../../LICENSE) para mais informações.
---
<!-- CO-OP TRANSLATOR DISCLAIMER START -->
**Aviso Legal**:
Este documento foi traduzido utilizando o serviço de tradução automática [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos esforcemos pela precisão, esteja ciente de que traduções automatizadas podem conter erros ou imprecisões. O documento original na sua língua nativa deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se a tradução profissional por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações incorretas decorrentes da utilização desta tradução.
**Aviso Legal**:
Este documento foi traduzido utilizando o serviço de tradução automática [Co-op Translator](https://github.com/Azure/co-op-translator). Embora nos esforcemos pela precisão, tenha em conta que traduções automáticas podem conter erros ou imprecisões. O documento original na sua língua nativa deve ser considerado a fonte autorizada. Para informações críticas, recomenda-se tradução profissional realizada por humanos. Não nos responsabilizamos por quaisquer mal-entendidos ou interpretações erradas resultantes do uso desta tradução.
localizeflow[bot]
6 days ago