XAF - New SPA UI for Web & Mobile (v18.2)

As of August 2019, we officially canceled XAF's React-based SPA UI project. We have made the decision to focus our efforts on Blazor going forward. For more information, see XAF - Important Changes to the SPA UI Strategy: The Future is Blazor.

OLD CONTENT:

In addition to WinForms and ASP.NET UI enhancements announced a couple of days ago (XAF - Access v18.2 Features Today for Early Testing and BONUS for v18.1.6), I wanted to share our updated vision for XAF Web & Mobile development – one that’s based on an entirely new SPA driven UI. When this ASP.NET Core and React-based solution matures, it will supersede/replace existing WebForms and Mobile user interfaces.

New SPA UI architecture and technologies (the 'WHAT' part)

Over the last few years, we've been hard at work adapting XAF for the mobile world. As the tech landscape evolved, so did our strategy - new server-side solutions mandated pursuit of alternate (and more progressive) client-side UI paradigms.

Today, we still build Web applications with distributed client-server architectures like those in our former Mobile UI. However, both server and client technologies and their communication protocols have evolved. The client is now a single-page application (SPA) based on Facebook's React JavaScript library and our React Wrappers for DevExtreme. The server backend uses ASP.NET Core 2.1 with the full .NET Framework 4.6.1 (for now). The npm command-line tool bundled with Node.js and Visual Studio 2017 are required to install React and other packages. Visual Studio and .NET Framework support will likely to expand to .NET Core 2.2+ and other IDEs like VS Code (assuming demand exists).

User benefits & problems this new SPA UI should ultimately address (the 'WHY' part)

Why React and not, for example, Xamarin for mobile development? It’s simple - we (and I’d argue many of our users) prefer a single, unified development system. The Web is a common denominator that covers multiple platforms well. A reliable and modern Web solution is something most want/need to deliver and if one does a good job in this regard, a mobile solution should follow automatically (at almost no cost).  Promising technologies like React Native, Electron and WebAssembly could also give us expanded opportunities in the future to address the needs of those who prefer the “native” option. Xamarin did not meet this basic requirement and would have forced us to create separate solutions for the Web and Mobile (you would need investments for both Android and iOS platforms as well).

To shape our vision, we relied on user feedback and listened to customer comments on existing XAF platforms. Here is a categorized list of SPA UI benefits many of you have asked us to deliver:

Common

• Deliver more on the "Design Once. Run Everywhere." promise and lessen associated costs with the unified Web and improved code sharing. Potentially, there will be one code base that can even replace XAF WinForms apps with Web apps running inside Electron (Microsoft Teams and Visual Studio Code are good examples of such hybrid desktop software). 
• Get rid of old technologies with an unclear future and lowered levels of support from Microsoft, third party vendors and the dev community (ASP.NET WebForms, WCF Data Services);
• React to changing market needs faster, open new opportunities to deliver more features with a bigger vendor and community support for new and popular technologies;
• Offer assurances that XAF Web and Mobile applications will stay up-to-date for at least the lifecycle of ASP.NET Core 2.x and React – two of the leading frameworks for server and client Web development.

Client/frontend

• Faster responses to user actions and less traffic sent from the server to clients;
• A more modern-looking UI, including Material themes supported by DevExtreme components;
• More natural UX and intuitive screen flows, for instance, auto-save detail collection data instead of explicit master object save (example);
• Responsive designs for different screen resolutions and devices: desktop, tablet, phone;
• Cutting-edge technology (webpack) for optimized client application build and delivery;
• Allow users to publish Web apps in stores via PhoneGap, Electron and other native containers. 

Server/backend

• Stateless application design by default. In addition to lower maintenance costs, this should also help users enable more cloud hosting features easier, for instance, load balancing.
• Optionally, support a stateful architecture to provide a better performance and richer functionality in standard usage scenarios. This is helpful for the majority of our users who rarely have more than 50 concurrent users at peak times and 5-10 users typically.
• More deployment options. At present, any web server deployment for ASP.NET Core and full .NET Framework 4.6.1 is supported. .NET Core 2.2+ support in the future will unleash multi-platform hosting (Apache, Docker, etc.).
• More modern and flexible infrastructure with built-in features like OAuth2 authentication powered by the ASP.NET Core framework;
• The https://github.com/DevExpress/DevExtreme.AspNet.Data library optimized for DevExtreme controls comes with many useful features like virtual paging (most operations are executed on the server rather than on the client). 
• Ways to reuse XAF data and logic from external non-XAF clients and services (of course, everything passes through XAF authentication and security system rules);
• eXpress Persistent Objects (XPO) classes and non-persistent POCO are supported for data access and presentation. Entity Framework (EF) and Domain Components (DC) interfaces are not supported.
• Avoid limitations of the former WCF Data Services/OData V3-based server. CriteriaOperator expressions, previously translated to OData queries, are now directly translated to LINQ expressions. This enables the following features: more ListView grouping options, ContainsOperator and aggregate functions in ListView filters (T549081), ListViews for non-associated collections, lookup editors filtered by arbitrary or non-associated collections with DataSourcePropertyAttribute.

Existing XAF development values we want to preserve, FAQ & More...

Despite these forthcoming changes, we will do our best to maintain XAF as the go to rapid application development toolset for .NET developers – allowing you to quickly create Office-like line-of-business apps for various platforms simultaneously. To support this long-term vision in the new SPA UI, we hope to keep and further evolve the following fundamental XAF values:

• Automatically generate database & CRUD UI for popular RDBMS and Windows, Web and Mobile platforms, reduce associated low-level coding and other complexities;
• Focus on business rules, share pure .NET code (C#, VB.NET and minimal JavaScript) and configuration settings across platforms and databases as much as possible;
• Ship built-in business-specific functionality such as reporting, security, validation, and data analysis  - and give you the flexibility to customize as needed;
• Unsupported or complex functionality not available by default can still be implemented in code by incorporating framework flexibility and customization options;
• Comprehensive options for both developers and end-users to customize applications after deployment. For instance, modify application settings stored in a database using administrative tools or directly within an app (at runtime) using visual designers (and updated accordingly without re-deployment).

For more technical information and answers to questions we anticipate most, refer to the updated FAQ: New XAF HTML5/JavaScript SPA UI for Web & Mobile (CTP) KB article.

Our short term plans and what to test today!

Right away, existing XAF Mobile UI users are welcome to migrate to our newest server features: How to connect an existing XAF Mobile application to the new ASP.NET Core Data Service (CTP). The new SPA UI will use this server and you can help us release this portion faster by providing feedback.

We hope to publish new SPA UI demos online after our v18.2 release. In the meantime, anyone is welcome to check screenshots of our prototypes and discuss their specs in our forum with peers (see below).

No promises at this stage, but our hope is to offer this SPA UI for production use around the v19.1 timeframe (at least for simple scenarios). 

Your feedback counts!

To discuss this vision, roadmap and technical requirements more effectively with the XAF community, we have setup a private discussion forum - exclusively for Universal customers. Feel free to leave comments to this post, email us at xafteam@devexpress.com or submit tickets using the Support Center if this is of more convenience.  

By this and by providing early build access, we hope to find out whether our new features and solutions address your requirements and issues. Your testing efforts and your feedback help us deliver the best possible final implementation. We have described other benefits of this cooperation in this post.

In advance, thank you very much for your help!

Free DevExpress Products - Get Your Copy Today