Merge pull request #160 from oberdansch/main
Translating "Intro to static web apps" to Portuguese (Brazil).
This commit is contained in:
Pablo Nunes
GitHub
Коммит
8dba32e53c
|
|
@ -1,3 +1,4 @@
|
|||
In this folder, you can find translations of existing workshops in their corresponding folders.
|
||||
|
||||
- [Spanish](./es/README.es.md)
|
||||
- [Spanish](./es/README.es.md)
|
||||
- [Portuguese](./pt-br/README.md)
|
||||
|
|
@ -0,0 +1,69 @@
|
|||
# Introdução aos Aplicativos Web Estáticos
|
||||
|
||||
## Módulo Origem
|
||||
|
||||
[Publicar um aplicativo Angular, React, Svelte ou Vue JavaScript com os Aplicativos Web Estáticos](https://docs.microsoft.com/learn/modules/publish-app-service-static-web-app-api/?WT.mc_id=academic-56895-chnoring)
|
||||
|
||||
## Objetivos
|
||||
|
||||
Neste workshop, você aprenderá a implantar seus arquivos estáticos no Azure, sejam eles um Aplicativo de Página Única JavaScript (SPA) avançado ou um HTML simples.
|
||||
|
||||
| **Objetivo** | Descrição |
|
||||
| ------------------------------------- | ------------------------------------------------------------------------------------------------------------- |
|
||||
| **O que você vai aprender** | Publicar um aplicativo Angular, React, Svelte ou Vue JavaScript com os Aplicativos Web Estáticos |
|
||||
| **O que você vai precisar** | Um navegador da Web, uma conexão com internet, uma conta do Azure, [Visual Studio Code](https://code.visualstudio.com?WT.mc_id=academic-56895-chnoring), e a [extensão Aplicativos Web Estáticos do VS Code](https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode-azurestaticwebapps&WT.mc_id=academic-56895-chnoring) |
|
||||
| **Duração** | 20 minutos |
|
||||
| **Slides** | [slides](./slides.pptx) |
|
||||
|
||||
## Vídeo
|
||||
|
||||
[](https://youtu.be/QJHd4jf4ekI "workshop walk-through")
|
||||
> 🎥 Click this image to watch Chris walk you through the workshop starting at 0:21:00
|
||||
|
||||
## O que você vai aprender
|
||||
|
||||
Você é um desenvolvedor web e criou um aplicativo web. Geralmente, um aplicativo web consiste de arquivos HTML, JavaScript ou CSS que podem ser criados manualmente ou por meio de um framework.
|
||||
|
||||
Você gostaria de poder implementar ou publicar seu site no Azure para mostrar a seus amigos?
|
||||
|
||||
Neste workshop você vai aprender:
|
||||
|
||||
- Usar o Serviço de Aplicativos Estáticos de Web (Static Web Apps).
|
||||
- Publicar o aplicativo web no Azure utilizando este serviço.
|
||||
|
||||
## Introdução ao Serviço de Aplicativos Estáticos de Web do Azure
|
||||
|
||||
Leia sobre o serviço [nessa introdução](https://docs.microsoft.com/learn/modules/publish-app-service-static-web-app-api/1-introduction?pivots=angular&WT.mc_id=academic-56895-chnoring).
|
||||
|
||||
## Criar um aplicativo web
|
||||
|
||||
Antes de você publicar o aplicativo no Azure, você precisará criá-lo.
|
||||
|
||||
- Criar o repositório através de um template
|
||||
- Executar o aplicativo localmente e visualizá-lo no navegador.
|
||||
|
||||
[Vamos criar o repositório](https://docs.microsoft.com/learn/modules/publish-app-service-static-web-app-api/2-exercise-get-started?pivots=angular&WT.mc_id=academic-56895-chnoring)!
|
||||
|
||||
## Planeje seu Aplicativo Estático de Web
|
||||
|
||||
Para publicar seu aplicativo no Azure, é preciso provisionar um recurso estático de web do Azure. A configuração desse recurso exige que alguns campos sejam preenchidos com informações adicionais, que serão descritas mais abaixo. Seu repositório do GitHub possui uma funcionalidade chamada Ações (GitHub Actions), que permite automatizações tais como teste de código, publicação no Azure, e muito mais. O GitHub Ações (GitHub Actions) é a tecnologia subjacente da qual os Aplicativos Estáticos de Web dependem para sua publicação na nuvem.
|
||||
|
||||
Para saber mais sobre os Aplicativos Web Estáticos do Azure e seus campos, assim como as ações do GitHub, [clique aqui](https://docs.microsoft.com/learn/modules/publish-app-service-static-web-app-api/3-static-web-apps?pivots=angular&WT.mc_id=academic-56895-chnoring).
|
||||
|
||||
## Criar um Aplicativo Estático no Azure
|
||||
|
||||
É possível utilizar a extensão Azure do Visual Studio Code para simplificar o processo de desenvolvimento para web. Esta extensão, publicada pela equipe Microsoft de Aplicativos Estáticos do Azure, permite a criação dos recursos de nuvem necessários ao aplicativo web. Isso facilita muito a publicação do seu aplicativo. Saiba mais sobre [este processo aqui](https://docs.microsoft.com/learn/modules/publish-app-service-static-web-app-api/4-exercise-static-web-apps?pivots=angular&WT.mc_id=academic-56895-chnoring).
|
||||
|
||||
## Próximos passos
|
||||
|
||||
Tente outras formas de construir um aplicativo estático neste módulo - você pode usar Vue, React, Angular ou Svelte [nesse módulo](https://docs.microsoft.com/learn/modules/publish-app-service-static-web-app-api?WT.mc_id=academic-56895-chnoring).
|
||||
|
||||
## Praticar
|
||||
|
||||
Agora que você conhece sobre o Aplicativo Web Estático do Azure, aprenda como [publicar uma API](https://docs.microsoft.com/learn/modules/publish-static-web-app-api-preview-url?WT.mc_id=academic-56895-chnoring) e como [autenticar usuários](https://docs.microsoft.com/learn/modules/publish-static-web-app-authentication/?WT.mc_id=academic-56895-chnoring) com o Aplicativo Web Estático do Azure.
|
||||
|
||||
## Comentários
|
||||
|
||||
Certifique-se de dar [comentários sobre esse workshop](https://forms.office.com/r/MdhJWMZthR)!
|
||||
|
||||
[Código de Conduta](../../CODE_OF_CONDUCT.md)
|
||||
|
|
@ -72,12 +72,12 @@ Vamos assumir que você está apresentando sobre a história dos três porquinho
|
|||
Utilize duas ou três sentenças para recapitular o que acabou de acontecer. Por exemplo: o lobo mau foi fácil, afinal levou apenas alguns golpes e quase pegou o porquinho.
|
||||
Resumir permite manter uma audiência no caminho certo.
|
||||
|
||||
1. **Repeat to Connect**
|
||||
1. **Repetir para Conectar**
|
||||
|
||||
Encontre elementos que você pode repetir então a história ou apresentação se conecta. Por exemplo, você mencionar no início que o lobo estava com muita fome. No final, você pode dizer "agora esse lobo está ainda mais faminto".
|
||||
Isso ajuda a encadear os eventos de uma maneira que o público pode se relacionar.
|
||||
|
||||
1. **Enfatize a ideia unica**
|
||||
1. **Enfatize a ideia única**
|
||||
|
||||
Tem que haver *uma* lição importante para seu público. Use essa dica toda vez que puder e enfatize-a: "O trabalho duro comprensa [...]. Os três porquinhos foram beneficiados do trabalho duro na casa mais forte"
|
||||
|
||||
|
|
@ -89,9 +89,9 @@ Agora que você tem um novo conjunto de ferramentas para falar em público, tent
|
|||
|
||||
Sempre pratique na frente de outra pessoa ou se você não tiver ninguém para praticar como platéia, tente gravar você mesmo durante alguns minutos e assista a gravação para ver onde você pode melhorar.
|
||||
|
||||
## Feedback
|
||||
## Comentários
|
||||
|
||||
Certifique-se de dar [feedback sobre este workshop](https://forms.office.com/r/MdhJWMZthR)!
|
||||
Certifique-se de dar [comentários sobre este workshop](https://forms.office.com/r/MdhJWMZthR)!
|
||||
|
||||
[Código de Conduta](../../CODE_OF_CONDUCT.md)
|
||||
|
||||
|
|
|
|||
Загрузка…
Ссылка в новой задаче