KakiSoft - Windows 10 app development. UWP, Universal Windows Platform

Blazor란? Blazor가 무엇인지 간단하게 소개하도록 하겠습니다.

* Blazor 특징

• Interactive web UI with C#
  • MVVM Pattern과 유사한 Binding 사용
• Run on WebAssembly
  • Client-side
  • Full-stack web development with .NET via WebAssembly
  • Server-side
• Build on open web standards
  • Requires no plugin or code transpilation
  • Works in all modern browsers including mobile browsers
• Share code and libraries
• JavaScript 상호 운용성
• Browser + Razor = Blazor!

* Blazor Client-side

• 장점
  • .NET 서버의 의존성이 없습니다.
  • 클라이언트 리소스 및 기능을 완벽하게 활용합니다.
  • 서버의 부담을 클라이언트로 전이 합니다.
  • 오프라인 시나리오를 지원합니다.
• 단점
  • 앱을 브라우저의 기능으로 제한합니다.
  • 가능한 클라이언트 하드웨어 및 소프트웨어가 필요합니다 (예 : WebAssembly 지원).
  • 다운로드 크기가 커지고 앱로드 시간이 길어집니다.
  • 덜 성숙한 .NET 런타임 및 툴링 지원 (예 : .NET 표준 지원 및 디버깅의 제한 사항)

* Blazor Server-side

• 장점
  • 클라이언트 측 앱보다 앱 크기가 훨씬 적으므로 훨씬 빠르게로드됩니다.
  • .NET Core 호환 API 사용을 포함하여 서버 기능을 최대한 활용합니다.
  • 서버의 .NET 코어에서 실행되므로 디버깅과 같은 기존 .NET 도구가 예상대로 작동합니다.
  • 씬 클라이언트와 함께 작동합니다. (예를 들어, WebAssembly 및 자원이 제한된 장치를 지원하지 않는 브라우저에서 작동합니다.)
  • 앱의 구성 요소 코드를 포함한 .NET / C # 코드 기반은 클라이언트에 제공되지 않습니다.
• 단점
  • 높은 지연 시간 : 모든 사용자 상호 작용에는 네트워크 지연이 관련됩니다.
  • 오프라인 지원 없음 : 클라이언트 연결이 실패하면 앱이 작동하지 않습니다.
  • 축소 된 확장 성 : 서버는 여러 클라이언트 연결을 관리하고 클라이언트 상태를 처리해야합니다.
  • 앱을 제공하려면 ASP.NET 코어 서버가 필요합니다. 서버가없는 배포 (예 : CDN)는 불가능합니다.

* Blazor 시작전 준비
Visual Studio 2017, 2019
.NetCore 3.0 Preview 5 SDK
Extensions - Manage Extensions - Online - blazor - Blazor Minimal Project Template - Download

https://youtu.be/WWgH1aJgydU

UWP 앱에서 Cookie 관리하는 방법에 대해서 알아 보도록 하겠습니다.

* Cookie
클라이언트 컴퓨터에 저장된 작은 정보입니다.
클라이언트 컴퓨터에 Username, Password, City, PhoneNo 등의 사용자 환경 설정 정보를 저장하는 데 사용됩니다.
Persist Cookie : 만료되는 시간이 없는 지속형 쿠키
Non-Persist Cookie : 만료시간이 존재하는 비 지속형 쿠키

* HttpBaseProtocolFilter
Sharing Sessions Between HttpClient and WebViews on Windows Phones
HttpBaseProtocolFilter 클래스는 HttpClient 인스턴스에서 사용하는 기본 필터 또는 처리기를 제공합니다. 추가 필터가 HttpClient 인스턴스에 추가되지 않으면 HttpBaseProtocolFilter 개체가 유일한 필터가됩니다.
HttpBaseProtocolFilter 클래스는 여러 가지 저수준 HTTP 스택 동작을 전환하기위한 속성 집합을 제공합니다.

https://youtu.be/cr-sduHHiAs

소스

https://github.com/kaki104/PrismSample2019

Prism으로 시작하는 UWP app Part12
UWP에서 Script 직접 호출과 팝업 처리

UWP 앱에서 Script를 직접 호출하는 방법과 window.alert, window.confirm 등의 팝업 처리에 대해서 알아보도록 하겠습니다.

* InvokeScriptAsync
특정 인수를 사용하여 현재로드된 HTML에 지정된 스크립트 함수를 실행 합니다.
InvokeScript() 메소드는 Windows 8.1 이후 변경되거나 사용할 수 없습니다.
리턴 타입이 string이라는 점을 유의하시기 바랍니다.

* window.alert(), window.confirm() 사용 불가?

UWP의 MessageDialog()를 이용해야 합니다.
Package.appxmanifest - Content URIs
notify를 허용할 Uri 주소를 입력합니다.
window.external.notify()
var messageDialog = new MessageDialog(e.Value);
await messageDialog.ShowAsync();

https://youtu.be/ioDI03iXYy0

소스 : https://github.com/kaki104/PrismSample2019

WebView - Async, EventAggregator - Prism으로 시작하는 UWP app Part11

JavaScript에서 Async 메소드를 호출하고 결과를 처리하는 방법
Windows Runtime Component에서 비동기 메소드를 처리하는 방법
IEventAggregator를 이용해서 UWP나 다른 프로젝트로 이벤트를 넘기는 방법 등에 대해서 다루고 있습니다.

* Async : Windows Runtime Component에서 async Task 메소드 사용 방법
* IEventAggregator : 개념 및 사용 방법

https://youtu.be/LBS-UJtG2PQ

소스

https://github.com/kaki104/PrismSample2019

아래와 같은 오류가 발생했을 때 대처 방법입니다.

Severity Code Description Project File Line Suppression State
Error NETSDK1045 The current .NET SDK does not support targeting .NET Core 3.0. Either target .NET Core 2.2 or lower, or use a version of the .NET SDK that supports .NET Core 3.0. PrismSample.Web C:\Program Files\dotnet\sdk\2.2.300\Sdks\Microsoft.NET.Sdk\targets\Microsoft.NET.TargetFrameworkInference.targets 137

현재 .NET Core 3.0은 Preview 버전이기 때문에 Preview 버전 사용이 가능하도록 Visual Studio 2019에서 설정해 주어야 합니다.

Visual Studio 2019 -> Tools -> Options 

빨간 테두리 부분을 선택하시고 OK를 눌러주시면 3.0 사용이 가능합니다.