Sands of MAUI: Issue #155

This week’s .NET MAUI news: AI Prompt, ThemeBuilder styles, integrating ChatGPT, Rantiy shopping app and integrating .NET Aspire.


This content originally appeared on Telerik Blogs and was authored by Sam Basu

Welcome to the Sands of MAUI—newsletter-style issues dedicated to bringing together the latest .NET MAUI content relevant to developers.

A particle of sand—tiny and innocuous. But put a lot of sand particles together and we have something big—a force to reckon with. It is the smallest grains of sand that often add up to form massive beaches, dunes and deserts.

.NET developers are excited with the reality of .NET Multi-platform App UI (.NET MAUI)—the evolution of modern .NET cross-platform developer technology stack. With stable tooling and a rich ecosystem, .NET MAUI empowers developers to build native cross-platform apps for mobile/desktop from single shared codebase, while inviting web technologies in the mix.

While it may take a long flight to reach the sands of MAUI island, developer excitement around .NET MAUI is quite palpable with all the created content. Like the grains of sand, every piece of news/article/documentation/video/tutorial/livestream contributes toward developer experiences in .NET MAUI and we grow a community/ecosystem willing to learn and help.

Sands of MAUI is a humble attempt to collect all the .NET MAUI awesomeness in one place. Here’s what is noteworthy for the week of August 12, 2024:

AI Prompt

.NET MAUI is the evolution of modern .NET cross-platform development stack, allowing developers to reach mobile and desktop form factors from single shared codebase. It is, however, the age of artificial intelligence (AI). AI is slowly changing the way we live and work, and AI’s popularity is driving adoption in enterprise and consumer apps. There is help for .NET MAUI developers looking to infuse some AI smartness in their apps and Héctor Pérez produced a wonderful video—integrate AI into .NET MAUI apps with Telerik AI Prompt.

Hector starts with the basics of getting the needed tools for AI integration inside .NET MAUI apps—Telerik UI, MVVM help from .NET MAUI Community Toolkit and wrapper libraries to reach Azure OpenAI. The Telerik AIPrompt UI allows for easy integration of GenAI services inside .NET MAUI apps—predefined Views, custom Suggestions, styling APIs, Localization and Command support only add to developer flexibility.

With step-by-step instructions on how to wire up Azure AI services inside .NET MAUI apps, Hector showcases the developer experience using Telerik AIPrompt UI—with Views, up/down votes, custom Suggestions, Retry logic and easy Command support, developers feel at home right away. AI presents a techtonic shift in the software industry and all of Generative AI smartness is now readily accessible from modern cross-platform .NET MAUI apps.

.net maui aiprompt

ThemeBuilder Styles

Modern apps often strive for delightful UX, and beautifully styled UI is one way designers/developers can achieve the goal. Styling every aspect of UI manually across modern web apps is a chore. Designers often want to start with a design system and have customizations applied to all types of UI. Developers working by themselves could use a better starting point to have consistent themes applied to variety of UI—visual representation never hurt before stepping down to CSS/Sass.

When designers and developers work together, the handoff can often have frictions—design fidelity has to be upheld, but balanced with development needs. ThemeBuilder is a tool that can help and, as an aging developer wrote up, ThemeBuilder web styles can be brought over to native apps.

Progress ThemeBuilder is a versatile tool that helps create visual UI styles—while it serves all types of modern web apps, designers/developers will find things particularly beneficial if rendering Telerik and Kendo UI web components. ThemeBuilder offers an intuitive UX to visualize web UI styles and see how changes look for all types of UI components—this includes colors, visual states, properties, typography and more.

Once design/styling work is done, the ThemeBuilder styles can be reused outside of web apps—.NET MAUI/PWA/Electron apps can all leverage the ThemeBuilder CSS/Sass outputs to have consistent styling across platforms. Further, modern frameworks/tools also enable true sharing of styles—a common set of styles can drive consistent UX across web and native apps, offering flexibility for developers.

ThemeBuilder styles

Integrating ChatGPT

.NET MAUI is built to enable .NET developers to create cross-platform apps for Android, iOS, macOS and Windows, with deep native integrations, platform-native UI and hybrid experiences. However, AI presents a huge opportunity for .NET developers to infuse apps with solutions powered by Generative AI and Large Language Models (LLMs). Modern cross-platform .NET MAUI apps could benefit greatly by bringing in AI smartness, and Leomaris Reyes wrote up a wonderful article—integrating ChatGPT into .NET MAUI apps from scratch.

Leomaris starts with the basics—developers need to have an OpenAI account and generate the OpenAI API key. The OpenAI API key is to be handled with care, often tucked away as an environment variable or securing it as a secret in cloud storage. Leomaris starts up a default .NET MAUI app and builds up a little visual UI to bring in AI. While in preview, the Azure.AI.OpenAI library makes the integration easy.

Leomaris showcases the developer experience in wiring up calls to ChatGPT API through Azure OpenAI—this includes configuration to choose OpenAI models, number of input and output tokens. Once all is done, developers can fire up ChatGPT OpenAI API calls from the .NET MAUI app—users get easy restaurant recommendations and AI-powered happiness.

.NET MAUI app with restaurant recommendations

Rantiy Shopping App

Based on an idea originally started for Xamarin by Steven Thewissen, MAUI UI July was a month-long community-driven event where anyone got to share enthusiasm and passion for .NET MAUI. Run by Matt Goldman, this was a great opportunity for .NET MAUI developers to learn from each other—MAUI UI July happened throughout July 2024. The next article comes from Daniel Monettelli with an inspiring writeup—Rantiy mobile shopping app with .NET MAUI.

Modern cross-platform apps are complex—one has to think through ideation, design and development frameworks/tools/patterns. In Part 1 of the article series, Daniel dives into Rantiy—an open-source mobile shopping app built with .NET MAUI. Daniel walks through the design/development process—choice of tools has an huge impact on how long it takes to build a real world cross-platform app. For app design, many chose Figma—the undisputed ally to quickly design and prototype the app. Daniel dives through other tools at his disposal that shorten development times—Zeplin, .NET MAUI Community Toolkit, modern data grids and more.

With justifications for every step, Daniel showcases the developer journey with development toolchains—the rest of the series should be wonderful inspiration toward well-designed successful .NET MAUI apps.

Rantiy Mobile Shopping App built in .NET MAUI

Integrating .NET Aspire

.NET MAUI is the evolution of modern .NET cross-platform development stack, allowing developers to reach mobile and desktop form factors from single shared codebase. The reality for most modern enterprise mobile/desktop apps, however, is not a silo—apps are often built as a part of a bigger family of apps/services. .NET Aspire is the opinionated, cloud-ready stack for building observable, production-ready, distributed applications. While .NET Aspire sounds like it is for complex greenfield enterprise apps, Jon Galloway wrote up an excellent piece that shows the wide benefits of .NET Aspire—adding .NET Aspire to existing .NET apps.

.NET Aspire can make current apps more straightforward. Developers can streamline startup process, improve monitoring and increase the reliability of interconnected services. As app usage/functionality grows, modern enterprise architecture get complex—client .NET MAUI/web apps could be supported by a plethora of connected background services, data storage, AI endpoints, service bus implementations and more.

Jon showcases the immediate benefits to existing projects—.NET Aspire Service Defaults project helps in service discoverability, health checks, logging and resiliency. Adding the .NET Aspire AppHost project further helps in orchestration of multi-project launch configurations and developers gain a wonderful dashboard to visualize state of connected apps/services. .NET Aspire isn’t just for new apps or giant enterprise solutions. Thanks, Jon, for distilling the benefits down for existing .NET projects.

.NET Aspire Service settings

That’s it for now.

We’ll see you next week with more awesome content relevant to .NET MAUI.

Cheers, developers!


This content originally appeared on Telerik Blogs and was authored by Sam Basu


Print Share Comment Cite Upload Translate Updates
APA

Sam Basu | Sciencx (2024-08-12T15:16:11+00:00) Sands of MAUI: Issue #155. Retrieved from https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/

MLA
" » Sands of MAUI: Issue #155." Sam Basu | Sciencx - Monday August 12, 2024, https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/
HARVARD
Sam Basu | Sciencx Monday August 12, 2024 » Sands of MAUI: Issue #155., viewed ,<https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/>
VANCOUVER
Sam Basu | Sciencx - » Sands of MAUI: Issue #155. [Internet]. [Accessed ]. Available from: https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/
CHICAGO
" » Sands of MAUI: Issue #155." Sam Basu | Sciencx - Accessed . https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/
IEEE
" » Sands of MAUI: Issue #155." Sam Basu | Sciencx [Online]. Available: https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/. [Accessed: ]
rf:citation
» Sands of MAUI: Issue #155 | Sam Basu | Sciencx | https://www.scien.cx/2024/08/12/sands-of-maui-issue-155/ |

Please log in to upload a file.




There are no updates yet.
Click the Upload button above to add an update.

You must be logged in to translate posts. Please log in or register.