Skip to content

Commit

Permalink
Add hybrid apps content to TOC (#2785)
Browse files Browse the repository at this point in the history
* Add hybrid apps TOC

* Edit.

* Edit.

* Add hybrid apps TOC.

* Fix indentation.

* Edits.

* Edit.

* Remove hybrid landing page.

* Edit.
  • Loading branch information
davidbritch authored Feb 14, 2025
1 parent eb8bdfb commit 922d122
Show file tree
Hide file tree
Showing 3 changed files with 71 additions and 0 deletions.
42 changes: 42 additions & 0 deletions docs/TOC.yml
Original file line number Diff line number Diff line change
Expand Up @@ -509,6 +509,48 @@
href: user-interface/live-visual-tree.md
- name: Visual states
href: user-interface/visual-states.md
- name: Hybrid apps
items:
- name: Overview
href: hybrid-apps/index.md?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Blazor hybrid apps
items:
- name: Overview
href: /aspnet/core/blazor/hybrid/?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Tutorials
items:
- name: Build a .NET MAUI Blazor hybrid app
href: /aspnet/core/blazor/hybrid/tutorials/maui?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Build a .NET MAUI Blazor hybrid app with a Blazor web app
href: /aspnet/core/blazor/hybrid/tutorials/maui-blazor-web-app?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Routing and navigatoin
href: /aspnet/core/blazor/hybrid/routing?pivots=maui&toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Static files
href: /aspnet/core/blazor/hybrid/static-files?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Browser developer tools
href: /aspnet/core/blazor/hybrid/developer-tools?pivots=android&toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Reuse Razor components
href: /aspnet/core/blazor/hybrid/reuse-razor-components?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Class libraries
href: /aspnet/core/blazor/hybrid/class-libraries?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Root component parameters
href: /aspnet/core/blazor/hybrid/root-component-parameters?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Security and identity
items:
- name: Overview
href: /aspnet/core/blazor/hybrid/security/?pivots=maui&toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Security considerations
href: /aspnet/core/blazor/hybrid/security/security-considerations?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Publish
href: /aspnet/core/blazor/hybrid/publish/?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Troubleshoot
href: /aspnet/core/blazor/hybrid/troubleshoot?toc=/dotnet/maui/toc.json&bc=/dotnet/maui/breadcrumb/toc.json
- name: Controls
items:
- name: BlazorWebView
href: ~/user-interface/controls/blazorwebview.md
- name: HybridWebView
href: ~/user-interface/controls/hybridwebview.md
- name: Platforms
items:
- name: Android
Expand Down
9 changes: 9 additions & 0 deletions docs/breadcrumb/toc.yml
Original file line number Diff line number Diff line change
Expand Up @@ -54,3 +54,12 @@
- name: .NET MAUI
tocHref: /dotnet/ios/app-fundamentals/images-icons
topicHref: /dotnet/maui/index
- name: .NET MAUI
tocHref: /aspnet/core/blazor/hybrid
topicHref: /dotnet/maui/index
- name: .NET MAUI
tocHref: /aspnet/core/blazor/hybrid/tutorials
topicHref: /dotnet/maui/index
- name: .NET MAUI
tocHref: /aspnet/core/blazor/hybrid/security
topicHref: /dotnet/maui/index
20 changes: 20 additions & 0 deletions docs/hybrid-apps/index.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
---
title: "What are hybrid apps?"
description: ".NET Multi-platform App UI (.NET MAUI) hybrid apps enable you to build apps using Blazor components, or HTML and JavaScript, while accessing native platform features and device hardware."
ms.date: 02/12/2025
---

# What are hybrid apps?

Hybrid apps provide native experiences across multiple device platforms but use web technologies for building the UI. The UI is packaged with the app, and you have full access to the native device capabilities. This approach also allows you to reuse UI assets across devices and web browsers.

Hybrid apps are a blend of both native and web solutions. The core UI of the app is written using web technologies such as HTML, CSS, and JavaScript. These apps are then wrapped in a lightweight native app container that allows them to use certain native platform features and device hardware (like a device's camera, calendar, push notifications, and pinch and spread functionality) that a web app can't access easily or even use at all.

This approach allows hybrid apps to run on, for example, both Android and iOS platforms without the need for completely separate development. In addition, they can be downloaded and installed through the app stores. The main advantage of hybrid apps is that they can achieve greater developer productivity via code reuse across devices and web browsers.

## .NET MAUI hybrid apps

With .NET Multi-platform App UI (.NET MAUI) you can either host Blazor components with the [BlazorWebView](~/user-interface/controls/blazorwebview.md) control or any other HTML/JavaScript-based UI with the [HybridWebView](~/user-interface/controls/hybridwebview.md) control. These controls derive from the native platform’s `WebView` control. No internet is required - your UI is packaged with the app. This makes it easier to share UI across native and web hosting models. Hybrid apps rely on .NET MAUI for a native app container and native controls, if you want to use them. This means you can mix web UI with native UI if you want to. .NET MAUI hybrid apps can also be packaged for store distribution whether that’s the Microsoft, Apple or Google App stores.

> [!NOTE]
> .NET MAUI Blazor hybrid apps also have additional controls, templates and tooling in Visual Studio and Visual Studio Code to make development easier.

0 comments on commit 922d122

Please sign in to comment.