Building Reliable Applications Using React, .NET & Azure

May 27, 2021Download as pptx, pdf

0 likes159 views

Een kleine React applicatie bouwen met een backend is niet moeilijk. Maar wat als de applicatie groter en complexer wordt? Dan wordt het een ander verhaal. En al helemaal als het een publiek toegankelijke applicatie is. Plotseling blijkt dat allerlei vaak gedane aannames niet meer kloppen. Je krijgt te maken met netwerkstoringen en schaalbaarheid. Verschillende teams die onafhankelijk van elkaar aan de front- en backend werken. Runtime fouten die optreden omdat sommige browsers toch net even anders blijken te werken dan je verwacht. In deze sessie gaat Maurice de Beijer zijn ervaringen delen over hoe je dit aan kan pakken.

Building Reliable
ApplicationsUsing
React, .NET &Azure
Maurice de Beijer - @mauricedb

Topics
 JavaScript versusTypeScript
 Hosting
 Test-driven development
 API types and updates
 GitWorkflow
 Feature Flags
 Runtime errors
© ABL - The Problem Solver 2

Opinions
Ahead 
© ABL - The Problem Solver 3

Swiss
Cheese
Model
© ABL - The Problem Solver 4

 Maurice de Beijer
 The Problem Solver
 Microsoft MVP
 Freelance lead/developer/instructor
 Twitter: @mauricedb
 Web: http://www.TheProblemSolver.nl
 E-mail: maurice.de.beijer@gmail.com
5
© ABL - The Problem Solver

JavaScript versusTypeScript
© ABL - The Problem Solver 7

Language
features
 Type Unions
 Tuples
 OptionalChaining
 Nullish Coalescing operator
© ABL - The Problem Solver 9

JS Doc  Annotate your JavaScript with JS Doc types
 If you made the mistake of not starting withTypeScript 
© ABL - The Problem Solver 10

MappedTypes
 type RT = Readonly<T>
 type PT = Partial<T>
 type MyProps = React.ComponentProps<typeof MyComponent>
 type Returns = ReturnType<typeof someFunction>;
 type Args = Parameters<typeof someFunction>
© ABL - The Problem Solver 11

ES Modules  Named imports instead of import default
 Better with tooling and discoverability
© ABL - The Problem Solver 12

React and
import default
© ABL - The Problem Solver 13

Hosting the front-end
During development
© ABL - The Problem Solver 15

Hosting the front-end
In production
© ABL - The Problem Solver 17

Azure Blob
Storage
© ABL - The Problem Solver 18

Routing Rules
© ABL - The Problem Solver 20

Deploy
From
GitHub
© ABL - The Problem Solver 21

Test-Driven Development
© ABL - The Problem Solver 22

The traditional
testing
pyramid
Manual
End to End
Integration testing
Unit testing

A better
testing
pyramid for
the web
Manual
End to End
Integration testing
Unit testing

Testing
Front & Back
End
© ABL - The Problem Solver 28

Intercepting
AJAX
Requests
© ABL - The Problem Solver 29

APITypes andUpdates
© ABL - The Problem Solver 30

Swashbuckle
for the
Azure Function
© ABL - The Problem Solver 32

NSwag
Generates
TypeScript
Interfaces
© ABL - The Problem Solver 33

APIVersion
© ABL - The Problem Solver 34

Required
ValueTypes
© ABL - The Problem Solver 35

ValidateAPI
 Validate all data that crosses an external boundary
 User input
 Data from an API
© ABL - The Problem Solver 36

Type Mapping
© ABL - The Problem Solver 37

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
© ABL - The Problem Solver 38

Checking the
version
© ABL - The Problem Solver 39

AJAX requests
 The public internet is unreliable
 Some requests will fail for random reasons
 Use a retry policy to handle network errors
© ABL - The Problem Solver 40

Retry Policy
© ABL - The Problem Solver 41

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
© ABL - The Problem Solver 43

Feature Flags
© ABL - The Problem Solver 45

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
© ABL - The Problem Solver 46

Azure
Configuration
Function
© ABL - The Problem Solver 47

React
Configuration
Provider
© ABL - The Problem Solver 48

Conditional
Rendering
© ABL - The Problem Solver 49

Runtime errors
© ABL - The Problem Solver 50

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
© ABL - The Problem Solver 51

Runtime errors
© ABL - The Problem Solver 52

Application
Insights
© ABL - The Problem Solver 53

Application
Insights
© ABL - The Problem Solver 54

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
© ABL - The Problem Solver 55

Maurice de Beijer
@mauricedb
maurice.de.beijer
@gmail.com
© ABL - The Problem Solver 56

This document discusses several topics related to frontend development including TypeScript, hosting, testing, APIs, and runtime errors. It provides information on using TypeScript for type safety and features like mapped types and ES modules. For hosting, it recommends Azure Blob storage and CDN for production and Vite for development. It also discusses test-driven development including using Cypress for end-to-end tests. Managing API types and updates using OpenAPI and NSwag is described as well as handling runtime errors with Application Insights.

Building large and scalable mission critical applications with ReactMaurice De Beijer [MVP]

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, distributed and mission critical application with React is another matter. Add occasional poor mobile connectivity and things become really challenging. That doesn't mean that it is impossible, it is just harder to architect and develop. 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://www.meetup.com/nl-NL/tilburg-tech-tuesdays/events/277150883/

I am hooked on ReactMaurice De Beijer [MVP]

The document discusses React hooks, a new addition to React that allows using state and other React features without writing classes. It provides an overview of hooks like useState, useEffect, and useContext that allow managing state, side effects, and context in function components. It also covers rules for using hooks, examples of custom hooks, and notes that classes will continue to work while hooks provide an alternative functional style.

Story Testing Approach for Enterprise Applications using Selenium FrameworkOleksiy Rezchykov

Neotys PAC - Stijn SchepersNeotys_Partner

Neotys organized its first Performance Advisory Council in Scotland, the 14th & 15th of November. With 15 Load Testing experts from several countries (UK, France, New-Zeland, Germany, USA, Australia, India…) we explored several theme around Load Testing such as DevOps, Shift Right, AI etc. By discussing around their experience, the methods they used, their data analysis and their interpretation, we created a lot of high-value added content that you can use to discover what will be the future of Load Testing. You want to know more about this event ? https://www.neotys.com/performance-advisory-council

Neotys PAC - Ian MolyneauxNeotys_Partner

Feature ToggleBryan Liu

Feature toggles allow companies to decouple development from deployment, reduce risks from merging code, and experiment with new features without impacting production. They provide an alternative to feature branches for releasing code incrementally. Companies like LinkedIn and Facebook use feature toggles extensively to enable continuous deployment and A/B testing in a safe manner. Frameworks exist for implementing feature toggles in various programming languages.

Virtual Dreamin Salesforce DevOps Top 10Richard Clark

Modern software testing and processes 2019Karim Fanadka

This document discusses modern functional testing and DevOps. It provides an overview of the speaker including their experience and role. It then discusses QA team structures, timelines versus tasks, and how QA needs to adapt to keep up with faster release cycles. Various testing approaches are presented including automation, manual testing, different test environments, API and integration testing. The importance of automation, regression testing and tracking work is emphasized to support continuous delivery.

DevOps: Find Solutions, Not More DefectsTechWell

The promise of DevOps is that we can push new ideas out to market faster while avoiding delivering serious defects into production. Andreas Grabner explains that testers are no longer measured by the number of defect reports they enter, nor are developers measured by the lines of code they write. As a team, you are measured by how fast you can deploy high quality functionality to the end user. Achieving this goal requires testers to increase their skills. It’s all about finding solutions—not just problems. Testers must transition from reporting “app crashes” to providing details such as “memory leak caused by bad cache implementation.” Instead of reporting “it’s slow,” testers must discover “wrong hibernate configuration causes too much traffic from the database.” Using three real-life examples, Andreas illustrates what it takes for testing teams to become part of the DevOps transformation—bringing more value to the entire organization.

Adventures with MicroservicesAnand Agrawal

I have spent some time working on a project, and built 8 micro services and 2 applications, and planned to carve out a few more. Deployment was carried out in a farm of 25 servers in production with a single click in less than 3 minutes. This presentation is about the experiences with building a micro service based architecture - the good, the bad and the ugly. - What are micro services? - When/Why/How micro services? - Why NOT micro services? - Managing Continuous Integration and Continuous Delivery with micro services - A few design principles that we followed and that worked for us

The Key to DevOps? Testing Early in the PipelineDevOps.com

As teams embrace DevOps, quality becomes a bottleneck for rapid development and delivery. Traditional QA practices of functional testing release candidates are not cutting it in this new era of lightning fast development. Teams are finding that they need to test early and often to rapidly surface error during development to reach continuous delivery. Learn how to implement E2E testing at the earliest stages of development: from initial code commit, to pull requests with ephemeral environments, and high confidence merges. This practice optimizes DevOps software development by enabling developers to solve issues earlier, proactively update tests (so they don’t break later) and become even more productive. Join mabl software engineer Joe Lust to hear how the mabl team puts these ideas into practice daily and how it has benefited their team and product. Additionally, you will learn about: Impact of DevOps on testing Benefits of testing earlier in development Best practices of how mabl does this at mabl

Patterns of a "Good" Test Automation Framework, Locators & DataAgile Testing Alliance

This document discusses common patterns used in test automation frameworks, including page object, business layer, singleton, composition, and factory patterns. It describes the page object pattern and limitations like test intent becoming imperative. The business layer page object pattern addresses these by validating business requirements. Test data patterns are also discussed, with criteria like data being complex, unique, and potentially dynamic. External files, properties, and databases are examples of specifying test data. Locator patterns include specifying locators in page objects or separate files. Overall, patterns aid in communication, reduce complexity, and help tests be of production quality and easier to implement, maintain, and scale. The best pattern depends on the specific context.

Introduction to lambda behaveRichardWarburton

Are you a Java developer and you've seen the fluent and modern specification frameworks available in other programming languages such as Spock or jasmine and wondering why we can't have the same thing? Then Lambda Behave is made for you! It uses numerous Java 8 features in order to enable cleaner and more readable tests and specifications. This quickie will introduce the framework, explain why you would want to use it over JUnit and cover some of its cool features, including: • How to write fluent and clean specifications in your domain language • How to write data driven specifications • How to integrate these into your build tool or IDE • How IDE usage can influence library design for the better http://richardwarburton.github.io/lambda-behave/

API Testing With Katalon StudioKnoldus Inc.

Katalon Studio is a free and robust automation solution for API, Web, and Mobile testing. It integrates all necessary components with built-in keywords and project templates into a complete automation framework. Katalon Studio is easy to use for beginners but still offers advanced capabilities for experienced users. This solution is trusted by an active community of over 150K users from 150+ countries around the world. In this knolx, we’ll take a look at what is API Testing and how the katalon studio is helpful in API Testing.

ATAGTR2017 Protractor Cucumber BDD ApproachAgile Testing Alliance

Branching Strategies: Feature Branches vs Branch by AbstractionChris Birchall

What's new for VSTS & TFSPieter Gheysens

Ever since the VSTS Product Team has started working in 3 weeks sprints to deliver new features to the product, it has been a real eye-opener to witness how fast the product is evolving and how many new features has been introduced since the beginning of Team Foundation Service, Visual Studio Online and now the current name of the product: Visual Studio Team Services (VSTS). In this demo-heavy session we will have a quick look at some of the new interesting features that were added in the last couple of months.

How to Build Front-End Web Apps that Scale - FutureJSPhil Leggetter

Developing large apps is difficult. Ensuring that code is consistent, well structured, tested, maintainable and has an architecture that encourages enhancement is essential. When it comes to large server-focused apps, solutions to this problem have been tried and tested. But, with the ongoing dramatic shift of functionality into the browser, how do you achieve this when building Front-End Web Apps? In this talk we’ll cover the signs to watch out for as your HTML5 SPA grows and provide examples of some of the tooling types that can contribute-to - as well as ease - the growing pains. Finally, we’ll demonstrate how tooling can be used to support a set of conventions, practices and principles that enable a productive developer workflow where the first line of code is feature code, features can be developed in isolation, code conflicts are avoided by grouping assets by feature and features are composed into apps. The demonstrations will use the BladeRunnerJS open source developer toolkit, but the concepts are widely applicable.

Feature togglesAnand Agrawal

Continuous Delivery for Dynamics 365/CRMWael Hamze

Continuous Integration, Deploy, Test From Beginning To End 2014Clever Moe

Frank Cohen, CTO/Founder at Appvance, teaches developers and testers how to become more closely aligned with easily deployable and configurable tools such as Jenkins CI and performance testing platforms.   Learn how to:  * Merge Agile SDLC and Performance Testing  * Speed-up test operations by configuring Jenkins for automatic build, deploy, and tests  * Instantly identify functional and performance issues using Jenkins as a performance dashboard  * Use effective choices in Jenkins deployment – in the cloud, hosted, or in your datacenter

Rspec and Capybara Intro Tutorial at RailsConf 2013Brian Sam-Bodden

Behavior-Driven Development and Acceptance Testing are heavily intertwined and in many aspects are one and the same. Both focus on starting at the outer layers of your application by concentrating on what matter to users; behavior. In this session/workshop we'll talk about how testing can be used both for specifying your application yet to be develop expected behavior and as accurate, running documentation that can be used to validate your stakeholder's acceptance criteria. We'll talk about the different types of testing and do a few hands-on exercises to flesh out a Rails application with RSpec and Capybara.

How We Build Confidence with Continuous Integration and Automated TestingGareth Marland

Continuous integration and automated front end testing provide a small development team confidence in their work without a dedicated testing team. The solution involves running unit tests and automated front end tests on every code check-in through a continuous integration process managed across three servers for building, testing, and staging. This allows any new features to be constantly tested as they are added, catching issues early and providing confidence that changes did not break existing functionality.

DevOps and Visual Studio Team Services WinWire Technologies Inc

Qtp testingRamu Palanki

Test automation emulates user actions on an application by clicking buttons, selecting menus, navigating screens, and adding or extracting data. It provides speed, reliability, and avoids human errors for repetitive tasks. Test automation will avoid errors, establish reproducible test steps, and be useful for regression and compatibility testing to ensure stability. However, test automation cannot replace manual testing and will not find more bugs than the underlying test cases are designed to find.

Integration with saucelabs over private networkTest Armada

This document discusses Sauce Labs' advanced features and integration with private networks. It introduces Sauce Connect, which allows testing of internal sites through a secure connection between Sauce Labs and a private network. It then discusses Sauce Connect setup, high availability/load balancing, and best practices. The document goes on to address problems with tunnels requiring frequent restarting and becoming unresponsive. It proposes solutions in Raven, Lookout and Orchestrator to improve availability, scalability, alerting and monitoring of tunnels. Finally, it discusses Walmart's usage of these tools and the impact on reducing testing time.

Practice TypeScript Techniques Building React Server Components AppMaurice De Beijer [MVP]

This document discusses various TypeScript techniques for building React server components applications. It covers topics like compiling code to catch errors, using the satisfies operator, custom type mappings, opaque types, readonly types, template literal types, and typing JSON files. The document provides examples for each technique and emphasizes how they can improve type safety, prevent errors, and optimize code. It also recommends applying these techniques and running type checks on pull requests.

"Impact of front-end architecture on development cost", Viktor TurskyiFwdays

I have heard many times that architecture is not important for the front-end. Also, many times I have seen how developers implement features on the front-end just following the standard rules for a framework and think that this is enough to successfully launch the project, and then the project fails. How to prevent this and what approach to choose? I have launched dozens of complex projects and during the talk we will analyze which approaches have worked for me and which have not.

Building high performance web applicationsMaurice De Beijer [MVP]

This document discusses building high performance web applications. It covers topics like what defines a fast application, useful tooling for measuring performance like the Chrome DevTools and WebPageTest, code splitting techniques, server side rendering, only rendering content above the fold, and minimizing HTTP requests and latency. The presenter emphasizes avoiding unnecessary work, doing as little as possible to display initial content to the user, and leveraging the browser and server capabilities to build fast and high performing web applications.

More Related Content

What's hot (19)

Modern software testing and processes 2019Karim Fanadka

DevOps: Find Solutions, Not More DefectsTechWell

Adventures with MicroservicesAnand Agrawal

The Key to DevOps? Testing Early in the PipelineDevOps.com

Patterns of a "Good" Test Automation Framework, Locators & DataAgile Testing Alliance

Introduction to lambda behaveRichardWarburton

API Testing With Katalon StudioKnoldus Inc.

ATAGTR2017 Protractor Cucumber BDD ApproachAgile Testing Alliance

Branching Strategies: Feature Branches vs Branch by AbstractionChris Birchall

What's new for VSTS & TFSPieter Gheysens

How to Build Front-End Web Apps that Scale - FutureJSPhil Leggetter

Feature togglesAnand Agrawal

Continuous Delivery for Dynamics 365/CRMWael Hamze

Continuous Integration, Deploy, Test From Beginning To End 2014Clever Moe

Rspec and Capybara Intro Tutorial at RailsConf 2013Brian Sam-Bodden

How We Build Confidence with Continuous Integration and Automated TestingGareth Marland

DevOps and Visual Studio Team Services WinWire Technologies Inc

Qtp testingRamu Palanki

Integration with saucelabs over private networkTest Armada

Modern software testing and processes 2019Karim Fanadka

DevOps: Find Solutions, Not More DefectsTechWell

Adventures with MicroservicesAnand Agrawal

The Key to DevOps? Testing Early in the PipelineDevOps.com

Patterns of a "Good" Test Automation Framework, Locators & DataAgile Testing Alliance

Introduction to lambda behaveRichardWarburton

API Testing With Katalon StudioKnoldus Inc.

ATAGTR2017 Protractor Cucumber BDD ApproachAgile Testing Alliance

Branching Strategies: Feature Branches vs Branch by AbstractionChris Birchall

What's new for VSTS & TFSPieter Gheysens

How to Build Front-End Web Apps that Scale - FutureJSPhil Leggetter

Feature togglesAnand Agrawal

Continuous Delivery for Dynamics 365/CRMWael Hamze

Continuous Integration, Deploy, Test From Beginning To End 2014Clever Moe

Rspec and Capybara Intro Tutorial at RailsConf 2013Brian Sam-Bodden

How We Build Confidence with Continuous Integration and Automated TestingGareth Marland

DevOps and Visual Studio Team Services WinWire Technologies Inc

Qtp testingRamu Palanki

Integration with saucelabs over private networkTest Armada

Similar to Building Reliable Applications Using React, .NET & Azure (20)

Practice TypeScript Techniques Building React Server Components AppMaurice De Beijer [MVP]

"Impact of front-end architecture on development cost", Viktor TurskyiFwdays

Building high performance web applicationsMaurice De Beijer [MVP]

Building Reliable Applications Using React, .NET & AzureMaurice De Beijer [MVP]

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/

Building high performance web applicationsMaurice De Beijer [MVP]

This document discusses building high performance web applications. It covers topics like what defines a fast application, tools for measuring performance like Chrome DevTools and WebPageTest, techniques like code splitting, server-side rendering, only rendering content above the fold, and using service workers. The goal is to avoid unnecessary work, optimize code and assets, and leverage the browser and network effectively to improve performance.

Good Coding Practices with JavaScript🏁 Pierre-Henry Soria 💡

Best practices for JavaScript RIAsCarlos Ble

This document discusses best practices for building JavaScript rich internet applications (RIAs). It covers topics like testing techniques, design patterns, testing tools, and approaches like test-driven development. Some of the key recommendations include writing code for humans rather than machines, keeping servers simple as an event bus between clients, and focusing on concepts rather than specific tools. Test-driven development is emphasized as important for code quality and maintainability.

Building a starter kit cedg20181010Joe Walling

The document discusses building a starter kit for modern web apps with ASP.NET and ReactJS. It describes why starter kits are useful by saving time and removing non-functional decisions. It also outlines common components included in starter kits like build automation, asset bundling, and testing frameworks. The document then discusses specific choices for the starter kit like using Yarn, React, and ES6 modules for building the front-end.

Perfomatix - NodeJS Coding StandardsPerfomatix Solutions

The productive developer guide to ReactMaurice De Beijer [MVP]

Best Practices in apps development with Titanium Appcelerator Alessio Ricco

This document provides best practices for developing apps using Titanium Appcelerator. It discusses software quality characteristics from both the user and developer perspectives. Key aspects of a good software project are stability, performance, rapid development, and readability. Specific practices covered include avoiding global scope, nulling object references, using namespaces, lazy script loading, avoiding memory leaks with event listeners, optimizing images, and best practices for databases.

BEST PRACTICES PER LA SCRITTURA DI APPLICAZIONI TITANIUM APPCELERATOR - Aless...Whymca

This document provides best practices for developing apps using Titanium Appcelerator. It discusses software quality characteristics from both the user and developer perspectives. Key aspects addressed include stability, performance, rapid development, and readability of code. Specific tips are given around error handling, optimization, reuse of code snippets, use of comments, and avoiding global scope issues. The document emphasizes writing stable, performant code that is also rapid to develop and readable.

Refactoring JavaScript turning bad code into good code First Edition Burchardsimbajdzikie4

Leveling up choosing your client-side inventorySam Larko

This document provides an overview of various client-side JavaScript libraries and tools that can be used for development. It discusses categories of libraries like front-end frameworks (Angular, React, Vue), additional flavors of JavaScript (ES6, TypeScript, CoffeeScript), CSS options (vanilla CSS, SASS, Bootstrap), and common tools for scaffolding, building, packaging and managing code. The document aims to help developers choose appropriate client-side options for their projects based on considerations like existing code, team experience, library size and support.

ES3-2020-06 Test Driven Development (TDD)David Rodenas

Pros and Reasons to Hire a Dedicated React Js DeveloperCodeRower

Hiring a dedicated React.js developer can be a strategic move for any project or organization, offering a wealth of benefits that extend beyond mere coding proficiency. These developers bring to the table a deep understanding of React.js, its ecosystem, and best practices, enabling them to architect robust solutions that are both efficient and scalable. Leveraging React.js's component-based architecture, they can expedite development cycles by building reusable UI elements, thereby accelerating time-to-market without compromising quality. Their expertise ensures the production of clean, maintainable code that adheres to industry standards, reducing technical debt and facilitating future updates and enhancements. Moreover, dedicated React.js developers offer customized solutions tailored to the unique requirements of each project, collaborating closely with stakeholders to understand their goals, constraints, and preferences. This collaborative approach not only ensures alignment with business objectives but also fosters innovation and creativity, resulting in solutions that stand out in a crowded marketplace. Beyond technical prowess, hiring dedicated React.js developers also offers strategic advantages such as scalability and cross-platform compatibility. With React.js's inherent scalability, these developers can architect applications that gracefully handle increased user loads and evolving business requirements, future-proofing your investment and ensuring long-term viability. Furthermore, their proficiency in React Native allows for the development of cross-platform applications, enabling you to reach a wider audience with a single codebase, thereby reducing development time and costs. Additionally, by outsourcing development to dedicated specialists, organizations can realize cost savings compared to hiring full-time employees, as they eliminate overhead costs such as salaries, benefits, and infrastructure. Furthermore, dedicated React.js developers provide ongoing support and maintenance, ensuring that your application remains performant, secure, and up-to-date even after the initial development phase. Their proactive approach to bug fixing, optimization, and security updates not only enhances the user experience but also minimizes downtime and mitigates risks, safeguarding your investment and reputation. Moreover, outsourcing React.js development allows organizations to focus on their core competencies and strategic initiatives, leveraging their resources more effectively and driving innovation and growth. In conclusion, hiring dedicated React.js developers is not just about writing code—it's about partnering with skilled professionals who can add value at every stage of the development lifecycle. From architecting scalable solutions to providing ongoing support and maintenance, these developers play a crucial role in the success of projects, enabling organizations to innovate, compete, and thrive in today's dynamic business landscape.

Performance - a challenging craftFabian Lange

Choosing Javascript Libraries to Adopt for DevelopmentEdward Apostol

"Sorting out the JS Mess" was the title of my sample presentation I led at @Red Academy, talking about how the history of the development workflow with Javascript and how it influences what tools, libraries and steps we take to develop web and mobile apps. I featured a demo using React, and discussed Angular 2, JQuery, Meteor, and other Javascript libraries and frameworks from the context of my development experience.

Better React state management with ReduxMaurice De Beijer [MVP]

This document outlines a workshop on using Redux for state management in React applications. It introduces Redux, its core principles of single source of truth, state is read-only, and changes are made with pure functions. It demonstrates setting up a sample application with Redux, including actions, reducers, the store, middleware, and connecting React components. The document guides integrating Redux for user login/logout, loading movies data, playing movies, and filtering movies.

Practice TypeScript Techniques Building React Server Components AppMaurice De Beijer [MVP]

"Impact of front-end architecture on development cost", Viktor TurskyiFwdays

Building high performance web applicationsMaurice De Beijer [MVP]

Building Reliable Applications Using React, .NET & AzureMaurice De Beijer [MVP]

Building high performance web applicationsMaurice De Beijer [MVP]

Good Coding Practices with JavaScript🏁 Pierre-Henry Soria 💡

Best practices for JavaScript RIAsCarlos Ble

Building a starter kit cedg20181010Joe Walling

Perfomatix - NodeJS Coding StandardsPerfomatix Solutions

The productive developer guide to ReactMaurice De Beijer [MVP]

Best Practices in apps development with Titanium Appcelerator Alessio Ricco

BEST PRACTICES PER LA SCRITTURA DI APPLICAZIONI TITANIUM APPCELERATOR - Aless...Whymca

Refactoring JavaScript turning bad code into good code First Edition Burchardsimbajdzikie4

Leveling up choosing your client-side inventorySam Larko

ES3-2020-06 Test Driven Development (TDD)David Rodenas

Pros and Reasons to Hire a Dedicated React Js DeveloperCodeRower

Performance - a challenging craftFabian Lange

Choosing Javascript Libraries to Adopt for DevelopmentEdward Apostol

Better React state management with ReduxMaurice De Beijer [MVP]

More from Maurice De Beijer [MVP] (20)

Production-ready Next.js App with Cursor AIMaurice De Beijer [MVP]

Code Less, Create More: AI-Driven App Development for React Devs. Join us for a workshop designed for React developers eager to harness the power of AI to streamline their app development process. In "Code Less, Create More," you'll learn how to build applications using the Cursor IDE with the power of AI and minimal manual coding. Explore how Cursor, an AI-enhanced code editor, revolutionizes your coding experience by seamlessly integrating with your existing workflow. Uncover its advanced capabilities: predicting your next edits, offering real-time code suggestions, and comprehending your project's architecture. This allows you to channel your energy into creativity and innovation rather than grappling with syntax and repetitive tasks. We'll guide you through initializing a Next.js project, demonstrating how to utilize AI tools to efficiently craft dynamic, responsive applications. By the workshop's conclusion, you'll possess the skills to construct sophisticated software with reduced coding effort, empowering you to become a more productive and innovative developer. Whether you're a seasoned React developer or new to AI-assisted coding, this workshop will equip you with the knowledge and tools to elevate your development projects to the next level.

Building Robust Web Applications with Test-Driven Development and Playwright:...Maurice De Beijer [MVP]

Get ready to take your front-end development skills to the next level with our hands-on workshop. In this four-hour session, you will learn the ins and outs of test-driven development using Playwright, a powerful tool that will revolutionize your web development workflow. Are you tired of spending endless hours debugging issues in your web applications? Dive deep into writing tests before writing code, ensuring top-notch quality and functionality in your web applications. Say goodbye to manual testing and hello to automated tests that catch bugs early in the development process. Join us for an interactive and fun workshop where you'll gain the confidence to elevate your front-end development game and build web applications like a pro. Don't let common pain points like inconsistent UI behavior or regression issues slow you down - learn how to effectively use Playwright to avoid these pitfalls and streamline your development process. Don't miss this opportunity to unlock the full potential of test-driven development with Playwright – sign up now and get ready to uplevel your skills!

Mastering React Server Components and Server Actions in React 19Maurice De Beijer [MVP]

Explore the world of React Server Components, seamlessly blending server-side rendering with client-side interactivity for unmatched performance and user experience. Dive into React Server Actions to see how they combine client-side interactivity with server-side logic, making it easier to develop interactive applications without traditional API constraints. Get hands-on experience with practical exercises, real-world examples, and expert guidance on implementing these technologies into your projects. Learn essential topics such as the differences between Server and Client Components, optimizing data fetching, passing data effectively, and maximizing performance with new React hooks like useActionState, useFormStatus and useOptimistic. Whether you're new to React or a seasoned pro, this workshop will equip you with the knowledge and tools to elevate your web development skills. Stay ahead of the curve and master the cutting-edge technology of React 19. Don't miss out - sign up now and unleash the full power of React!

A foolproof Way to Estimate a Software ProjectMaurice De Beijer [MVP]

Let's face the facts and admit it: Estimating how long it will take to build software is hard. Why is estimation so hard? Well there are some reasons for that. Many people tend to be optimistic about how long it will take to do a task. Not surprising when we learn the way memory works. It tends to skew our experiences from old projects. We often forget the many small setbacks encountered. Another reason is that many tasks are not included in the initial estimate. They only become visible over time. Does that mean that estimation is impossible and a waste of time? Not at all. Many software development activities are commercial activities. Starting something without even a rough estimate of what the costs and timeline will be is risky at best.

Surati Tech Talks 2022 / Build reliable Svelte applications using CypressMaurice De Beijer [MVP]

Tired of having users email you that your Svelte application is broken? Turns out that building reliable applications is hard and requires a lot of testing. You can write unit tests but quite often these all pass and the application is still broken. Why? Because they test parts of the application in isolation. But for a reliable application we need more. We need to make sure that all parts, including the backend API’s, work together as intended. Cypress is a great tool to achieve this. It will test you complete web application in the browser and use it like a real world user would. In this session Maurice will show you how to use Cypress during development and on the CI server with Svelte. He will share tips and tricks to make your tests more resilient and more like how an actual end user would behave.

Build reliable Svelte applications using CypressMaurice De Beijer [MVP]

Tired of having users email you that your web application is broken? Turns out that building reliable web applications is hard and requires a lot of testing. You can write unit tests but quite often these all pass and the application is still broken. Why? Because they test parts of the application in isolation. But for a reliable application we need more. We need to make sure that all parts work together as intended. Cypress is a great tool to achieve this. It will test you complete web application in the browser and use it like a real user would. In this session Maurice will show you how to use Cypress during development and on the CI server. He will share tips and tricks to make your tests more resilient and more like how an actual end user would behave.

Concurrent Rendering Adventures in React 18Maurice De Beijer [MVP]

With the release of React 18 we finally get the long awaited concurrent rendering. But how is that going to affect your application? What are the benefits of concurrent rendering in React? What do you need to do to switch to concurrent rendering when you upgrade to React 18? And what if you don’t want or can’t use concurrent rendering yet? There are some behavior changes you need to be aware of! In this workshop we will cover all of those subjects and more. Join me with your laptop in this interactive workshop. You will see how easy it is to switch to concurrent rendering in your React application. You will learn all about concurrent rendering, SuspenseList, the startTransition API and more. https://reactadvanced.com/workshops-3h

Why I am hooked on the future of ReactMaurice De Beijer [MVP]

The React team rewrote the book on developing components. Before we had a choice between classes and functional components. Yet many components needed to be classes. A functional component was often too limited. Now, using hooks, we can extend functional components to be as powerful as we want. Suspense and asynchronous rendering is in the future of React. It will make large applications much more responsive and easier to deal with. Getting started with suspense and asynchronous rendering isn't hard as you will discover. Come to this session to learn what React hooks are and how to get started using hooks. But be warned, once seen React hooks can’t be unseen and your React components will never be the same again.

Building reliable web applications using CypressMaurice De Beijer [MVP]

Getting started with React Suspense and concurrent renderingMaurice De Beijer [MVP]

React keeps on evolving and making hard things easier for the average developer. One case, where React was not particularly hard but very repetitive, is working with AJAX request. There is always the trinity of loading, success and possible error states that had to be handled each time. But no more as the <Suspense /> component makes life much easier. Another case is performance of larger and complex applications. Usually React is fast enough but with a large application rendering components can conflict with user interactions. Concurrent rendering will, mostly automatically, take care of this. You will learn all about using , showing loading indicators and handling errors. You will see how easy it is to get started with concurrent rendering. You will make suspense even more capable by combining it with concurrent rendering, the useTransition() hook and the component.

React suspense, not just for Alfred HitchcockMaurice De Beijer [MVP]

The React team has rewritten the book on developing components several times. This time they have introduced Suspense. Amongst other thing this makes splitting your application into multiple bundles easier. But that is only the start as the real innovation comes when loading data. Gone are the side effect hooks with the typical loading, loaded and error states. Instead we can suspend components when loading data. Need to do multiple request? No problem you can suspend multiple components at the same time if you want. Need to trap errors? No problem just use a standard React error boundary. Come to this session to learn what React Suspense can do for you.

From zero to hero with the Reactive extensions for JavaScriptMaurice De Beijer [MVP]

Reactive and functional programming, you have probably heard the term mentioned before. It’s supposed to be really cool and a good practice. But what is reactive programming exactly and how to get started with it in JavaScript? And why does Angular start using the reactive extensions for JavaScript (RxJS) instead of standard promises? In this presentation, Maurice is going to show you how to get started with RxJS, the JavaScript implementation of the ReactiveX library. You will learn why using RxJS is a great way of dealing with streams of events in an asynchronous and functional way.

Why I am hooked on the future of ReactMaurice De Beijer [MVP]

This document discusses the history and evolution of React components from classes to hooks. It covers the problems with class components, such as complex this bindings and lifecycle methods. Hooks are introduced as a way to use state and side effects in function components by using functions like useState, useEffect and useContext. Custom hooks are also discussed as a way to extract component logic into reusable functions. The document emphasizes that hooks are optional and classes will continue to work, but hooks allow for more flexible and composable components.

The new React Maurice De Beijer [MVP]

This document summarizes React hooks and new features in a presentation. It introduces basic hooks like useState and useEffect, and more advanced hooks such as useReducer, useContext and custom hooks. It also covers new features like lazy loading components, concurrent React rendering, and the potential for ReactCache to improve data loading. The goal is to explain the future of React with its increased use of hooks and functional programming principles.

From zero to hero with the reactive extensions for JavaScriptMaurice De Beijer [MVP]

Why I am hooked on the future of ReactMaurice De Beijer [MVP]

The document discusses the history and evolution of React components from classes to hooks. It introduces hooks as a new way to use state and other React features without writing classes. Hooks allow extracting component logic into reusable functions. This improves code reuse and makes components more readable and composable. The document outlines the basic hooks like useState, useEffect, and useContext as well as additional hooks and rules for using hooks.

Create flexible React applications using GraphQL apisMaurice De Beijer [MVP]

Using restful APIs can be hard on your React applications. Before you know it, you are doing lots of parallel queries to the server. Using GraphQL instead of REST might help a lot. Instead of downloading many complete resources each component declares its own needs. Then the GraphQL client library then combines these requirements. The result is a single optimized query for the server. In this session, Maurice de Beijer is going to show you how to get started with GraphQL in your React applications.

Create flexible react applications using GraphQL API'sMaurice De Beijer [MVP]

Docker for a .NET web developerMaurice De Beijer [MVP]

You have probably heard about Docker, these days it is a popular topic with cloud computing. But what does it take for a .NET developer to start with Docker? And where can you use it? Of course, you can deploy an application to the cloud using Docker. But you can also use Docker very effectively as a support tool when developing or testing. In this session, Maurice de Beijer will show you some of the many opportunities to use Docker.

From zero to hero with the reactive extensions for JavaScriptMaurice De Beijer [MVP]

Production-ready Next.js App with Cursor AIMaurice De Beijer [MVP]

Building Robust Web Applications with Test-Driven Development and Playwright:...Maurice De Beijer [MVP]

Mastering React Server Components and Server Actions in React 19Maurice De Beijer [MVP]

A foolproof Way to Estimate a Software ProjectMaurice De Beijer [MVP]

Surati Tech Talks 2022 / Build reliable Svelte applications using CypressMaurice De Beijer [MVP]

Build reliable Svelte applications using CypressMaurice De Beijer [MVP]

Concurrent Rendering Adventures in React 18Maurice De Beijer [MVP]

Why I am hooked on the future of ReactMaurice De Beijer [MVP]

Building reliable web applications using CypressMaurice De Beijer [MVP]

Getting started with React Suspense and concurrent renderingMaurice De Beijer [MVP]

React suspense, not just for Alfred HitchcockMaurice De Beijer [MVP]

From zero to hero with the Reactive extensions for JavaScriptMaurice De Beijer [MVP]

Why I am hooked on the future of ReactMaurice De Beijer [MVP]

The new React Maurice De Beijer [MVP]

From zero to hero with the reactive extensions for JavaScriptMaurice De Beijer [MVP]

Why I am hooked on the future of ReactMaurice De Beijer [MVP]

Create flexible React applications using GraphQL apisMaurice De Beijer [MVP]

Create flexible react applications using GraphQL API'sMaurice De Beijer [MVP]

Docker for a .NET web developerMaurice De Beijer [MVP]

From zero to hero with the reactive extensions for JavaScriptMaurice De Beijer [MVP]

Recently uploaded (20)

Boosting MySQL with Vector Search -THE VECTOR SEARCH CONFERENCE 2025 .pdfAlkin Tezuysal

As the demand for vector databases and Generative AI continues to rise, integrating vector storage and search capabilities into traditional databases has become increasingly important. This session introduces the *MyVector Plugin*, a project that brings native vector storage and similarity search to MySQL. Unlike PostgreSQL, which offers interfaces for adding new data types and index methods, MySQL lacks such extensibility. However, by utilizing MySQL's server component plugin and UDF, the *MyVector Plugin* successfully adds a fully functional vector search feature within the existing MySQL + InnoDB infrastructure, eliminating the need for a separate vector database. The session explains the technical aspects of integrating vector support into MySQL, the challenges posed by its architecture, and real-world use cases that showcase the advantages of combining vector search with MySQL's robust features. Attendees will leave with practical insights on how to add vector search capabilities to their MySQL systems.

What is Oracle EPM A Guide to Oracle EPM Cloud Everything You Need to KnowSMACT Works

In today's fast-paced business landscape, financial planning and performance management demand powerful tools that deliver accurate insights. Oracle EPM (Enterprise Performance Management) stands as a leading solution for organizations seeking to transform their financial processes. This comprehensive guide explores what Oracle EPM is, its key benefits, and how partnering with the right Oracle EPM consulting team can maximize your investment.

Cybersecurity Fundamentals: Apprentice - Palo Alto CertificateVICTOR MAESTRE RAMIREZ

Compliance-as-a-Service document pdf textEarthling security

Earthling Security’s Compliance as a Service (CaaS) delivers ongoing, end-to-end support to help organizations meet and maintain complex cybersecurity and regulatory standards like FedRAMP, FISMA, NIST 800-53, and more. We combine expert advisory, automated tools, and continuous monitoring to reduce your compliance burden, lower risk, and ensure you stay audit-ready — all through a scalable, subscription-based model.

Agentic AI: Beyond the Buzz- LangGraph Studio V2Shashikant Jagtap

AI Creative Generates You Passive Income Like Never BeforeSivaRajan47

For years, building passive income meant traditional routes—stocks, real estate, or online businesses that required endless hours of setup and maintenance. But now, Artificial Intelligence (AI) is redefining the landscape. We’re no longer talking about automation in the background; we’re entering a world where AI creatives actively design, produce, and monetize content and products, opening the floodgates for passive income like never before. Imagine AI tools writing books, designing logos, building apps, editing videos, creating music, and even selling your digital products 24/7—without you lifting a finger after setup. This isn't the future. It’s happening right now. And if you act fast, you can ride the wave before it becomes saturated. In this in-depth guide, we’ll show you how to tap into AI creativity for real, sustainable, passive income streams—no fluff, no generic tips—just actionable, traffic-driving insights.

Azure vs AWS Which Cloud Platform Is Best for Your Business in 2025Infrassist Technologies Pvt. Ltd.

Evaluation Challenges in Using Generative AI for Science & Technical ContentPaul Groth

Evaluation Challenges in Using Generative AI for Science & Technical Content. Foundation Models show impressive results in a wide-range of tasks on scientific and legal content from information extraction to question answering and even literature synthesis. However, standard evaluation approaches (e.g. comparing to ground truth) often don't seem to work. Qualitatively the results look great but quantitive scores do not align with these observations. In this talk, I discuss the challenges we've face in our lab in evaluation. I then outline potential routes forward.

End-to-end Assurance for SD-WAN & SASE with ThousandEyesThousandEyes

Extend-Microsoft365-with-Copilot-agents.pptxhoang971

ELNL2025 - Unlocking the Power of Sensitivity Labels - A Comprehensive Guide....Jasper Oosterveld

Sensitivity labels, powered by Microsoft Purview Information Protection, serve as the foundation for classifying and protecting your sensitive data within Microsoft 365. Their importance extends beyond classification and play a crucial role in enforcing governance policies across your Microsoft 365 environment. Join me, a Data Security Consultant and Microsoft MVP, as I share practical tips and tricks to get the full potential of sensitivity labels. I discuss sensitive information types, automatic labeling, and seamless integration with Data Loss Prevention, Teams Premium, and Microsoft 365 Copilot.

Dancing with AI - A Developer's Journey.pptxElliott Richmond

In this talk, Elliott explores how developers can embrace AI not as a threat, but as a collaborative partner. We’ll examine the shift from routine coding to creative leadership, highlighting the new developer superpowers of vision, integration, and innovation. We'll touch on security, legacy code, and the future of democratized development. Whether you're AI-curious or already a prompt engineering, this session will help you find your rhythm in the new dance of modern development.

TimeSeries Machine Learning - PyData London 2025Suyash Joshi

Improving Developer Productivity With DORA, SPACE, and DevExJustin Reock

Jira Administration Training – Day 1 : IntroductionRavi Teja

DevOps in the Modern Era - Thoughtfully Critical PodcastChris Wahl

soulmaite review - Find Real AI soulmate reviewSoulmaite

Looking for an honest take on Soulmaite? This Soulmaite review covers everything you need to know—from features and pricing to how well it performs as a real AI soulmate. We share how users interact with adult chat features, AI girlfriend 18+ options, and nude AI chat experiences. Whether you're curious about AI roleplay porn or free AI NSFW chat with no sign-up, this review breaks it down clearly and informatively.

Oracle Cloud Infrastructure AI FoundationsVICTOR MAESTRE RAMIREZ

Data Virtualization: Bringing the Power of FME to Any ApplicationSafe Software

Imagine building web applications or dashboards on top of all your systems. With FME’s new Data Virtualization feature, you can deliver the full CRUD (create, read, update, and delete) capabilities on top of all your data that exploit the full power of FME’s all data, any AI capabilities. Data Virtualization enables you to build OpenAPI compliant API endpoints using FME Form’s no-code development platform. In this webinar, you’ll see how easy it is to turn complex data into real-time, usable REST API based services. We’ll walk through a real example of building a map-based app using FME’s Data Virtualization, and show you how to get started in your own environment – no dev team required. What you’ll take away: -How to build live applications and dashboards with federated data -Ways to control what’s exposed: filter, transform, and secure responses -How to scale access with caching, asynchronous web call support, with API endpoint level security. -Where this fits in your stack: from web apps, to AI, to automation Whether you’re building internal tools, public portals, or powering automation – this webinar is your starting point to real-time data delivery.

IntroSlides-May-BuildWithAi-EarthEngine.pdfLuiz Carneiro

Boosting MySQL with Vector Search -THE VECTOR SEARCH CONFERENCE 2025 .pdfAlkin Tezuysal

What is Oracle EPM A Guide to Oracle EPM Cloud Everything You Need to KnowSMACT Works

Cybersecurity Fundamentals: Apprentice - Palo Alto CertificateVICTOR MAESTRE RAMIREZ

Compliance-as-a-Service document pdf textEarthling security

Agentic AI: Beyond the Buzz- LangGraph Studio V2Shashikant Jagtap

AI Creative Generates You Passive Income Like Never BeforeSivaRajan47

Azure vs AWS Which Cloud Platform Is Best for Your Business in 2025Infrassist Technologies Pvt. Ltd.

Evaluation Challenges in Using Generative AI for Science & Technical ContentPaul Groth

End-to-end Assurance for SD-WAN & SASE with ThousandEyesThousandEyes

Extend-Microsoft365-with-Copilot-agents.pptxhoang971

ELNL2025 - Unlocking the Power of Sensitivity Labels - A Comprehensive Guide....Jasper Oosterveld

Dancing with AI - A Developer's Journey.pptxElliott Richmond

TimeSeries Machine Learning - PyData London 2025Suyash Joshi

Improving Developer Productivity With DORA, SPACE, and DevExJustin Reock

Jira Administration Training – Day 1 : IntroductionRavi Teja

DevOps in the Modern Era - Thoughtfully Critical PodcastChris Wahl

soulmaite review - Find Real AI soulmate reviewSoulmaite

Oracle Cloud Infrastructure AI FoundationsVICTOR MAESTRE RAMIREZ

Data Virtualization: Bringing the Power of FME to Any ApplicationSafe Software

IntroSlides-May-BuildWithAi-EarthEngine.pdfLuiz Carneiro

Building Reliable Applications Using React, .NET & Azure

1. Building Reliable ApplicationsUsing React, .NET &Azure Maurice de Beijer - @mauricedb

2. Topics  JavaScript versusTypeScript  Hosting  Test-driven development  API types and updates  GitWorkflow  Feature Flags  Runtime errors © ABL - The Problem Solver 2

5.  Maurice de Beijer  The Problem Solver  Microsoft MVP  Freelance lead/developer/instructor  Twitter: @mauricedb  Web: http://www.TheProblemSolver.nl  E-mail: [email protected] 5 © ABL - The Problem Solver

9. Language features  Type Unions  Tuples  OptionalChaining  Nullish Coalescing operator © ABL - The Problem Solver 9

10. JS Doc  Annotate your JavaScript with JS Doc types  If you made the mistake of not starting withTypeScript  © ABL - The Problem Solver 10

11. MappedTypes  type RT = Readonly<T>  type PT = Partial<T>  type MyProps = React.ComponentProps<typeof MyComponent>  type Returns = ReturnType<typeof someFunction>;  type Args = Parameters<typeof someFunction> © ABL - The Problem Solver 11

12. ES Modules  Named imports instead of import default  Better with tooling and discoverability © ABL - The Problem Solver 12

23. The traditional testing pyramid Manual End to End Integration testing Unit testing

24. Both windows are fine Source

25. A sturdy latch Source

26. A better testing pyramid for the web Manual End to End Integration testing Unit testing

36. ValidateAPI  Validate all data that crosses an external boundary  User input  Data from an API © ABL - The Problem Solver 36

38. 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 © ABL - The Problem Solver 38

40. AJAX requests  The public internet is unreliable  Some requests will fail for random reasons  Use a retry policy to handle network errors © ABL - The Problem Solver 40

43. 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 © ABL - The Problem Solver 43

44. 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 © ABL - The Problem Solver 44

46. 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 © ABL - The Problem Solver 46

51. 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 © ABL - The Problem Solver 51

55. 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 © ABL - The Problem Solver 55

Editor's Notes

#2: Repository: http://bit.ly/pro-hooks-2021 Slides: http://theproblemsolver.nl/pro-hooks-2021.pdf

Building Reliable Applications Using React, .NET & Azure

Recommended

More Related Content

What's hot (19)

Similar to Building Reliable Applications Using React, .NET & Azure (20)

More from Maurice De Beijer [MVP] (20)

Recently uploaded (20)

Building Reliable Applications Using React, .NET & Azure

Editor's Notes