Building Reliable Applications Using React, .NET & Azure
•Transferir como PPTX, PDF•
0 gostou•250 visualizações
![Maurice De Beijer [MVP]](https://cdn.slidesharecdn.com/profile-photo-mauricedb-48x48.jpg?cb=1696317804)
Building a small to medium size business application with React isn't terribly hard. It has been done lots of times and there is plenty of information about what works and what doesn't. However building a large, complex and mission critical application with React is another matter. How to configure reliable hosting on Azure for the front and back-end? How to track runtime errors that happen in the browser. And how to create an efficient workflow between front and back-end teams. In this session Maurice de Beijer will share his experiences in building a globally deployed application that is used by thousands of people who depend on the availability and proper functioning of the application for a safe work environment. https://azconf.dev/
Recomendados
Recomendados
Mais conteúdo relacionado
Mais procurados
Mais procurados (20)
Semelhante a Building Reliable Applications Using React, .NET & Azure
Semelhante a Building Reliable Applications Using React, .NET & Azure (20)
Mais de Maurice De Beijer [MVP]
Mais de Maurice De Beijer [MVP] (20)
Último
Último (20)
Building Reliable Applications Using React, .NET & Azure
- 1. Azure Community Conference 2021 India’s largest Azure Conference #AzConfDev
- 2. #AzConfDev Maurice de Beijer The Problem Solver Freelance lead/developer/instructor
- 3. #AzConfDev Building Reliable Applications Using React, .NET & Azure Maurice de Beijer - @mauricedb
- 4. #AzConfDev Topics • JavaScript versus TypeScript • Hosting • Test-driven development • API types and updates • Git Workflow • Feature Flags • Runtime errors
- 10. #AzConfDev Language features • Type Unions • Tuples • Optional Chaining • Nullish Coalescing operator
- 11. #AzConfDev JS Doc • Annotate your JavaScript with JS Doc types • If you made the mistake of not starting with TypeScript
- 14. #AzConfDev ES Modules Named imports instead of import default Better with tooling and discoverability
- 15. #AzConfDev React and import default
- 18. #AzConfDev Vite - During development Next Generation Frontend Tooling
- 19. #AzConfDev Azure Blob Storage – At runtime
- 24. #AzConfDev The traditional testing pyramid Manual End to End Integration testing Unit testing
- 25. #AzConfDev Both windows are fine
- 27. #AzConfDev A better testing pyramid for the web Manual End to End Integration testing Unit testing
- 30. #AzConfDev Testing Front & Back End
- 32. #AzConfDev API Types and Updates
- 34. #AzConfDev Swashbuckle for Azure Function
- 35. #AzConfDev Nswag Generates TypeScript/C# Interfaces
- 38. #AzConfDev Validate API Validate all data that crosses an external boundary User input Data from an API
- 40. #AzConfDev Long living clients Some users never close their browser The same old version of the SPA can remain active Even when a newer version is available on the server Send the client version the server with each AJAX request
- 42. #AzConfDev AJAX requests The public internet is unreliable Some requests will fail for random reasons Use a retry policy to handle network errors
- 45. #AzConfDev Workflow Use short-lived Git feature branches A few hours at most Hide new or risky code behind a feature flag Initially only available for developers/testers
- 46. #AzConfDev Release Strategy Release new features to a subset of users first Fast Ring with user opt in Percentage of users One or more companies One or more regions/countries
- 48. #AzConfDev Feature Flags A simple feature flag system is not hard But can become quite elaborate Consider using a service like Azure App Configuration Or a service like LaunchDarkly
- 53. #AzConfDev Runtime errors Runtime errors need to be tracked There is no code without bugs Features like LocalStorage will be disabled for some users Azure Application Insights works well Tracks unhandled exceptions Add an Error Boundary and track component errors
- 57. #AzConfDev Conclusion TypeScript is a must have For any serious development Use BLOB storage & CDN Easy, fast and cheap hosting Test-driven development prevents bugs Use an End to End tool like Cypress API types and updates Automate the client types Always validate the incoming data Workflow Use small and very short lived branches Use feature flags to hide new code in production Runtime errors will happen Make sure you track them
- 61. #AzConfDev Q & A
- 63. #AzConfDev THANK YOU! Building Reliable Applications Using React, .NET & Azure Maurice de Beijer @mauricedb