Honsal's Dailylife

WPF Prism에서 AutoMapper 사용하기 AutoMapper AutoMapper는 서로 다른 두 클래스를 보다 쉽게 매핑하기 위해 사용하는 라이브러리이다. 내 경우(그리고 많은 오픈소스 프로젝트의 경우) 모델과 DTO 사이의 매핑을 손쉽게 처리하기 위해 주로 사용된다. Prism Prism 프레임워크, 또는 라이브러리 1 는 이전 포스트 에서 자세히 다룬 바 있다. 다시 간략하게 정리하자면 MVVM 기반 프로젝트 개발을 더 쉽게 할 수 있도록 도와주는 프레임워크이다. Prism에서 AutoMapper DI하기 ASP.NET 프로젝트에서 AutoMapper 사용은 정말 쉽다. 애초에 AutoMapper에서 확장 메서드를 제공하기 때문에 서비스를 구성할 때 해당 메서드를 호출하고, AutoMapper.Profile 을 상속받은 클래스를 만들어 아무 곳에다가 배치해놓은 뒤 실행하면 된다. 그러나 Prism용 확장 메서드는 자체적으로 제공되지 않으므로 직접 만들어 써야 한다. IAutoMapperProvider interface 일단 DI를 위해 사용할 인터페이스부터 구성한다. public interface IAutoMapperProvider { IMapper GetMapper ( ) ; } AutoMapperProvider class 이제 위 인터페이스를 상속한 AutoMapperProvider 클래스를 작성한다. public class AutoMapperProvider : IAutoMapperProvider { private readonly MapperConfiguration _configuration ; public AutoMapperProvider ( IContainerProvider containerProvider ) { _configuration = new MapperConfiguration ( config

Visual Studio 또는 ReSharper에서 XAML XML 특성의 줄바꿈 처리 변경하기 XAML/XML WPF 코딩을 하다 보면 XAML 구문을 작성해야만 한다. 대부분의 .NET 작업은 JetBrains Rider에서 하는 편이나, WPF는 Visual Studio에서 작업함으로써 얻게 되는 여러 이점 때문에 Visual Studio 2022를 사용해 작업하고 있다. 물론, 이전 버전일 때도 Visual Studio를 사용했다. WPF 관련 IDE 또는 디버거 지원은 JetBrains Rider보다 Visual Studio가 압도적으로 좋기 때문에 1 안 쓸래야 안 쓸 수가 없다. 게다가 여러 외부 도구 2 가 Visual Studio만 지원하는 경우가 많기 때문에 더더욱 WPF 작업은 Visual Studio에서 할 수밖에 없는 것이다. 불편함 문제는 Rider를 사용하다가 오니 불편한 점도 이것 저것 눈에 띈다는 것이다. 특히 가장 많이 접할 수 밖에 없는 XAML 텍스트 에디터에서 그 문제가 더욱 돋보인다. JetBrains Rider는 오랜 사용 기간동안 내게 최적화된 코드 포맷팅 설정을 해놓은 상태이나 Visual Studio는 그게 되어있지 않기 때문에, 코드를 작성하고 리포맷을 하면 내가 원하는대로 설정되지 않는 경우가 다반사이다. < ControlA Attr1 = " A " Attr2 = " B " Attr3 = " C " /> 위와 같은 코드가 있을 때, 나는 다음과 같이 리포맷되길 원한다. 3 < ControlA Attr1 = " A " Attr2 = " B " Attr3 = " C " /> 그러나 기본값은 줄이 충분히 길 경우에만 초과하는 어트리뷰트를 다음 줄로 넘긴

프리즘 생산성 도구들 생산성 도구 현재 프리즘은 Visaul Studio 및 Visual Studio Mac과 연동해 WPF, UWP, 네이티브 iOS 및 Xamarin.Forms를 사용한 Android 앱을 개발하기 위한 매우 생산적인 개발자 워크플로우를 지원한다. 코드 스니펫, 아이템 템플릿, 프로젝트 템플릿을 사용해 빠르게 프리즘 앱 제작을 시작할 수 있다. 현재 다음과 같은 도구를 사용할 수 있다. Prism Template Pack Prism Template Studio Prism Extensibility Pack Prism Template Pack 프리즘 템플릿 팩은 프리즘을 사용한 WPF 및 Xamarin.Forms 개발을 위한 여러 코드 스니펫, 아이템 템플릿 및 프로젝트 템플릿을 포함하고 있다. Snippets propp - Property, with a backing field, that depends on BindableBase private string _fieldName ; public string PropertyName { get { return _fieldName ; } set { SetProperty ( ref _fieldName , value ) ; } } cmd - Creates a DelegateCommand property with Execute method private DelegateCommand _fieldName ; public DelegateCommand CommandName = > _fieldName ? ? ( _fieldName = new DelegateCommand ( ExecuteCommandName ) ) ; void ExecuteCommandName ( ) { } c

프리즘 프레임워크 시작하기 프리즘 다운로드 및 설치 이번 글에서는 프리즘을 다운로드하고 설치하는 방법을 의역해 옮기도록 하겠다. 전체적인 프리즘 릴리즈 노트는 깃헙 페이지 에서 확인할 수 있다. 프리즘 소스 코드 다운로드 및 셋업 프리즘 소스 코드에서 셋업을 진행하기 위해서는 다음과 같은 단계를 따른다. 시스템 요구 사항 설치 프리즘 소스 코드 및 문서 다운로드 및 압축 해제 컴파일 및 샘플 실행 1단계. 시스템 요구 사항 설치 프리즘은 윈도우 8 데스크탑, 윈도우 7, 비스타, 2008 OS에서 작동하도록 디자인되었다. 1 이 가이드에서 빌드된 WPF 앱은 .NET Framework 4.5를 필요로 한다. 1 2 프리즘 라이브러리를 사용하기 전, 다음과 같은 요구 사항이 설치되어야만 한다. .NET Framework 4.5 또는 그 이상의 버전 MS Visual Studio 2017 이상의 버전(2019 권장) 3 Prism.Forms를 사용하려면 Xamarin 워크로드가 반드시 설치되어야 함 4 2단계. 프리즘 소스 코드 및 문서 다운로드 및 압축 해제 프리즘 리포지토리 를 fork하면 손쉽게 진행할 수 있다. 샘플 코드는 다음과 같다. WPF 샘플 Xamarin.Forms 샘플 위 단계 대신 Prism 관련 NuGet 패키지 를 설치해도 된다. 3단계. 샘플 컴파일 및 실행 모든 샘플은 프리즘 NuGet 참조를 사용하므로 각 솔루션에서 직접 컴파일하고 실행할 수 있다. 문서가 구버전이라 이렇게 적혀 있으나 프리즘 8은 윈도우 10, 11을 지원하고 오히려 8.1 이하를 지원할 계획이 없다고 한다. ↩︎ ↩︎ 현재 시점의 최신 프리즘(버전 8)은 .NET 7에서도 잘 돌아간다. ↩︎ 글을 쓰는 현재 VS2022에서도 문제없이 잘 돌아간다. ↩︎ Visual Studio Installer에서 Xamarin 워크로드를 활성화하고 설치하면 된다. ↩︎

WPF - 프리즘 프레임워크 C#/WPF. 불편해. Node.JS 개발을 하다 보니 WPF 개발이 참 난감해졌다. 예전에는 당연히 이 정도 기능을 코딩하려면 미리 만들어놓은 라이브러리가 없을 때 이만큼의 시간이 걸리는 건 당연하지 라고 생각했었는데, 리액트와 NextJS 등을 사용하다가 WPF 개발 쪽으로 돌아가려니 도저히 못해먹겠다 싶은 생각 뿐이었다. 아, 이건 이런 HTML 태그와 이런 CSS를 쓰면 쉽게 가능한데… 아, 저건 이러이러한 타입스크립트로 쉽게 되는데… 이런 경우가 너무 많이 생긴다는 것이다. 이럴 때 사용할 수 있는 라이브러리나 프레임워크가 있나 찾아보다가 발견하게 된 것이 프리즘이다. 일단, 아직 한 번도 프리즘을 사용해보지 않았으므로 공식 문서를 의역하면서 하나씩 알아가보고자 한다. Prism: XAML 앱용 프레임워크 프리즘은 느슨하게 결합된 관리와 테스트가 용이한 XAML 앱용 프레임워크이다. 1 프리즘을 사용하면 MVVM, DI, commands, EventAggregator 등등 여러 디자인 패턴들의 구현을 제공받게 된다. 대상 플랫폼 프리즘은 .NET Standard 및 .NET 4.5 또는 4.8 버전에서 사용할 수 있도록 크로스 컴파일되어 제공된다. 또한 WPF, Xamarin Forms, 버전 8의 경우 UNO에서 사용할 수 있다. 단, 8버전 이후로 Silverlight나 윈도우 8/8.1/윈도우 폰 8.1, UWP에 대한 지원 계획은 없다고 한다. 이 경우엔 이전 버전 을 사용하라고 권하고 있다. https://prismlibrary.com/docs/index.html ↩︎

슬래시나 아포스트로피가 파이어폭스 검색 바를 열지 않도록 설정하는 방법 슬래시(/) 키 요즘 들어 부쩍 개발 문서 페이지를 자주 보게 되면서 슬래시 키를 누르는 횟수가 늘어났다. 리액트 문서 나 Next.js 문서 , 혹은 내가 직접 운영중인 깃랩, 또는 깃헙 등등 여러 사이트의 여러 문서/소스 코드를 어느 때보다 많이 접하게 되었다. 그러다보니 슬래시 키 역시 비례하여 많이 누르게 된다. 코드에 주석을 달 때 외엔 누를 일이 그리 많지 않은 키였는데 언제부터인지 이런 메이저 사이트들이 슬래시 키에 검색 기능을 바인드 하기 시작하면서 번거롭게 마우스로 검색 박스를 클릭하지 않고, 키보드에서 손이 떨어질 일 없이 슬래시 키를 눌러 검색 기능을 호출한 뒤 검색하고 그 결과에서 페이지 업/다운 및 Ctrl + F 또는 F3 으로 브라우저 검색 기능을 통해 원하는 내용을 찾는 과정이 반복되고 있다. 크롬과 파이어폭스 문제는 파이어폭스로 넘어오며 발생했다. 크롬은 슬래시 키를 눌러도 아무 일이 일어나지 않는다. 때문에 위와 같이 슬래시 키를 사용하는 사이트에 접속해서 로드가 완료되기 전에 슬래시 키를 눌러도 아무 일도 일어나지 않게 된다. 그러나 파이어폭스는 기본적으로 슬래시 키에 퀵서치 기능이 바인드 되어 있다. 그리고 해결 방법을 찾으면서 알게 된 바로는 아포스트로피( ' ) 키 역시 바인드 되어 있다. 이를 해제할 때 접근성 그룹에 속해있는 것을 보면 Ctrl + F 또는 F3 과 같이 두 개 이상의 키를 조합해 누르거나 일반적인 타이핑 범위보다 멀리 떨어진 기능 키를 눌러야 하는 상황 1 을 고려해 넣어놓은 기능인 것 같은데, 나에겐 불필요한 기능이다. 왜냐하면 슬래시 키가 바인드되어 있는 사이트라도, 해당 사이트가 로딩되기 전에 누르면 브라우저 퀵서치 바가 나타나기 때문 이다. 이러면 다음과 같이 불필요한 작업이 추가된다. 사이트에 접속 슬래시를 누름 사이트 로딩이 되지 않아 슬래시가 바인드

Microsoft.AspNetCore.Authentication.JwtBearer 사용 중 토큰이 잘못됐을 때 올바른 401 응답을 반환하는 방법 JWT 토큰 인증 J SON W eb T oken은 이름 그대로 웹에서 사용되는 JSON 토큰이다. 웹 에서 JSON 형식의 토큰 을 사용해 인증을 처리하는 데 주로 사용된다. ASP.NET에서 JWT를 사용하는 데 주로 쓰이는 패키지는 Microsoft.AspNetCore.Authentication.JwtBearer 패키지인데, 일반적인 상황에서는 그냥저냥 기본 설정만 건드린 채 사용해도 문제가 없으나 내 경우에는 CORS 호출이 기본인 상황에서 사용하다가 예상하지 못한 문제를 맞이했다. 1 프론트엔드에서 fetch 사용 시 401 Unauthorized 문제 Next.JS로 구축된 프론트엔드에서는 문제가 없다. 크롬 확장 프로그램 의 팝업 페이지나 커스텀 페이지 에서도 문제가 없다. 문제는 콘텐츠 스크립트 에서 발생했다. 콘텐츠 스크립트는 React를 사용하여 구현되어 있는 상태이고, 직접 만든 Provider 및 hook을 사용해 JWT 토큰을 일정 시간마다 받아오고, 리프레시할 때 401 또는 403 에러가 발생하면 그에 맞는 처리를 하도록 코드를 짰다. 문제는 정상적인 상황에서, 즉 팝업 또는 사용자 정의 페이지에서 인증을 완료하고 이를 API 서버에서 검증하려 할 땐 아무 문제 없이 정상 작동하던 로직이 토큰의 기한이 만료되어 401 상태 코드를 받아와야 하는 상황에서는 작동하지 않고 예외를 던진다는 것이다. 분명 ASP.NET 서버에서 다음과 같이 CORS를 허용하였는데 app . UseCors ( builder = > { builder . AllowAnyOrigin ( ) . AllowAnyHeader ( ) . AllowAnyMethod ( ) ; } ) ; 막상 에러를 까보면 cors 에러도 함께

자바스크립트에서 아예 선언되지 않은 변수 체크하기 선언되지 않은 변수? 값이 정의되지 않은 변수 와 선언되지 않은 변수 를 구분해야 한다. 가장 흔히 보이는 값이 정의되지 않은 변수 는 다음과 같다. var a ; let b ; ***const***는 초기값이 없는 상태로 초기화할 경우 SyntaxError 를 발생시키므로 제외하였다. 굳이 하자면 const a = undefined 가 될 수 있긴 하다. 위와 같은 코드는 남이 짜놓은 자바스크립트 코드를 보다 보면 흔하게 볼 수 있다. 혹은 그 사람은 그렇게 작성하지 않았더라도 minifier 등으로 처리된 코드에서는 저런 부분이 많이 보이곤 했다. 값이 정의되지 않은 변수 의 a 와 b 는 값이 할당되지 않아 보이지만 실제 스택에는 undefined 가 값으로 할당된 상태이다. 즉 다음과 같다. var a = undefined ; var b = undefined ; 때문에 값이 정의되지 않은 변수 === 값이 undefined로 정의된 변수 라고 보아도 무방하다. 이를 let 으로 선언했을 경우 스코프의 영향을 받고, 스코프 밖에서 사용하려 하면 ReferenceError 를 발생시킨다. 선언되지 않은 변수 선언되지 않은 변수 는 위 내용에 이어서 생각하면 편하다. 아예 선언조차 되지 않은 변수, 즉 현재 스코프(글로벌 포함)에 아예 해당 변수 이름이 정의되지 않은, 콜 스택에 변수 참조가 없는 상태를 발한다. 즉 이는 변수조차 아니다. 그렇다면 어떤 경우에 이런 상황을 마주하게 될까? 사실, 일반적인 개발 상황에서 마주하기 쉬운 상태는 아니다. 그러나 나는 브라우저 확장 프로그램을 개발하려다가 이와 같은 상황을 마주치게 되었다. content-script, background-script 어느 한 싱글톤 클래스의 메서드가 호출되었을 때, 호출한 당사자가 콘텐츠 스크립트인지 백그라운드 스크립트인지를 판별하려는 상황에서 이러한 문제가