클라이언트 및 서버 렌더링 개념 클라이언트 측 렌더링 (CSR) 클라이언트의 Blazor WebAssembly 런타임에 의해 최종 HTML 태그가 생성된다는 의미 CSR은 대화형으로 간주되므로 정적 클라이언트 측 렌더링 과 같은 개념은 없다. 그러므로 rendermode InteractiveWebAssembly 만 존재한다. 명시하지 않으면 SSR 이면서 static 이 된다. (즉 onClick 등이 반응하지 않는다.) @page "/render-mode-3" @rendermode InteractiveWebAssembly @* button 클릭시 c# code 인 UpdateMessage 를 호출함 (클라이언트측 호출) *@ Click me @message @code { private string me..

dotnet 8 에 주요 골자는 blazor 였다고 생각된다. aspnet 진영에 많은 부분은 결국 blazor 가 주가 되었다. 여기서는 dotnet 8 에서 blazor 의 최신 추가내용을 직접 작성해 보며 알아보겠다. Visual Studio 2022 를 설치했다고 가정하겠다. (17.8 이상버전) Blazor web app 을 선택 해서 들어간 후 아래와 같이 설정하자 그리고 create 를 한 후 solution 의 구성을 확인해 보자 두개의 project 가 생성되는데 위쪽은 SSR 을 위한 server 쪽 이라고 생각하면 쉽고 아래 쪽은 CSR 을 위한 webassembly 영역이라고 생각하면 쉽게 이해할 수 있을 것이다. blazor 의 새기능은 auto rendering 으로 요약할 수 ..

dotnet 8 이 출시 되었다. https://learn.microsoft.com/ko-kr/dotnet/core/whats-new/dotnet-8 .NET 8의 새로운 기능 .NET 8에 도입된 새로운 .NET 기능에 대해 알아봅니다. learn.microsoft.com 이번시간에는 기존 dotnet 7 으로 구성된 app 을 dotnet 8 으로 업그레이드 해보고 문제점과 해결책을 알아보겠다. upgrade 를 위해서 우리는 이전에 사용했던 rest api template 을 이용하겠다. https://yogingang.tistory.com/416 Rest API Template 만들기 - EP 10 (Refactoring - Features) 이제 UnitTest 를 만들었으니 기존 코드들에서 재..

https://yogingang.tistory.com/455 Gitlab CI CD - Docker 에서 host 의 aws 설정 사용하기 IAM 계정 만들기 aws cli 설치 및 설정 # 설치파일 다운로드 curl "https://awscli.amazonaws.com/awscli-exe-linux-x86_64.zip" -o "awscliv2.zip" # unzip 파일 unzip awscliv2.zip # install sudo ./aws/install aws configure 설정 aws configure s yogingang.tistory.com 이전 강좌에서 aws 를 docker image 에 설치하지 않고 host 에 설치한 aws 설정을 공유하는 방법에 대해 알아봤다. 이걸 하면서 실제 a..

프로그램을 작성하다 보면 json 문자열을 다루는 경우가 정말 많다. 요즘 대부분의 Http api 같은 경우는 json 을 이용하고 micro service 같은 경우는 input, output 의 표준이 되었다고 해도 과언이 아니다. 이러다보니 특정 json 문자열을 programming language 에 맞추어 해당 language 의 type 으로 만들어 주는 tool 들이 많이있다. 특히 인터넷에 online 으로 변경해주는 경우가 있으니 입맛에 맞추어 사용하면 된다. 하지만 어떤 경우는 runtime 중에 변환해야 하는 경우가 있다. 이런경우는 library 를 만들어서 json string 을 특정 class 로 변형해야 한다. 오늘은 json string 을 입력 받아 CSharp Cla..

vite 를 이용해서 vue3 의 기본 template 을 만들고 해당 project 를 실행할 수 있다. 일단 node 의 최신 버전이 깔려 있다고 가정하고 다음을 진행 하겠다. npm init vue@latest 그러면 아래와 같은 prompt 가 나올 것이고 각각에 대해 다음과 같이 간단히 설정하자 이제 실행 하라는 데로 실행해보자 위에 녹색 명령들을 차례대로 실행 하고 나면 다음과 같이 된다. 이제 chrome 같은 browser 에서 확인해보자 아래와 같이 실행된다. 뭐 특별할것 없는 vue3 spa 기본 페이지 이다. 자 이걸 보여주려는 것은 아니고...!!! 이 npm run dev 라는 명령은 vite 의 dev server 를 실행시키고 spa 앱은 해당 dev server 를 통해서 r..