템플릿 컨트롤 미리보기
템플릿 컨트롤 미리보기 기능을 구현했다. 위치 조정, ZIndex 관리, 저장 기능까지 포함하여, 화면 구성 실험을 반복했다. 단순히 보여주는 것뿐 아니라, 구조적 저장 방식까지 고려하며 개발 경험을 확장했다. 회고: 작은 미리보기 기능도 설계와 구조를 고민하면 큰 학습이 된다.
키자드에 등록된 총 179개의 포스트를 확인하실 수 있습니다.
템플릿 컨트롤 미리보기 기능을 구현했다. 위치 조정, ZIndex 관리, 저장 기능까지 포함하여, 화면 구성 실험을 반복했다. 단순히 보여주는 것뿐 아니라, 구조적 저장 방식까지 고려하며 개발 경험을 확장했다. 회고: 작은 미리보기 기능도 설계와 구조를 고민하면 큰 학습이 된다.
템플릿 컨트롤 내 카드 삽입 기능을 구현하고 테스트했다. 다양한 조합을 실험하면서, UI 요소 간 상호작용과 동적 업데이트를 관찰했다. 작은 기능이지만, 화면 구성의 유연성을 높이는 핵심 포인트였다. 회고: 반복적인 실험을 통해 구조적 이해가 빠르게 쌓인다.
비디오 프로그램 코드를 리팩토링하며, 화면 간 결합도를 낮추고 중복 데이터를 제거했다. 상속 구조를 활용하고, 바인딩 데이터를 정리하면서 개발 효율을 높였다. 리팩토링 과정에서 기존 코드를 이해하고 구조를 개선하는 경험이 컸다. 회고: 깨끗한 코드 구조가 이후 기능 확장의 기반이 된다.
캠 화면 멀티 송출을 구현했다. 브로드캐스트와 프리뷰 화면이 동시에 동작하도록 조정했다. 또한 다중 창 열기 기능도 적용하여, 사용자가 필요에 따라 화면을 자유롭게 구성할 수 있도록 했다. 회고: 작은 UI 개선도 전체 사용성에 큰 영향을 준다는 것을 다시 확인했다.
스킨 템플릿 타입 불러오기, On/Off 제어, 크로마키 색상 변경 기능을 구현했다. 화면과 데이터 연동 실험을 반복하며, 안정적인 송출과 시각적 결과를 확인했다. 회고: 반복 실험을 통해 문제점을 미리 발견하고 개선하는 습관이 중요하다.
인터페이스 설정 화면을 개선하고, 스킨 파일을 특정 경로에서 불러와 목록화했다. Vertical/Horizontal 타입 구분과 함께, 화면 구성 요소를 효율적으로 관리할 수 있었다. 회고: UI 설계 단계에서 구조를 명확히 잡으면 개발 후속 작업이 훨씬 수월하다.
스킨 컨트롤 확장 기능으로 방송모드와 무대 송출 모드를 구현했다. UnitPot On/Off 기능을 포함하여, 화면 상태를 유연하게 제어할 수 있었다. 회고: 기능 확장은 단순한 코드 추가가 아니라, 구조와 사용성을 고려해야 한다.
게임 진행 데이터를 연동하며, 라운드별 액션과 스탯 정보를 화면에 반영했다. 커뮤니티 카드 갱신 시에만 동작하는 인터랙티브 애니메이션 기능도 구현했다. 회고: 데이터 연동과 시각화 경험은 실시간 화면 개발에서 중요한 학습 포인트이다.
승률 조건에 따른 화면 노출/비노출 기능을 구현하고, 실시간 카드 데이터 연동을 테스트했다. 컨트롤 재조정 기능을 적용하여 화면 안정성을 높였다. 회고: 실시간 데이터 처리 경험은 개발자로서 빠른 판단력과 문제 해결 능력을 높여준다.
프리플랍 상황에서 발생하던 중복 액션 현상을 수정하고, 아웃츠 기능을 구현했다. 작은 버그 하나라도 테스트하고 해결하는 경험이, 전체 프로그램 안정성에 큰 영향을 준다는 것을 다시 확인했다. 회고: 반복적인 버그 수정과 기능 개선 과정이 성장의 핵심임을 느낀 한 달이었다.
나에게 맞는 AI 조합을 찾는 방법에 대한 제안 이 글은 “이렇게 해야 합니다”라는 정답을 말하려는 글은 아닙니다. 저 역시 아직 AI 도구를 선택 중인 사람이고, 그 과정에서 머릿속이 가장 많이 흔들렸습니다. 이 글은 그 과정에서 정리해본 생각의 기준을 공유해보려는 글입니다. AI를 고르기 전에, 먼저 버려야 했던 생각 하나 처음엔 이런 생각부터 들었습니다. “GitHub Copilot 하나로 통일하면 되지 않을까?” “Agent Framework까지 가야 제대로 쓰는 거 아닐까?” “그냥 유명한 AI는 다 구독해버릴까?” 그런데 도구를 늘릴수록, 이상하게도 더 혼란스러워졌습니다. 그래서 방향을 조금 바꿨습니다. AI를 고르기 전에, 내가 지금 어떤 일을 하고 있는지를 먼저 보자. AI는 ‘성능’보다 ‘역할’이 먼저다 AI를 계속 써보면서 느낀 건 생각보다 단순했습니다. AI는 만능이 아니다 모델마다 잘하는 일이 다르다 무엇보다도 생각의 결이 다르다 그래서 “가장 성능 좋은 AI”
최근 공개된 .NET 11 Preview 1에서는 .NET MAUI와 Android 관련 몇 가지 변화가 있었다. MAUI를 써보는 개발자 입장에서 중요한 포인트만 간단히 정리하면 이렇다. 1. XAML Source Generation 기본 적용 XAML은 MAUI 앱 화면을 구성하는 선언형 언어다. .NET 10 MAUI부터는 XAML Source Generation 기능이 선택적으로 제공되었는데, 이번 .NET 11 Preview 1부터는 모든 MAUI 프로젝트에서 기본값으로 적용된다. XAML 파일을 자동으로 소스 코드로 변환해서 컴파일하는 방식 덕분에: 빌드 속도가 빨라지고 디버그 모드와 릴리스 모드에서 앱 동작이 일관되며 실행 성능도 조금 더 좋아졌다. 기존 방식(XAMLC)으로 돌아가고 싶으면 프로젝트 파일에 간단한 설정만 추가하면 된다. <PropertyGroup> <!-- Other properties like TargetFrameworks, etc. --> <Maui
한동안은 MVVM 규칙을 꽤 엄격하게 지키려고 했다. View는 최대한 얇게 로직은 전부 ViewModel로 이벤트는 Command로 상태는 바인딩으로만 전달 지금도 이 방향이 틀렸다고 생각하지는 않는다. 다만, 모든 화면에 이 규칙을 그대로 적용하려던 시기가 문제였다. MVVM을 잘 쓰고 있다는 확신이 있었던 때 MVVM 구조를 어느 정도 익히고 나면 이런 감각이 생긴다. “이제 MVVM답게 짜고 있다” 코드를 보면 그럴듯했다. View에는 로직이 없고 ViewModel은 깔끔하고 테스트도 가능해 보이고 문제는, 시간이 지나면서였다. 규칙을 지키는데 코드가 불편해지기 시작했다 어느 순간부터 이런 장면이 자주 나왔다. 단순한 UI 동작인데 Command → ViewModel → 상태 변경 → 바인딩 흐름을 한 바퀴 다 돈다 화면 로직이 ViewModel에 몰려 읽기가 더 어려워진다 디버깅할 때 “이 동작이 왜 발생했지?”를 따라가기 힘들어진다 규칙은 잘 지켰는데 코드를 다루는 감각은
Copilot의 제약을 느끼다 보면 자연스럽게 이런 생각이 든다. “그럼 Agent Framework에 Copilot 붙이면 되잖아?” 그래서 등장하는 게 OpenCode + GitHub Copilot SDK(Pro 이상) 조합이다. 기술적으로는 된다 구조만 보면 멋지다. OpenCode: Agent 오케스트레이션 GitHub Copilot SDK: 코드 잘 짜는 LLM JSON 기반으로 Agent 동적 생성 자동 코드 생성, 수정, 리뷰 이론적으로는 완벽하다. 그런데 현실은 다르다 문제는 딱 하나다. Copilot은 SDK로 쓰는 순간, Chat이 아니다. OpenCode에서 Copilot을 쓰는 건: Copilot Chat Copilot SDK = request 기반 호출 즉: Agent 하나가 한 번 생각할 때마다 request 여러 Agent면 n배 자동 루프면 지옥 “가능”과 “실용”은 다르다 이 조합은 이런 경우엔 좋다. PR 자동 리뷰 정적 코드 분석 CI 단계 판
한동안은 코드가 깔끔한 게 가장 중요하다고 생각했다. 메서드는 짧아야 하고, 이름은 의도가 명확해야 하고, 중복은 무조건 제거해야 한다고 믿었다. 지금도 그 생각 자체가 틀렸다고 보지는 않는다. 다만, 그때는 깔끔함 하나에 너무 많은 걸 걸고 있었다는 생각이 든다. 깔끔한 코드 = 좋은 코드라고 믿던 시기 코드를 작성할 때 이런 기준이 있었다. 1. 메서드는 한 가지 일만 해야 한다 2. 조건문이 길어지면 무조건 분리한다 3. 중복은 악이다 4. 코드가 길어지는 건 설계가 잘못된 것이다 이 기준으로 보면 조금이라도 투박한 코드는 다 고쳐야 할 대상이었다. 그래서 잘 돌아가는 코드도 “이건 좀 더 예쁘게 만들 수 있지 않을까?”라는 이유로 자주 손을 댔다. 그때는 그게 실력이라고 생각했다. 리팩터링은 늘었는데, 결과는 잘 모르겠던 때 이상한 건, 코드는 점점 정리되는데 마음은 편하지 않았다. 메서드는 쪼개졌는데 흐름을 따라가기가 더 어려워졌고 추상화는 늘었는데 실제 동작은 멀어졌고 이
혼자 코딩할 때는 몰랐다. 팀 코드에 들어가고 나서야 알게 된 게 있다. 내 코드 취향이 항상 좋은 선택은 아니라는 것. 혼자 개발할 때는 취향이 곧 기준이었다 개인 프로젝트를 할 때는 기준이 명확했다. 내가 보기 편하면 되고 내가 이해할 수 있으면 되고 내가 고치기 쉬우면 됐다 그래서 자연스럽게 코드 스타일도, 구조도, 설계 방식도 전부 내 취향으로 맞춰졌다. 그게 당연하다고 생각했다. 문제는 팀에 들어가고 나서였다. 팀 코드에서는 “내가 보기 좋은 코드”가 정답이 아니다 팀 코드에서 처음 부딪힌 건 이 지점이었다. 내가 정리한 코드인데 다른 사람은 이해를 못 한다 내가 깔끔하다고 느낀 구조인데 질문이 계속 나온다 내가 선호하는 방식인데 팀에서는 불편하다고 한다 처음에는 솔직히 억울했다. “이게 더 좋은데 왜 안 쓰지?” “이게 더 깔끔한데 왜 유지하자는 거지?” 하지만 시간이 지나면서 문제가 코드에만 있는 건 아니라는 걸 알게 됐다. 팀 코드에서 중요한 건 ‘취향’이 아니라 ‘합
Copilot Pro면 거의 무제한 아니야? 솔직히 말하면, 나도 그렇게 생각했다. GitHub Copilot Pro를 결제하면 GPT-4 계열도 쓰고, Claude도 선택할 수 있고, Agent도 만들 수 있고… 대충 보면 “이거 하나면 끝 아니야?” 싶다. 그런데 조금만 깊게 들어가면 느낌이 달라진다. Chat과 SDK는 완전히 다른 세계다 Copilot을 쓰다 보면 자연스럽게 이런 생각이 든다. “Chat으로 쓰면 거의 무료인데, 왜 Agent나 Skill을 쓰면 request가 소모되지?” 이 차이는 사용 주체에서 갈린다. Copilot Chat 사람 + IDE + UI Copilot이 내부적으로 최적화 기본 모델(GPT-4.1, 4o 등)은 request 소모 없음 Copilot SDK / Agent / Skill 프로그램이 Copilot을 호출 LLM 호출 단위가 명확 여기서부터는 premium request 세계 즉, "사람 옆에서 쓰는 Copilot"과 "시스템 일부로
선언형 UI를 꿈꾸며 마주한 현실 : 왜 우리는 여전히 명령형을 놓지 못하는가 최근 UI 개발의 주류가 선언형(Declarative)으로 이동하며, 기존의 명령형(Imperative) 방식은 마치 구시대의 유물처럼 취급받기도 합니다. 하지만 실제 거대하고 복잡한 시스템을 운영하다 보면 깨닫게 됩니다. 명령형 프레임워크는 결코 '후진 기술'이 아니라, "가장 명확한 통제권" 을 상징한다는 것을요. 특히 모든 것이 자동화되는 AI 시대에, 역설적으로 명령형 방식은 우리에게 더 강력한 무기가 될 수 있습니다. 1. 0과 1 사이의 '확신' : 명령형의 힘 선언형 UI는 프레임워크의 '판단'에 의존합니다. 상태를 던져주면 프레임워크가 알아서 최적의 시점에 화면을 다시 그리죠. 하지만 그 '알아서'라는 과정이 때로는 블랙박스가 됩니다. 명령형의 가치: "버튼을 누르면, 이 텍스트를, 지금 당장 빨간색으로 바꿔라." 이 명료함은 복잡한 디버깅 상황에서 빛을 발합니다. 내가 짠 코드만큼만 정확히
MVVM이 과해지는 순간들 : 패턴의 노예가 되지 않는 법 MVVM(Model-View-ViewModel)은 분명 훌륭한 패턴입니다. UI와 로직을 분리하고, 테스트 가능성을 높여주죠. 하지만 어느 순간 우리는 앱을 만드는 게 아니라 '패턴을 유지하기 위해' 코딩을 하고 있다는 느낌을 받을 때가 있습니다. 이른바 "Over-Engineering"의 늪입니다. 오늘은 제가 현업에서 느낀, MVVM이 오히려 생산성을 갉아먹고 코드를 복잡하게 만드는 '과한 순간들'을 짚어보려 합니다. 1. 배보다 배꼽이 더 큰 '단순 화면' 단순히 텍스트 몇 개 보여주고 확인 버튼 누르면 닫히는 팝업이나 설정 창을 만드는데, 뷰모델을 만들고, 프로퍼티 선언하고, RaisePropertyChanged를 도배하고 있지는 않나요? 현실: 코드 몇 줄이면 끝날 일을 위해 파일 3개를 만들고 바인딩을 연결하느라 시간을 다 보냅니다. 진단: 데이터 변화가 거의 없고 로직이 전무한 정적 화면이라면, 굳이 엄격한 MV
1. 도입: 공감대 형성 (누구나 겪는 Fat ViewModel) 처음엔 버튼 하나, 텍스트 하나라 참 예뻤던 내 뷰모델... 기능을 추가하다 보니 어느덧 수천 줄이 되어버린 경험, 다들 있으시죠? "뭐 하나 고치면 어디가 터질지 몰라 무서워요." "프로퍼티랑 커맨드가 너무 많아서 스크롤 내리다 지쳐요." 핵심 질문: 왜 뷰모델은 나이를 먹을수록 뚱뚱해질까요? 2. 원인: '부분 수리'의 한계 우리가 흔히 쓰는 MVVM은 싱크대 수리랑 비슷합니다. 수도꼭지 고치고, 배수구 고치고... 그러다 보면 어느새 싱크대 밑이 배관으로 엉망이 되죠. MVVM 방식: "이름 바꿔!", "나이 바꿔!", "로딩 켜!" (조각조각 명령하기) 이 조각들이 서로 엉키기 시작하면 그때부터 지옥이 시작됩니다. 3. 대안: '사진 찍기(Snapshot)'의 마법 여기서 MVI라는 어려운 이름 대신 '스냅샷' 이라는 개념을 가져와 봅니다. 매번 부분 수리하지 말고, 그냥 "내가 원하는 화면의 완성된 사진"을
사건 개요 GitHub Copilot Pro는 첫 달 무료였다. 어차피 사용할 예정이었고, 장기적으로도 쓸 가능성이 높았기 때문에 별다른 고민 없이 결제를 진행했다. 결제 수단은 토스뱅크 체크카드(MasterCard). 잔액이 충분하다고 생각했고, 특별히 문제 될 거라고는 전혀 예상하지 못했다. 이 선택이 모든 일의 시작이었다. 결제 실패, 그리고 정보의 공백 결과는 결제 실패였다. 사실 이건 이상할 것도 없었다. 결제에 사용한 토스뱅크 체크카드는 잔액이 없는 상태였고, 말 그대로 돈이 없는 카드로 결제를 시도한 결과였다. 이 상황을 만든 사람은 시스템도, 서비스도 아닌 전적으로 나였다. “이런 걸로 막히는 사람이 나밖에 없는 건가?” 다시 시도, 그리고 상태가 꼬이기 시작하다 잔액 부족이라는 사실을 인지한 뒤, 계좌에 15,000원 정도를 다시 넣고 결제를 한 번 더 시도했다. 이번에는 뭔가 진행되는 느낌이 있었다. 먼저 1달러가 정상적으로 빠져나갔다는 알림이 왔고, 곧이어 10달
어제 코파일럿을 결제하고 오늘이 딱 2일 차다. 결론부터 말하자면, 생각했던 것보다 생산성 변화가 너무 급격해서 조금 당황스럽기까지 하다. 4일 치 분량을 하루 만에 끝내다 이번 주에 대략 3~4일 정도 걸릴 거라고 예상했던 작업들이 있었다. 로직을 짜고, 예외 처리하고, 구글링, AI(본인 ChatGPT, Claude Code, Gemini 무료만 사용 중), 테스트 까지 포함한 계산이었다. 그런데 어제 하루 만에 그 분량이 전부 끝나버렸다. 내가 타이핑하는 속도보다 코파일럿이 제안하는 속도가 빠르다 보니, 코드 구현 자체에 드는 물리적인 시간이 압도적으로 줄어든 탓이다. 덕분에 계획에 없던 시간의 텀이 생겨버렸다. 키보드에서 손을 떼고 고민하는 시간 코파일럿을 쓰면서 가장 크게 변한 점은 '키보드에서 손을 떼고 있는 시간'이 늘어났다는 것이다. 예전에는 "이 기능을 어떻게 코드로 구현할까(How)"를 고민하며 키보드를 두드렸다면, 지금은 코파일럿이 구현을 돕기 때문에 "어떤 기능
안녕하세요 이광석입니다. WPF에서는 컨트롤을 만들 때 접두어를 무조건 붙여야하는줄 알고 있었습니다. 이러한 방법의 시도를 할 수 있게 된 계기는 아발로니아 프레임워크에서 나왔네요. https://blog.naver.com/lukewire129/223358979123 [AvaloniaUI] 접두어(xmlns) 없는 컨트롤 만들기 안녕하세요 이광석입니다. WPF에는 컨트롤을 만들 때 마다 항상 xmlns:ctrls, xmlns:units 등의 접두어 ... blog.naver.com 아발로니아에서 하는것과 동일하게 접두어 생략을 위해 AssemblyInfo.cs 파일에 [assembly: XmlnsDefinition ("http://schemas.microsoft.com/winfx/2006/xaml/presentation", "네임스페이스")] 위 코드를 삽입하면 이런식으로 가능해집니다. xaml 계열의 프레임워크는 파고들면 파고들수록 신기한것들이 많네요.
안녕하세요. 이광석입니다. VSCode에서 Avalonia UI를 개발하기 위한 확장도구 추천을 해보도록 하겠습니다. Avalonia for VSCode 가장 기본적이겠죠..!? 2. Nuget NuPkg Viewer 이게 뭐? 라고 생각하시겠지만 Avalonia의 경우 프로젝트 Template의 라이브러리 버전과 Nuget 버전이 똑같이 올라가진 않습니다. 최신버전을 유지하고 싶으신분들이라면 설치를 강추합니다. 이 부분은 아발로니아 뿐만 아니라 Vscode Ide 툴을 둔 닷넷개발에서 유용할거같아요! [사용방법] 1. *.csproj 파일을 엽니다. 2. 아래 V아이콘을 클릭합니다. fixed 11.0.6이 보이는데 latest 11.0.10을 클릭해주면 실시간으로 업데이트해줍니다. 업데이트 해줍니다. 3. Pretty XML XML 뿐만 아니라 XAML, AXAML 전부 이쁘게 정렬해주더라구요! axaml 편집 창에 우클릭 Prettify xml을 클릭해주시면 이쁘게 정렬이 됩니
안녕하세요. 이광석입니다. 조만간 스피커로써의 데뷔무대를 위해 발표 준비를 위해 조금씩 준비하고 있는데 개발하기 위한 가장 필요한 IDE 설치하고 재설치하고 하는 과정에서 아발로니아 Preview 아이콘 버튼이 보이지 않게 되었습니다. 아마 VScode로 Avalnoia 뿐만아니라 다른 프레임워크의 개발을 하신다면 무조건 일어날 수 있을거라 판단이 됩니다. 우선 저의 해결 방법을 공유 드리겠습니다. 1. 윈도우창 오른 쪽 하단 영역에 XML 을 클릭합니다. 2. Avalonia XAML로 변경해줍니다. (Before) XML 일경우 프리뷰 아이콘 상태 (After) 위 작업 이후 아발로니아에선 HotReload(라이브러리 설치를 하면 가능)에 대해 사용이 되긴하지만.. 아무래도 별도로 작업을 해줘야..불편한지라.... 하지만 Preivew은 저희가 생각했던 기능보다 훨씬 대단합니다. 이건 발표 자리에서 공개하겠습니다 (찡긋)
안녕하세요. 이광석입니다. VScode로는 다른 IDE(라이더, Vs)와 다르게 템플릿을 만들기 위해선 확장도구를 의존해야되는데 나올때까지 기다릴 순 없으니 아래 명령어를 통해 일단 시도를.. Avalonia 템플릿 설치하기 dotnet new install Avalonia.Templates::11.0.10.1 Avalonia 템플릿만 골라보기 dotnet new list avalonia 프로젝트 생성 명령어 /*기본 앱*/ dotnet new avaloina.app /*MVVM 패턴 앱*/ dotnet new avaloina.mvvm /*크로스플랫폼 전용 앱*/ dotnet new avalonia.xplat 프로젝트 생성 시 기본 옵션 (닷넷 템플릿 공용) 옵션: -n, --name <name> 생성 중인 출력의 이름입니다. 이름을 지정하지 않으면 출력 디렉터리의 이름이 사용됩니다. -o, --output <output> 생성된 출력을 배치할 위치입니다. --dry-run 템플릿이
안녕하세요 매번 이러한 행사는 매번 참석자로만 참석하다 WPF 세션으로 첫 발표를 하게 되었습니다. 발표의 내용이나 자세를 어떻게해야할지 많은 생각과 시나리오를 그렸지만 역시.. 이상과 현실은 너무 멀었네요. 이번 발표 내용을 아래와 같이 회고 겸 요약 해보겠습니다. 'WPF 현대적 재해석 아발로니아' 라는 주제로 발표를 진행하였습니다. WPF세션이지만 다른 프레임워크 소개한 이유는 기존 WPF 데스크탑 앱을 크로스플랫폼인 아발로니아를 통해 다양한 os에 확장할 수 있게 해보기 위한 기반을 다져보기 위해 해당 주제로 정하였습니다. 핫리로드 라이브러리 적용과 WPF로 그려진 XAML을 Avalonia에 사용되는 XAML로 컨버팅을 중점으로 Button 이벤트 소스, 로또 조회 프로그램, 데이타 그리드 랜덤 출력 프로그램, DevTools 관리라는 주제로 진행하였습니다. 핫리로드 라이브러리 적용의 경우 어설픈 라이브코딩 실력으로 짜잔 하는 것을 보여드리진 못했습니다. (무대에 내려오고
안녕하세요 이광석입니다. 4월 밋업이 끝난 일로부터 약 일주일이란 시간 동안 5월 발표에 대한 밋업주제에 대해 공유를 해야만 했습니다. 4월에 못했으니 다음 발표엔 더 잘해야된다는 부담이 됬던터라 정하기가 어려웠습니다. 이 부담감 떨치기 위해 아주 가벼운 주제로 심적인 부담감을 덜어내보고자 그동안의 제 오픈소스 저장소와 github를 순회하던 중 CSharpForMarkup 이라는 오픈소스가 눈에 보였습니다. 이 오픈 소스를 정한 이유들을 정리하자면 WPF를 도전하고 싶지만 개발적인 측면에서만 봤을 땐 - XAML 이라는 생소한 마크업 언어 - MVVM 패턴의 이해 이 두가지 문턱에 많이들 포기할 수 있지 않을까? 라는 생각을 하였습니다. 그렇기에 MVVM에 View 부분 빠른 예제 작성을 통해 진입하는 것이 나쁘지않을 것이라는 판단하에 발표주제로 선정하였습니다. CSharpForMarkup 샘플 보면 제 위의 의도와 다르게 이것저것 클래스를 생성해야될 것도 많고해서 이번 발표 준비
안녕하세요 이광석입니다. 육아와 본업 때문에 밋업발표 후기가 많이 늦어졌네요.. 벌써 3번째 발표를 맞췄습니다. WPF 세션은 늘 라이브코딩의 방식으로 발표를 하다보니 라이브의 저주가 매번 발생하는바람에.. 발표시간 늘 압축되어버리네요.. 빈 시간 들은 늘 저의 수다로 마무리 되는것만 같네요. Blazor 화면 구역을 프론트엔드 프레임워크(Vue, React, Blazor 등)을 가지고 Piral이라는 프레임워크로 묶어서 빌드가 핵심이였습니다. Piral은 리액트, 블레이저 기반으로 프로젝트를 만들어 사용할 수 있습니다. WPF개발자 시점에서는 Priral을 프리즘의 Region이라는 기능과 유사하다고 생각하면 됩니다. 여러 Region에 각 XAML을 사용하는 프레임워크(avalonia, maui, uno 등등)로 하나의 프로젝트를 만든다고 생각하면 더더더 이해하기 쉬울겁니다. WPF 윈도우 개발자라면 기본 윈도우의 API와 기본적인 것을 다뤄볼 수 있어야할 것 같다는 생각에서 `
안녕하세요. 이광석입니다. 회사 업무에 리액트 웹 프론트 개발을 하게 되었는데, 처음엔 왜 해야되나..와 아 재밌네 이 두가지의 형태의 감정상태가 반복적으로 왔다갔다하다 최근에 들어서야 아 재밌네로 변화된 상태입니다. 리액트의 개념을 이해되기 시작하니 자연스럽게 예전에 살짝 공부했던 MauiReactor에 다시 한번 보게 되었습니다. 그러던 중 MauiReactor의 Version2 소식을 접하였고, 발표 준비 겸 해서 간단하게 포켓몬도감을 만들어보았습니다. (링크는 하단에..) 업데이트 사항은 다음 과 같습니다. - 코드 간소화 - [Prop], [Param], [Inject] attributes 추가 코드 간소화를 통해서 기존 선언형 방식에서 더 직관적으로 변화되었고, 어트리뷰트의 활용을 통해 개발자의 보일러플레이트 최대한 줄일 수 있게 되었습니다. 코드 간소화 params 키워드의 생성으로 인해 배열 생성 구분없이 매개변수에 넣을 수 있게 되었고, 좀 더 심플한 코드를 구현할
안녕하세요 이광석입니다. 4번째 발표를 마쳤습니다. 이번 밋업에서는 WPF가 아닌 MAUI로 하였는데 현장에서는 심심해서라는 단순한 이유로 말씀드렸지만, 'XAML 계열 UI프로그램은 MVVM이 최고야' , MVU패턴, MAUI와 MVU패턴의 만남 등 여러 가지 소개를 해보고싶었기 때문에 MAUI에 발표주제를 잡아서 진행하였습니다. JavaScript Wrapping을 통해 Blazor 기능 극대화하기 (김근희) Blazor는 많이 상용되어있지않기 때문에 곳곳에 숨어있는 기능들을 발표하는 자리로 보기 때문에 새로웠고 즐거웠습니다. 선언형? MVU? MauiReactor? 도대체 그게 뭔데? (이광석) 선언형 > 더 적은 코드로 직관적인 UI표현 MVU > CSharpMarkup과 다릅니다! 뷰를 새로 그릴 때 VirtualDom이란 Diffing 기술을 통해 변화된 UI만 변경하는 방식입니다! MauiReactor > Maui MVU패턴 라이브러리 中 하나이며 해당 라이브러리 개발자
안녕하세요, 이광석입니다. 오늘은 MVVM 패턴을 사용한 개발 시 폴더 구조에 대해 논의하고, 이에 대한 저의 생각을 공유해보고자 합니다. MVVM 개발을 진행할 때, 일반적으로 아래의 세 가지 폴더 구조가 기본적으로 사용됩니다. Model ViewModels Views 프로젝트의 규모가 커질수록 다양한 기능과 여러 화면들이 추가되면서, 코드 탐색 과정이 복잡해지고 속도가 느려질 수 있습니다. 이를 해결하기 위해 키워드별로 폴더 트리를 구성해보는 방법을 제안드립니다. 제안하는 폴더 구조 최적화 방안: 애플리케이션 기능에 맞는 주요 키워드를 선별합니다. 선별된 키워드를 기준으로 Features 폴더 내에 각각의 하위 폴더를 생성합니다. 각 키워드에 해당하는 폴더는 아래와 같은 구조를 가집니다: - Features ㄴ 키워드 이름 ㄴ Api // 외부 연동 Api 모음 ㄴ Command // 사용되는 명령 모음 ㄴ Model // DTO, DAO 등 각 서비스API 사용될 모델과 Vie
WPF 개발을 하다 보면 가장 당혹스러운 순간이 있습니다. 코드는 완벽해 보이는데, 앱을 실행하자마자 날아오는 InvalidOperationException. 특히 ItemsSource와 관련된 에러는 초보부터 숙련자까지 한 번씩 발목을 잡곤 하죠. 오늘은 이 예외가 발생하는 3가지 결정적 이유와 그에 대한 깔끔한 해결책을 정리해 보겠습니다. 1. "이미 주인이 있습니다" (Items vs ItemsSource 충돌) 가장 빈번하게 발생하는 케이스입니다. 증상: Items 컬렉션이 ItemsSource를 사용하기 전에는 비어 있어야 합니다.라는 메시지 출력. 진짜 이유: WPF의 ItemsControl은 데이터를 보여주는 통로가 하나뿐입니다. XAML에서 <ListBoxItem> 등을 직접 추가(Items) 해놓고, 나중에 C# 코드나 바인딩으로 ItemsSource를 할당하면 WPF는 "둘 중 뭘 써야 할지" 결정하지 못해 파업을 선언합니다. Solution: ItemsSource
안녕하세요. 개발자 이광석입니다. 아발로니아 데스크탑에 Runtime 중 axaml HotReload 라이브러리가 생겼다고 하네요. (WPF 할땐 Runtime 중에 xaml 수정을 최대한 자제하던 터라 불편함이 없었는데 아발로니아는 아직은 낯설어서인지..Runtime 중에 수정을 해보고싶더라구요..) 라이브러리 설치 > Avalonia.Markup.Xaml.Loader > HotAvalonia > HotAvalonia.Extensions HotAvalonia.Extensions 1.0.0 Provides utility extension methods for HotAvalonia, making it simpler to enable or disable the hot reload feature as needed. nuget.org HotAvalonia 1.0.0 A .NET library that offers hot reload functionality for Avalonia appli
안녕하세요 개발자 이광석입니다. 이번 업데이트(1.0.0.73)에서는 DarkThemeWindow을 사용에 있어서 추가된 기능에 대해 공유하고자 합니다. 기존 DarkThemeWindow는 Background로 변경할 경우 아래 그림처럼 전체 타이틀바 영역까지 변했었는데요 이렇게하다보니 타이틀바와 메인 컨텐츠 영역의 색상 분리가 필요할 수 있다는 생각이 들어서 TitleBarColor 라는 추가하였습니다. 아래 그림은 TitleBarColor Yellow를 준 결과화면입니다. 앞으로 전체 색상을 변경하려면 Background, TitleBarColor 두 프로퍼티를 건들여야하는 불편함은 있지만 확장성을 고려해 변경해나가야한다는 판단이 있었기 때문에 불편함은 감안하는게 맞다고 판단하였습니다.
안녕하세요 개발자 이광석입니다. https://blog.naver.com/lukewire129/223240722546 [WPF] Jamesnet.Wpf DarkThemeWindow _PART 1 안녕하세요 개발자 이광석입니다. 이번 업데이트(1.0.0.73)에서는 DarkThemeWindow을 사용에 있어서 추... blog.naver.com 해당 블로그 내용에서 타이틀바 배경색 관련 프로퍼티 명이 변경되어 알려드립니다. 23년 10월 31일에 업데이트 된 1.0.0.99 버전부터는 가독성을 위해서 프로퍼티 명칭을 변경하였습니다. TitleBarColor -> TitleHeaderBackground
안녕하세요 개발자 이광석입니다. WinUI3, WPF, Uno, Avalonia의 공통점이 뭔지 아시나요? UI를 그리는데 xaml를 사용해야한다는 것입니다. xaml은 익히면 쉽게 활용할 수 있고 다양한 프레임워크에 사용할 수 있다는 장점을 갖고 있습니다. 반면 익히는 과정이 새로운 형식이기 때문에 익히는데 러닝커브가 존재할 수 밖에 없습니다. mvvm이라는 개념을 익히기 위해 공부를 하고 싶어도 대게 레퍼런스로 되어있는 프로젝트들 또한 xaml 기반으로 작성되어있습니다. 그렇기 때문에 접근하기가 쉽지 않습니다. 'xaml를 사용할 수 없어서 MVVM이란 개념도 익히기 힘들어!' 라는 말도 존재하는 거 같습니다. 하지만 그말은 이제 옛말이 되어버릴 것 같네요. 제가 소개 할 라이브러리는 Maui 전용 라이브러리 CommunityToolkit.Markup(이하 Markup으로 명칭 변경) 입니다. Getting Started with the .NET Multi-platform App
안녕하세요 개발자 이광석입니다. 지난 번 올린 글에 이어 HotReload라는 기능에 대한 주제로 다뤄볼 예정입니다. [MAUI] CommunityToolkit.Markup - 시작하기 안녕하세요 개발자 이광석입니다. WinUI3, WPF, Uno, Avalonia의 공통점이 뭔지 아시나요? UI를 ... blog.naver.com Markup의 단점은 UI를 실시간으로 고치지 못한다는 문제점을 가지고 있습니다. 그럼에도 불구하고 왜 소개를 하느냐? 해결방법이 있기 때문입니다. 아래 문서와 영상을 보시다시피 별도의 HotReload라는 기능을 통해 만들어진 방법입니다. 구축과정도 좀 불편하고.. 어떻게해야하는지 영상을 좀 돌려봐야지만 할수있기 때문에 불편합니다. (제가 했을땐 말이죠..) 관련 문서 : https://dev.to/davidortinau/c-ui-and-net-hot-reload-a-match-made-in-net-maui-243f C# UI and .NET Hot R
안녕하세요 개발자 이광석입니다. 기존 창 최대화 시 TaskBar를 가리지 않는 상태입니다. 이번 업데이트 1.0.0.109버전부터는 TaskBar를 가릴 수 있는 기능을 도입하였습니다. 이유는 시스템 개발 요구사항에 따라 덮어야 하는 상황이 종종 있기 때문에 기능을 추가하였습니다. IsShowTaskBar = false 를 넣어줌으로써 처리를 할 수 있습니다. 이상입니다!
안녕하세요 개발자 이광석입니다. VS로만 개발하고 있던터라.. HotReload가 되겠거니하고 믿고 있었습니다만.. 오늘 Xamarin&Maui 카톡 단톡방에서 질문이 하나 올라왔습니다. '라이더로 Maui하는 xaml 핫리로드가 안되는건가요?' '허? 왜안되지? 왜?' 무작정 프로젝트를 열어 실행해보았습니다. 역시나 안되던거였네요.. Window로 해서도 안되고 안드로이드로 해서도 안되고.. 여러 검색해본 결과.. 디버그 모드 에서만 동작된다고 합니다. '내가 알고 있는 디버그 모드는 f5인데 왜 이게 디버그모드가 아니지..?' 혼잣말을 반복하며 툴의 이쪽저쪽을 찾아다니다 발견하였습니다. 라이더에서는 디버그모드키는 [alt] + [f5] 라는 거였습니다. 일단, 디버그모드도 키도 알았고 자 해볼까~? 어라 왜안되지? xaml hotreload는 UWP, WPF 프레임워크는 visualstudio에서만 동작된다고 하네요.. https://learn.microsoft.com/ko-kr
안녕하세요 이광석입니다. 많이들 WPF와 Avalonia의 xaml로 그리는것은 똑같아! 하지만 Trigger가 없다는데? 소문만 무성하지... 실제로 비교되는 어떤 식으로 표현되는지 어떻게해야되는지 문서를 찾아봐도 딱히 없었을 겁니다. 다음 코드를 예시로 구현하여 보도록하겠습니다. <!-- WPF --> <ListBoxItem> <ListBoxItem.Style> <Style TargetType="{x:Type ListBoxItem}"> <Style.Triggers> <Trigger Property="IsSelected" Value="True"> <Setter Property="Background" Value="Red"/> </Trigger> </Style.Triggers> </Style> </ListBoxItem.Style> </ListBoxItem> <!-- Avalonia UI--> <ListBoxItem> <ListBoxItem.Styles> <Style Selector="
안녕하세요 이광석입니다. 프로그램 실행 시 이미지 파일을 불러오지 못하는 이슈가 생겨 공유하고자 합니다. 상황 1. 타 프로그램(이미지 불러오는 프로그램의 경로와 다른)에서 현재 이미지를 불러오는 프로그램을 실행시킵니다. 2. 이미지를 불러오지 못한다. 3. 타 프로그램에 의한 실행이 아닌 이미지를 불러오는 프로그램만 실행시킬 땐 정상 동작 왜 이런 상황이 일어났을까요? 저의 경우 이미지 프로그램은 상대경로였기 때문에 '폴더명\\**.png'로 실행시켰습니다. 타 프로그램에서 실행시켰을 때의 해당 경로는 '타 프로그램의 실행위치\폴더명\**.png' 로 되었기 때문에 찾지를 못합니다. 그래서 다른 방안을 찾아 테스트 해본 결과 Path.GetCurrentDirecotry() - 동일 Environment.CurrentDirectory - 동일 위 두개는 동일한 현상이 발생되었습니다. 그럼 어떻게 해결하느냐 Path.GetDirectoryName(Assembly.GetEntryAss
안녕하세요. 이광석입니다. 기존 WPF로 만들어진 리그오브레전드의 시작버튼을 아발로니아로 커스텀하면서 비교해보려합니다. 아발로니아의 경우 Style 안에 Style을 넣음으로써 중복을 방지 할 수 있는데요. Selector의 Value '^ /template/ Border#PART_GoldLine' 의 의미하는 것은 template 안에 Border라는 컨트롤속성을 가지고 있으며 PART_GoldLine이라는 이름 가진 컨트롤 이라는 뜻으로 이해하시면 쉽습니다. 컨트롤에서 Classes를 통해 Style을 가져오는 방법도 있지만, 아발로니아에선 위와 같은 방식으로 직접 컨트롤을 지정하여 스타일을 넣을 수 가 있습니다. 1. WPF와 AvaloniUI 이벤트 // WPF <Trigger Property="IsMouseOver" Value="True"> <Setter TargetName="path" Property="Fill" Value="{StaticResource ArrowFillO
안녕하세요. 이광석입니다. 어제 AvaloniaUI 버전으로 만들었던 것을 Maui로 변경하여 작업해보았습니다. Avalonia의 경우 Storyboard, Trigger 정도의 WPF와의 차이점이 보였다면, Maui의 경우엔 - WPF와의 차이점은 컨트롤의 Template의 제한 & ToggleButton 컨트롤의 부재 - StoryBoard의 부재, xaml상의 애니메이션처리 부재 위 2가지 차이점을 다음과 같이 처리하여 해결하여 만들어보았습니다. 컨트롤의 Template 제한과 ToggleButton컨트롤의 부재 우선 Template이 없기 때문에 TemplateView를 통해 ToggleButton을 만들고 ToggleButton의 주 핵심 기능인 Tapped 했을 때 변환하는 Property IsToggled를 만들어 Toggle기능과 비슷한 컨트롤을 만들어 해결하였습니다. public class ToggleButton : TemplatedView { public stati
안녕하세요 이광석입니다. WPF에는 컨트롤을 만들 때 마다 항상 xmlns:ctrls, xmlns:units 등의 접두어 생성 후 컨트롤를 만들어야 했습니다. 하지만, 아발로니아에서는 접두어 없이 내가 만든 컨트롤을 axaml 상에서 불러오게끔 하는 컨트롤 사용하는 방법이 있습니다. 우선, 다음 그림들을 한번 봐보시죠? MainContent라는 컨트롤은 제가 임시로 만든 컨트롤인데요. 앞에 접두어가 없지요? 여기에도 없지요? 어떻게하느냐? XmlnsDefinition을 설정하면 됩니다. 우선 해당 프로젝트에 Properties라는 폴더를 생성합니다. Properties 폴더 안에 AssemblyInfo.cs 클래스파일을 생성합니다. 아래 코드를 삽입합니다. using Avalonia.Metadata; [assembly: XmlnsDefinition("https://github.com/avaloniaui", "생성하고자하는 axaml 파일과 cs의 폴더경로")] '생성하고자 하는 ax
안녕하세요. 이번 시간에는 저번 OAuth 로그인 연동하기 이어서 해볼까 합니다. https://blog.naver.com/lukewire129/223170542074 OAuth 로그인 연동하기 Ep.1 - (feat.Github) 안녕하세요. 이번 시간엔 Github OAuth App에 등록 후 Client ID를 통해 인증을 해보도록 하겠습니... blog.naver.com 저번 시간에 github의 인증까지만 처리하였습니다. 이것을 서비스에 로그인 하기위해선 기본정보를 저장해줘야 합니다. 별도의 서비스가 없는 상태이기 때문에 Firebase와 비슷한 Supabase를 이용해보도록 하겠습니다. Supabe에 기본적인 사항들은 다른 블로그에도 많이 나와있기 때문에 제외하고 Github Auth에 관련 된것만 공유해드리도록하겠습니다. [Authentication] - [Providers] Github의 Client ID와 Client Secret 값을 기입 후 Callback URL
안녕하세요 최근 업데이트한 Visual studio 2022(17.7.0)에서 같은 솔루션 내 프로젝트에서 같은 폴더의 이름이 존재할 경우 변경되지 않는 이슈가 있는 것 같습니다. 언젠간 고쳐지겠지만 수정되는 것을 마냥 기다릴 수 없기 때문에 우선은 업데이트 롤백을 결정하였습니다. 인스톨러 열기 시작에서 Installer를 입력해주면 'Visual Studio Installer' 가 검색되는데 이것을 열어줍니다. 이전버전으로 롤백 [자세히]를 누르게 되면 복구, 제거, 이전 버전으로 롤백 등등이 있는데 '이전 버전으로 롤백'을 눌러줍니다. 롤백된 버전이 너무 낮은듯 싶어서 찾아보니 17.7.0의 이전 버전은 17.6.6이였네요 저의 PC에서의 마지막 버전이 17.6.2 이여서인지 해당 버전으로 롤백이 된 것 같습니다. p.s 마지막으로 다시 테스트 해보고 내용 추가로 올려드리도록 하겠습니다. 해당 이슈는 vscode로 WebAPI 프로젝트를 생성한 후 visual studio로 열었
안녕하세요 오늘 하루는 DigitRoll 이라고 불리는 컴포넌트를 만들어보았는데요. DigitRoller이란? 기존 숫자에서 다른 숫자로 변경 시 아무런 인터렉티브한 효과 없이 숫자만 덩그러니 바뀌는 것이지만 digitrol의 경우 숫자가 위 또는 아래로 움직이면서 인터렉티브한 애니메이션을 통해 변경합니다. 다른 언어에서는 이미 많은 오픈 소스 형식으로 나와있는데 WPF는 제가 못 찾아서인지..잘나오지 않더군요. 저의 DigitRoll은 컨트롤 구성은 기본적으로 사용자지정컨트롤을 이용하여 만들었습니다. 전체 감싸고 있는 ContentControl과 그 안에 string을 각각 CustomListBox로 나뉘어서 처리하였습니다. ListBoxItem(DigitUnit)에 인터렉티브한 애니메이션을 넣어서 처리하였습니다. 숫자 변경의 원리는 현재 숫자가 다음 숫자보다 나을 경우 카운팅하면서 해당 숫자를 비교하였고, 만일 반대일 경우 9까지 카운팅 후 0부터 다시 변경될 숫자로 변경처리를
안녕하세요. 이번 시간에는 아발로니아의 화면 전환 방 아발로니아 프로젝트 만들기는 패스하고 가장 중요한 부분은 설명 드리도록 하겠습니다. ViewLocator.cs 우선 ViewLocator 클래스를 작성해줘야 합니다. 해당 클래스는 ViewModel값을 통해 화면을 전환하기 위함인데요. (코드를 보다보니 낯이 익어서 생각해보니 프리즘에서 뷰와 뷰모델에서 매핑하는 방식의 코드와 유사한것 같더라구요) using Avalonia.Controls; using Avalonia.Controls.Templates; using BasicViewLocatorSample.ViewModels; using System; namespace BasicViewLocatorSample { public class ViewLocator : IDataTemplate { public Control Build(object? data) { if (data is null) { return new TextBlock { Te
안녕하세요 이번에 Nuget에 올린 컨트롤은 VerticalTabControl인데요 X(구 트위터)를 구경하던 중 HTML로 개발되었는데 TabItem과 TabContent를 개발자가 커스텀해서 만들어내는 것을 보고 WPF에서는 가능하지 않을까? 라는 컨셉으로 개발하게되었고, 탭메뉴와 탭의 컨텐츠를 사용자가 손쉽게 커스텀해서 만들 수 있게 만들어놨습니다. <*.Resources> 의 DataTemplate으로 탭메뉴와 탭의 컨텐츠를 구성한 후에 넣어주시기만 하면됩니다. 이런식으로 처리하여 넣어주시기만 됩니다! 선택되었을 때 색상,폰트색상을 직접 선택기능과 마우스가 over 되었을 때 색상, 폰트색상을 직접 선택할 수 있게 수정 예정입니다. Nuget에서도 다운로드가 가능합니다. 소스 및 시연영상 https://github.com/lukewire129/VerticalTabControl/tree/master GitHub - lukewire129/VerticalTabControl: Vet
안녕하세요 WPF 개발자 이광석입니다. 저에게 WPF에 대해 다시 한번 눈을 뜨게 해주신 이재웅님이 최근 온라인 서적 WPF INSIDEOUT 책을 발매하셨습니다. https://blog.naver.com/jamesnet214 jamesnet : 네이버 블로그 안녕하세요. 개발자 이재웅입니다. blog.naver.com WPF 기반으로 개인프로젝트를 구축하는 과정을 담은 책이지만 개발을 어떻게하면 좀 더 안정적으로 짤 수 있을지, 확장성 있게 어떻게 만들어갈지 등 여러 고민을 하다보니 개발 퍼포먼스를 향상시킬 수 있습니다. 현재 닷넷의 프론트엔드 프레임워크(Avalonia, MAUI, Uno, OpenSilver)들은 모두 WPF를 기반으로 발전된 것들입니다. 그렇기 때문에 WPF 다룰줄은 알지만 무엇인가 허전한 상태(?)에서도 위 프레임워크를 진입하고 계신 분들이 있을 거라 생각이 듭니다. 그만큼 매우 비슷한 면도 많고 오히려 발전적인 부분들이 더 많은 프레임워크들이기 때문이라고
안녕하세요 개발자 이광석입니다. Visual Studio of Mac 이 2024년 8월 31일까지 지원하는 포스팅을 접하게 되었습니다. https://devblogs.microsoft.com/visualstudio/visual-studio-for-mac-retirement-announcement/ Visual Studio for Mac Retirement Announcement - Visual Studio Blog Today we are announcing the retirement of the Visual Studio for Mac IDE. Visual Studio for Mac 17.6 will continue to be supported for another 12 months, until August 31st, 2024, with servicing updates for security issues and updated platforms from Apple. devblogs.m
안녕하세요 개발자 이광석입니다. 오늘 오후 3시까지 JetBrain 사에서 라이더를 파격적으로 첫 1년 구독자에게 65프로 할인 혜택을 적용한다고 소식에 1시간 내내 고민을하 다가 구매를 결정하였습니다. '난 visualstudio가 별로야' 라서 구매를 했다기 보다 '65프로 할인씩이나?' '다른 닷넷개발자분들이 신세계고 속도도 빠르다는데 써볼까..?' 라는 생각으로 구매를 결정하였습니다. 구매 후에 잠깐이지만 IDE를 다뤄봤을 때까지 얼마 사용하지 못했던 터라.. '역시 라이더 우와..' 라는 생각은 들진 못했습니다. 명확히 좋고 불편하고를 전달드리기 애매한 것 같습니다. 그냥 지금 기분은 오 닷넷의 새로운 IDE 툴~ 신선하네 정도로만 남아있어서인거 같네요.. 1년 안에 언제 한번 어떤 점이 좋고 어떤 점이 불편한지를 한번 남겨보는 건 좋겠다 라는 생각이 드네요 :)
안녕하세요. 개발자 이광석입니다. 요 몇일 동안 라이더로 WPF로 개발을 하면서 시간을 보내고 있는데요 확실히 너무 많이 Visual Studio 라는 IDE에 너무나도 의존적이였다는 것을 느꼈습니다. 라이더를 쓰면서 가장 크게 느꼈던것들을 공유 해볼까합니다. 라이더는 상속 클래스 향상(?)된 바로가기! Visual Studio에서 상속된 클래스를 타고 들어가기 위해선 F12키를 눌렀을 때 매번 조금의 딜레이 후 이동이 되었었습니다. 라이더에서는 처음 다운로드(?)처리에만 느려지고 그 후 부터는 딜레이없이 바로바로 전한되어 개발 속도 향상에 도움이 되었습니다. 라이더는 다양한 뷰모드로 인해서 코드 작성에 몰입감이 높음. 라이더는 총 5가지 상태의 뷰모드가 있어서 선택하여 각지각색의 몰입도를 제공하기 때문에 취향에 맞게 선택할 수 있다. 라이더는 런타임 중 xaml 수정 후 저장을 하면 바로 적용안됨. 이 부분에서 많이 의존적이였다는 것을 느꼈습니다.. 라이더는 빌드 후 실행 시 종종
안녕하세요 개발자 이광석입니다. 이재웅 개발자님과 함께 공동작업하고 있는 Jamesnet.Wpf를 오랜만에 2달만에 하게되었습니다! 주 업데이트 사항은 다음과 같습니다. Namespace & CLR 매핑 적용 이 기능은 Wpf스터디 방에 참여 중이신 몽상가 님께서 의견을 주셔서 적용하게 되었습니다. xaml에 James라이브러리 내에 속한 컨트롤을 자동 추가처리하였을 때 네임스페이스가..음 무지막지 길었죠.. <!-- 기존--> <ResourceDictionary .... xmlns:controls="clr-namespace:Jamesnet.Wpf.Controls;assembly="Jamesnet.Wpf.Controls"> .... <controls:JamesGrid/> </ResourceDictionary> <!-- 변경 --> <ResourceDictionary .... xmlns:james="https://jamesnet.dev/" > <james:JamesGrid/> </R
안녕하세요 개발자 이광석입니다. 9월 23일 Blazor Workshp 2023에 참석 후 모두가 거의 비슷한 생각과 공감을 했을 것 같습니다. '파트 씩 나눠서 설명 들으니깐 간단하고 개발 생산성이 생각보다 빠르겠는데?' (저만 그랬을까요..?) 사실 저는 작년부터 제대로 된 웹개발을 해봐야겠다 생각이 들어서 블레이저 프레임워크 3개월 간격으로 시도와 중단을 반복하였고 프로젝트 중 Vue.js의 한 페이지 부분 정도 API 연동 정도? 그 외에는 백엔드 정도로만 살짝 공부하고 말았었습니다. 서버 리소스 자료들(API, Entity Model, 사진자료 등)이 미리 준비 되어있었기 때문에 따로 백엔드 개발은 진행하지 않았지만 이 또한 장점이라고 볼 수 가 있었습니다. '###.Sever를 개발하고 ###.Client를 개발하면 되겠구나!?' Client의 컴포넌트, 페이지를 추가 할 때마다 Ctrl + S HTML 구문들을 하나하나 추가 할 때 마다 Ctrl + S HTML의 @Co
안녕하세요 개발자 이광석입니다. 저는 종종 인스타나 X에서 여러 개발자분들이 js로 만든 컴포넌트들을 WPF로 다시 구현해서 Nuget에 올리고 있습니다.(업데이트는 아직 시도하지 않고 있는...) 이번에 AnimationHintTextBox라는 라이브러리를 Nuget에 올렸습니다! 네이버 특성상 영상이 올라가지 않아 github에 따로 올렸습니다. 사용해보시고 피드백은 언제나 환영합니다! 아! 같이 저와 같이 참여 해보시고 싶은분들은 언제나 환영합니다! https://github.com/lukewire129/AnimationHintTextbox GitHub - lukewire129/AnimationHintTextbox Contribute to lukewire129/AnimationHintTextbox development by creating an account on GitHub. github.com
이벤트 설정 창 주 기능 - 이벤트 명 설정 - 스타팅 칩 설정 - 리바인 칩 설정 - 리엔트리 칩 설정 이벤트명, 스타팅칩, 리바인칩, 리엔트리칩의 컨트롤은 직접 사용자 지정 컨트롤로 제작하였습니다. JamenetWpf에 있는 JamesIcon을 활용해서 칩이미지를 가져오고 Textbox의 길이의 경우 자유롭게 길이를 조정할 수 있게 제작하였습니다.
이벤트 설정 창 주 기능 - 이벤트 명 설정 - 스타팅 칩 설정 - 리바인 칩 설정 - 리엔트리 칩 설정 이번 작업은 디자인 위주로 작업 진행하였습니다. 테이블 커스텀 디자인을 진행하면서 작업하고 있는데 은근 시간이 많이 잡아먹고 있네요.
안녕하세요 이광석입니다. AvaloniaUI는 .NET 기반의 오픈소스 기반으로 만들어진 UI 프레임워크입니다. 주요 특징 크로스 플랫폼 : Windows, Linux, macOS, AndroidOS, Ios, Web XAML 지원 활발한 오픈소스 생태계 빠른 렌더링 : 스키아 기반으로 그려졌기 때문에 가능 Avalonia 활용 데스크탑 어플리케이션 : 아직까진 WPF가 든든하게 지키고 있는 포지션이긴 하지만, Avalonia 매력에 빠진다면 WPF를 대체하고 싶어질수도 있습니다. 임베디드 어플리케이션 : Qt가 현재 시장을 장악하곤 있지만, 플러터로 변경하는 사례들이 등장하고 있기 때문에 희망이 있습니다. 아래 링크는 AvaloniUI의 경우 WPF와 UWP의 비교군입니다. 한번 재미삼아 봐보세요. https://docs.avaloniaui.net/docs/get-started/wpf/comparison-of-avalonia-with-wpf-and-uwp WPF and UWP Co
Converter Description Negation Operator 값 앞에 '!'를 붙일 경우 바전을 반환 할 수 있다. StringConverters.IsNullOrEmpty 입력 문자열이 Null이거나 비어있으면 True로 반환 StringConverters.IsNotNullOrEmpty 입력 문자열이 Null이거나 비어있으면 False로 반환 ObjectConverters.IsNull 객체가 Null이면 True로 반환 ObjectConverters.IsNotNull 객체가 Null이면 False로 반환 BoolConverters.And 모든 입력이 참일 경우에만 true BoolConverters.Or 모든 입력 값 중 하나라도 참이면 true Negation Operator <StackPanel> <TextBox Name="input" IsEnabled="{Binding AllowInput}"/> <TextBlock IsVisible="{Binding !AllowInp
제자리에서 뒤집혀지는 애니메이션을 구현 해야할 일이 있어서 찾게 된 것 들을 소스코드로 정리해보려고 한다. 내가 사용했던 방식은 DoubleAnimation과 ScaleTransform을 이용하여 구현하였다. DoubleAnimation flipDoubleAnimation = new DoubleAnimation (-1, 1, TimeSpan.FromMilliseconds (100)); flipDoubleAnimation.EasingFunction = new QuadraticEase { EasingMode = EasingMode.EaseOut }; var scale = new ScaleTransform (); frontCard.RenderTransform = scale; scale.BeginAnimation (ScaleTransform.ScaleXProperty, flipDoubleAnimation); 일반적으로 위와 같은 코드를 찾거나 구현해냈을 것이다. 하지만..여기서 끝이 아니다
안녕하세요 개인적으로 준비하고 있는 서비스가 있어서 만들기 시작했지만 내용도 정리해볼 겸 기록해봅니다. 이번 블로그는 프로젝트 생성과 github에 올리는거 까지 진행해보고자 합니다. 개발환경 OS Window 11 IDE (개발 툴) Visual Stuido Code Visual stuido Code Extentions gi : git ignore file 쉽게 생성 C# Dev kit 팔레트로 통한 프로젝트 생성 지원 디버그 등 나머진...(사용하다보면 느낄 것 같습니다.) IntelliCode for C# Dev Kit Tab을 통한 자동완성 프로젝트 생성 우선 [Ctrl] + [Shift] + [P] 키를 통해 파레트를 연 후 .net New Project 로 타이핑한 후 Enter를 칩니다. 프로젝트들을 선택할 수 있는 목록이 생성되는데, 저는 단순하게 API 데이터만 호출을 주고 받으려는 목적이기 때문에 ASP.NET Core Web API 로 선택합니다. 참고 개발하고자
기존 StackPanel에 컨트롤간의 간격을 넣고 싶은 욕망에서 시작된 JamesPanel입니다. 웹의 CSS에 justify-content라는 설정에서 space-around, space-between, space-evenly 들을 구현은 하고 싶었지만 계획만 잡아두고 꽤 시간을 흘려보냈던 것 같네요. 사용하고 한다면 Nuget을 통해 Jamesnet.Wpf를 다운로드 진행하시면 됩니다. (참고로 .net Core7.0 이상)에서만 사용 가능합니다.) 만일 .net Framework인 경우 사용하지 못하지만 코드를 참고해서 커스텀해보고자 한다면 아래 git 저장소에 가서 JamesPanel.cs를 통해 참고하여 새롭게 진행해보시면 좋을 것 같습니다. GitHub - jamesnet214/jamesnetwpf Contribute to jamesnet214/jamesnetwpf development by creating an account on GitHub. github.com 만약
안녕하세요 이번 7월 27일에 있었던 블레이저 & WPF 밋업에서 발표해주신 김진석 대표님의 내용을 토대로 저번 시간(https://blog.naver.com/lukewire129/223165389853) 에 이어서 컨테이너에 실행할 수 있도록 진행해보도록 하겠습니다. [.NET] WPF개발자가 만들어보는 API 서버 개발 - 1 안녕하세요 개인적으로 준비하고 있는 서비스가 있어서 만들기 시작했지만 내용도 정리해볼 겸 기록해봅니... blog.naver.com 컨테이너 만들기 Open Folder in Container를 클릭하게 되면 폴더를 지정하라고 하는데 저는 저번 시간에 만들어놨던 프로젝트의 폴더를 지정해보도록 하겠습니다. 선택하게 되면 Dev Container의 옵션들을 설정할 수 있는 파레트들이 순서대로 활성화되는데 아래에 맞게 설정하여주면됩니다. (8.0으로 경우 정식 출시가 되지 않아서 현재 7.0이 최신입니다.) 7월 Blazor & WPF 김진석 대표님 발표 자료에
안녕하세요. 이번 시간엔 Github OAuth App에 등록 후 Client ID를 통해 인증을 해보도록 하겠습니다. 우선 Github OAuth App을 등록하기 위해서 다음 링크로 이동합니다. 1. Github OAuth App 등록하기 https://github.com/settings/applications/new Build software better, together GitHub is where people build software. More than 100 million people use GitHub to discover, fork, and contribute to over 330 million projects. github.com 접속화면 다음 화면 처럼 나옵니다. 차례대로 입력해보도록 하겠습니다. Application name : App의 이름을 넣으시면 됩니다. (테스트해보신다고 *Github* 단어 넣으시면안됩니다.) Hompage URL : 홈페이지의 URL
안녕하세요 저번 블로그에 이어 Statefull Compenents에 대해서 좀 더 깊이 정리해보도록 하겠습니다. 이번 블로그 내용은 React의 State와 해당 State를 업데이트하기 위한 SetState를 차용해서 만들었다고 생각하면 이해하기 쉬울 것 같습니다. https://onlyfor-me-blog.tistory.com/463 [React] State란? 리액트 공부 중 State와 Prop이라는 걸 알게 됐는데 중요한 키워드 같아서 state 먼저 확인한 다음 포스팅한다. 먼저 공식문서에선 뭐라고 설명하는지 확인해봤다. https://ko.reactjs.org/docs/faq-state.html 컴포넌트 State – React A JavaScript library for building user interfaces ko.reactjs.org prop(properties의 줄임말)와 state는 일반 자바스크립트 객체다. 두 객체 모두 렌더링 결과물에 영향을 주는 정보
안녕하세요 컴포넌트의 생명주기에 대해 정리해볼 시간입니다. OnMounted() VisualNode영역에 Components가 생성되어 추가되었을 경우에 발생합니다. WillUnmount() VisualNode영역에 Components가 제거 될때 발생합니다. PropsChanged() 상태값이 변경되었을 때 발생합니다. class IncrementalCounter : Component { int _currentValue; private Action<int> _valueChanged; public IncrementalCounter CurrentValue(int currentValue) { _currentValue = currentValue; return this; } public IncrementalCounter ValueChanged(Action<int> valueChanged) { _valueChanged = valueChanged; return this; } protected
안녕하세요 이광석입니다. 마우이 리액토르의 컴포넌트 클래스 내부의 Render 함수부분에 new라는 키워드로 인해 다음과 같은 생각을 했던 것 같습니다. 모델 값이 변할 때마다 화면 전체를 다시 그리는것인가? class CounterPageState { public int Counter { get; set; } } class CounterPage : Component<CounterPageState> { public override VisualNode Render() { return new ContentPage("Counter Sample") { new VStack(spacing: 10) { new Label($"Counter: {State.Counter}") .VCenter() .HCenter(), new Button("Click To Increment", () => SetState(s => s.Counter++)) } .VCenter() .HCenter() }; } } 마우이 리액
6월 12일 구글플레이콘솔로부터..메일 한 통이 날라왔습니다. 앱이 삭제 되었다는 소식이였습니다. 삭제 이유는 목표 연령대에 13세미만을 포함되지 않았지만, 앱 로고 자체가 13세 미만의 어린이들에게 어필할 수 있다고 판단되었다고 합니다. 타켓층을 13~15세로 설정해논 이유가 문제였던 것 같습니다.. https://support.google.com/googleplay/android-developer/answer/9867159?hl=ko 타겟층 및 앱 콘텐츠 설정 관리하기 - Play Console 고객센터 타겟층 및 앱 콘텐츠 설정 관리하기 무료 교육 앱 개발자 아카데미 에서 가족 정책 프로세스에 관해 알아보고 대화형 체크리스트를 검토해 보세요. 사용자에게 더 나은 서비스를 제공하기 위해 앱에 관한 정보를 정확히 제공하는 것이 중요합니다. 콘텐츠 등급 설문지 를 작성하는 것 외에도 앱의 타겟층 및 콘텐츠에 관한 세부정보도 제공해야 합니다. 선택한 타겟층에 따라 다음과 같은 Goog
시작 - 해당 프로그램은 향후에 프로그램을 공유 드릴 예정입니다. - 있었으면 하는 기능 비밀댓글이든 댓글로 남겨주시면 그 기능 또한검토해보고 넣어보도록 하겠습니다
MauiReactor는 Maui컨트롤 기반으로 Reactive Native, Flutter, SwiftUI들을 프레임워크에서 기술들을 일부 차용하였기 때문에 위 프레임워크를 한 두번 쯤 경험이 있더라면, 쉽게 이해가 될 것입니다. (실제 이 블로그 글을 작성하면서 위 프레임워크들의 샘플 프로젝트들을 보았는데 유사해보이는것이 존재하긴 하였습니다.) MauiReactor의 State-less Components, Statefull Components는 실제 Flutter 프레임워크의 StatelessWidget(SLW)와 StateFullWidget를 차용하여 만들어진 컴포넌트라고 생각하시면 됩니다. (Flutter의 SLW과 SFW의 대한 차이점 설명 https://security-nanglam.tistory.com/478 참고하세요) [Flutter] StatelessWidget & StatefulWidget 차이점 정리 Flutter의 Widget은 StatelessWidget(S
안녕하세요.WPF 개발자입니다. ConfuserEx를 통해서 WPF 프로그램의 난독화 시리즈를 다음과 같이 시리즈로 작성해볼까 합니다. PART1 Confuser난독화 툴 & 난독화 처리 해보기 PART2 .net Core3.1, .net5 .net6 PART3 빌드전략 난독화 툴 다운로드 받기 https://github.com/mkaring/ConfuserEx GitHub - mkaring/ConfuserEx: An open-source, free protector for .NET applications An open-source, free protector for .NET applications - GitHub - mkaring/ConfuserEx: An open-source, free protector for .NET applications github.com 우선 위 경로의 ConfuserEx를 Clone 해옵니다. Confuser 프로젝트 간단 설명 Confuser.CLI,
안녕하세요. WPF 개발자입니다. 저번 난독화 PAR1을 이어서 .net core(.net5, .net6, .net7 이상)를 해보도록 하겠습니다. 저번 시간에 만든 난독화설정 파일로 하시고 .net core용 프로그램을 난독화 하시게된다면 이런 에러가 발생할 겁니다.(많이 당황스러울겁니다..) 이러한 경우 별도로 커스텀 처리를 해주시면 되는데요. .csproj파일 열어줍니다.(툴에서도 수정이 가능하긴한데..속도면에서 오래걸려서..) (추가 여기에서의 .csproj는 프로젝트의 .csproj가 아닙니다! [WPF] 응용 프레임워크 난독화 시리즈 - PART1에서 생성한 csproj입니다!) 'probePath' 태그값들을 넣어주시면 되는데요. 아래들을 전체 복사 붙여넣어주기 전 꼭보세요!!!!! 저의 현 PC의 경우 닷넷코어 관련 dll들이 해당 경로로 되어있는데 아마 설치해놓으신 버전들이 미세하게나마 달라서 일일이 경로를 가셔서 수정해주셔야합니다.! 수정이 다 되셨다면 저장하신다음
이번 포스팅의 주제는 MVU 기반의 MauiReactor 를 시작해보려고 합니다. Reactor Maui를 시작해보려는 이유 첫번째, 비즈니스 기능에 초점을 맞춰 쉽고 빠르게 접근하기 위위함입니다.ReactorMaui의 장점은 런타임 중 UI와 비즈니스로직을 쉽게 수정이 가능하다는 점입니다. MVVM 프로젝트는 View와 ViewModel 같이 만들어서 구성되어야 하다 보니 Runtime 중 xaml에서는 컨트롤 추가, 변경에 용이하지만 ViewModel에 경우 다릅니다. 함수를 추가한다던지 함수 내 핫리로드(된다고는 하는데 가끔안되는 경우가 종종 있는 것 같습니다.) 등 수정을 런타임 중 수정 후 바로 적용이 불가능하기 때문에 런타임을 종료하고 수정하고 빌드하고 하는 반복작업이 번번이 있기 때문입니다. 두 번째,다양한 크로스 플랫폼의 쉽게 접근하기 위함입니다.이미 다른 크로스 플랫폼(Reactive Native, Flutter)의 경우 MVU 패턴으로 기반으로 되어있기 때문에 다양
안녕하세요 이광석입니다. 평소 관심으로만 가지던 MAUI 프레임워크를 'MAUI를 프레임워크 기반의 나만의 앱을 만들어보자'로 목표를 잡은 지 2달이 된 지금 드디어 앱 첫 출시가 되었습니다. 하나의 프로젝트를 기획, 디자인, 개발을 직접 하나부터 열까지 하면서 시행착오도 있었지만, 그 시행착오를 이겨내고 앱을 출시했습니다. 닷넷데브 : https://forum.dotnetdev.kr/t/goal-maui/7109 GOAL - MAUI 안드로이드 앱 안녕하세요. 앱 심사를 통과를 마치고 출시되었습니다! Maui App Comming Soon! 에 말씀 드렸다시피 간단한 기획의도와 과정을 소개도 같이 해드리려 합니다. 기획 당시에 세웠던 목표 Maui 특유의 보라 색감을 제거하기 SQLite-net 알고 계신가요? 을 활용해보기 최소한 기능으로 복잡하게 만들지 않기 이 세가지의 목표를 가지고 앱을 만들기 시작하였습니다. 과정 UX 화면 구조 및 디자인 피그마를 통해서 앱의 뼈
안녕하세요 이광석입니다. 얼마 전 출시한 앱 https://play.google.com/store/apps/details?id=com.lukewire.goal GOAL - Apps on Google Play A basic goal app made with all the strength! play.google.com 에 예상치 못하게 많은 분들이 많은 관심과 함께 많은 피드백을 주셨습니다. 왠지 모르게 기분 좋았습니다. (저에게도 관심종자의 피가 흐르고 있는가 봅니다 ) 많은 피드백과 개선사항 그리고 앞으로의 계획에 대한 내용을 Github의 README로 관리해보면 어떨까 하는 생각이 들었습니다. 피드백과 버그사항에 대해서 쪽지 남겨주시거나 개발자이신분들은 PR 한번 올려주시면 언제든지 수용하도록 하겠습니다! 그럼이만! 좋은주말보내세요~ https://github.com/lukewire129/GOAL_REPORT.git GitHub - lukewire129/GOAL_REPORT Co
안녕하세요 이번 블로그에 앞서..의문점이 하나 생겼었습니다.. 과연 ReactorMaui가 맞을까 MauiReactor가 맞을까..결론이 나지 않아서 원작자는 MauiReactor라는 명칭으로 사용하고 있기에 저도 이제부터는 MauiReactor로 보기로 하였습니다. 저번 https://blog.naver.com/lukewire129/223098024042 를 통해 MauiReactor로 관련된 블로깅을 시작하였습니다. .NET MAUI : MauiReactor - 시작하기 이번 포스팅의 주제는 MVU 기반의 Maui인 Reactor Maui를 시작해보려고 합니다. Reactor Maui를 시... blog.naver.com 오늘부터는 원작자가 작성한 문서와 이론공부와 함께 접목시켜 한국말로 풀어 써보려고 합니다. 마우이 리액토르란 무엇일까? MAUI 프레임워크라는 하나의 틀 안에서 React Native, Flutter, Swift와 비슷한 개발 할 수 있게 도와주는 라이브러리 입