Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Introducción a Azure Static Web Apps

Introducción a Azure Static Web Apps

Azure Static Web Apps se anunció en la conferencia Microsoft Build 2020 y le permiten hospedar sus sitios web estáticos de forma gratuita. Puede utilizar HTML, Javascript simple de marcos front-end como Angular o React. El sitio web recupera datos, si es necesario, de Azure Functions. Una gran característica de Azure Static Web Apps es que no es la necesidad de configurar la canalización de CI/CD. Esto lo hace por usted Azure y Github mediante GitHub Actions.

3275e53a5e20a36e5557ae86a69ca8ba?s=128

Lautaro Carro

July 04, 2020
Tweet

More Decks by Lautaro Carro

Other Decks in Programming

Transcript

  1. INTRODUCCIÓN A AZURE STATIC WEB APPS Lautaro Carro

  2. AGENDA ❑¿Qué es Azure Static Web Apps ❑¿Cómo funciona? ❑Subir

    un sitio web sin backend ❑Subir un sitio web con backend ❑Vista Previa de los Pull Request ❑Rutas de reserva ❑Autenticación
  3. AZURE STATIC WEB APPS Es un servicio que compila e

    implementa automáticamente aplicaciones web fullstack en Azure desde un repositorio de GitHub.
  4. APLICACIONES WEB FULLSTACK

  5. ¿CÓMO FUNCIONA?

  6. None
  7. PASO A PASO: REPOSITORIO

  8. PASO A PASO: CREAR RECURSO

  9. PASO A PASO: SELECCIONAR REPOSITORIO

  10. PASO A PASO: COMPILAR

  11. PASO A PASO: REVISAR Y CREAR

  12. PASO A PASO: NUESTRO SITIO WEB

  13. BACKSTAGE PASO A PASO: GITHUB ACTIONS

  14. BACKSTAGE PASO A PASO: GITHUB ACTIONS

  15. PASO A PASO: HELLO WORLD

  16. None
  17. AZURE FUNCTIONS: VSCODE npm install -g azure-functions-core-tools@3

  18. PASO A PASO: CREAR API HttpTrigger + Anonymous

  19. PASO A PASO: ESTRUCTURA CARPETAS

  20. PASO A PASO: CONSULTAR API

  21. PASO A PASO: HELLO [YOUR NAME]

  22. None
  23. VISTA PREVIA DE PULL REQUEST

  24. VISTA PREVIA DE PULL REQUEST

  25. VISTA PREVIA DE PULL REQUEST

  26. VISTA PREVIA DE PULL REQUEST

  27. VISTA PREVIA DE PULL REQUEST

  28. None
  29. None
  30. RUTAS DE RESERVA: HISTORY API

  31. RUTAS DE RESERVA: DESPUES DE F5

  32. RUTAS DE RESERVA: HASH

  33. RUTAS DE RESERVA: ROUTES.JSON

  34. ROUTES.JSON: SERVER ROUTER

  35. ROUTES.JSON: PLATFORM ERROR OVERRIDES

  36. ROUTES + ROLES

  37. None
  38. AUTENTICACIÓN Proveedor de autorización Ruta de inicio de sesión Azure

    Active Directory /.auth/login/aad Facebook /.auth/login/facebook GitHub /.auth/login/github Google1 /.auth/login/google Twitter /.auth/login/twitter
  39. None
  40. VSCODE EXTENSION

  41. ¿PREGUNTAS? Introducción a Azure Static Web Apps

  42. MUCHAS GRACIAS Introducción a Azure Static Web Apps @lauchacarro Lautarocarro.blog

  43. REFERENCIAS https://github.com/lauchacarro/vue-static-web-app https://docs.microsoft.com/es-mx/azure/static-web-apps/ https://docs.microsoft.com/es-es/learn/modules/publish-app-service-static-web-app-api/1- introduction https://marketplace.visualstudio.com/items?itemName=ms-azuretools.vscode- azurestaticwebapps https://mybuild.microsoft.com/sessions/6769011f-744e-4c36-84a2-49b715be0c80 https://www.it-swarm.dev/es/javascript/los-urls-react-router-no-funcionan-al-actualizar-o- escribir-manualmente/1051646776/

    https://go.algeiba.com/azuresandbox