Azure cloud for the web frontend developers
•Als PPTX, PDF herunterladen•
1 gefällt mir•82 views
It’s impossible to reason about modern web application without mentioning its front-end part – extensive, feature-rich, performant, sometimes with quite sophisticated structure and build process, but after all not requiring server-side code to construct it in the runtime, i.e. static. In the Azure cloud, we now have a special service for this kind of apps (including both classic SPAs and statically generated ones), empowering developers to focus on the business logic rather than the infrastructure that builds and hosts them. In my technical session & demo, let's go through the full development flow: we scaffold a web front-end app, push it to the GitHub, set up Azure Static Web App service, enjoy the fully automatic build, and deploy to global high-availability hosting - all in a few minutes!
Empfohlen
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Ähnlich wie Azure cloud for the web frontend developers
Ähnlich wie Azure cloud for the web frontend developers (20)
Mehr von Maxim Salnikov
Mehr von Maxim Salnikov (16)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
Azure cloud for the web frontend developers
- 1. Azure cloud for the web frontend developers Maxim Salnikov @webmaxru
- 2. How Azure empowers every frontend developer and team on the planet to achieve more
- 3. I’m Maxim Salnikov • Build on web platform since 90s • Organize developer communities and technical conferences • Speak, train, blog, and… Developer Engagement Lead at Microsoft @webmaxru
- 4. …produce and mix some beats • Built a tool for the real-time BPM count • Works in any browser on any platform • No backend, just a static web app • PWA: installable, offline-ready http://localhost:3000
- 5. What’s next? Share it with the global community Add some extra features Still focus on the frontend development
- 6. What do frontend developers want from the cloud Hosting • Fast & reliable • Geo-distributed • SPA-, SSR-ready • Custom domains • Free SSL certificate Deployment • Fully automated • Staging environments • No DevOps skills needed Feature helpers • Serverless API • Provider-based authentication • Role-based access control • Tools for the local development Generous free tier
- 7. Azure Static Web Apps
- 8. How to start? 1. Point to the code repository 2. Confirm configuration 3. Three, two, one… 4. App is online VS Code Extension Azure Portal - or -
- 9. How to deploy a new version? 1. Code and push to the repo >npm run build
- 10. How to develop locally? npm install -g @azure/static-web-apps-cli swa start [app dist folder or url] --run "[command to start dev server]" --api [functions folder or url] Start full dev environment for React swa start http://localhost:3000 --run "npm start" --api ./api Azure Static Web Apps CLI • Web server with the configuration file support • Emulating authentication and authorization • Serving or proxying to API requests
- 11. Demo time!
- 12. How to continue learning? aka.ms/swa-learning Step-by-step learning paths on deploying and configuring your apps in Azure Static Web Apps aka.ms/swa-docs Detailed documentation, how-to guides aka.ms/swa-demo Real-world React application example with the API, routes, authentication
- 13. Thank you! Let’s stay connected Maxim.Salnikov@microsoft.com Twitter: https://twitter.com/webmaxru LinkedIn: https://www.linkedin.com/in/webmax/
Hinweis der Redaktion
- It’s impossible to reason about modern web application without mentioning its front-end part – extensive, feature-rich, performant, sometimes with quite sophisticated structure and build process, but after all not requiring server-side code to construct it in the runtime, i.e. static. In the Azure cloud, we now have a special service for this kind of apps (including both classic SPAs and statically generated ones), empowering developers to focus on the business logic rather than the infrastructure that builds and hosts them. In my technical session & demo, let's go through the full development flow: we scaffold a web front-end app, push it to the GitHub, set up Azure Static Web App service, enjoy the fully automatic build, and deploy to global high-availability hosting - all in a few minutes! This session will be useful for the frontend web developers who want to know more about how cloud can power up their projects and workflows. Join this session to learn about how to build, deploy, host your frontend web application on Azure cloud, and how to extend it with the authentication and API functionality.
- Connect your code repository Answer a few questions about app folder structure Three, two, one… See your app hosted on a random-name.azurestaticapps.net
- Connect your code repository Answer a few questions about app folder structure Three, two, one… See your app hosted on a random-name.azurestaticapps.net
- Connect your code repository Answer a few questions about app folder structure Three, two, one… See your app hosted on a random-name.azurestaticapps.net
- Connect your code repository Answer a few questions about app folder structure Three, two, one… See your app hosted on a random-name.azurestaticapps.net