블라저 웹어셈블리 프로젝트 만들기 및 실행
환경
- 비주얼 스튜디오
-
- 비주얼 스튜디오 2019
- .NET
-
- .NET 5.0
비주얼 스튜디오 의 얻기 및 설치
비주얼 스튜디오를 사용하여 Blazor 프로젝트를 개발합니다. 아래에서 Visual Studio를 만들고 설정하는 방법을 알아보세요.
다른 단계는 지루할 수 있지만 시각적 스튜디오 코드도 개발할 수 있습니다. (여기서 는 설명하지 않습니다.)
블라저 웹어셈블리 프로젝트 만들기
시작 메뉴에서 비주얼 스튜디오 2019를 선택합니다. 버전은 2019년이지만 이후 버전에서도 프로젝트를 만들 수도 있습니다.
새 프로젝트 만들기를 선택합니다.
위의 검색 입력 필드에 "Blazor"를 입력하면 목록이 표시되므로 "Blazor WebAssembly 앱"을 선택하고 "다음" 버튼을 클릭합니다.
프로젝트 이름은 무엇이든 할 수 있지만 여기에서는 "BlazorWebAssemblySample"입니다. 어디에 있든 프로젝트를 만들 수 있습니다. 솔루션 이름이 자동으로 입력되므로 그대로 둘 수 있습니다.
대상 프레임워크는 "입니다. NET 코어 3.1 이상. 여기에 최신 "입니다. NET 5.0"이 선택됩니다. 나머지는 기본 설정에 남아 있습니다. 완료되면 "만들기" 버튼을 클릭합니다.
기본 시각적 스튜디오 창(IDE)이 표시되고 프로젝트 생성이 완료됩니다. 창의 레이아웃은 기본 설정에 따라 다를 수 있지만 개발에는 영향을 주지 않습니다.
지정된 폴더에는 프로젝트와 관련된 파일이 포함되어 있습니다. 이 프로젝트는 이 폴더(외부)의 계층 구조에 영향을 주지 않으므로 더 이상 필요하지 않으면 각 폴더를 삭제할 수 있으며 아무 것도 수행할 수 없습니다.
실행(디버그 실행)
프로젝트 생성 상태에서 약간의 샘플이 완료되므로 현재와 같이 실행할 수 있습니다. 도구 모음에서 IIS 익스프레스를 클릭하여 실행합니다. 간단한 웹 서버 "IIS 익스프레스"는 사용자 고유의 환경에서 만들어지며 Blazor 앱을 실행할 수 있습니다. 디버깅을 종료하면 이 IIS 익스프레스가 자동으로 종료됩니다.
그런데 블라저 웹어셈블리 디버깅 실행은 웹 서버를 사용하여 앱을 다운로드합니다.
빌드가 시작되고 일정 시간이 경과하면 빌드가 완료되고 웹 브라우저가 시작됩니다. 서버 리소스에 액세스하는 경우를 제외하고 클라이언트에서 수행하는 웹 화면이 표시됩니다. 웹 앱에 대한 클라이언트 측 처리는 일반적으로 자바스크립트로 작성되지만 Blazor는 WebAssembly의 메커니즘을 사용하여 C#에서 만들 수 있습니다.
클릭할 때마다 수를 늘리는 방법은 다음과 같습니다. 이러한 비화면 새로 고침 작업은 일반적으로 자바스크립트로 작성되지만 C#에서도 구현됩니다.
서버에서 JSON 파일을 다운로드하고 목록을 표시하는 화면입니다.
디버깅 실행 중지
웹 브라우저가 자체적으로 시작되면 웹 브라우저를 닫으면 디버깅 실행이 종료되지만 이미 시작된 웹 브라우저의 새 탭에서 열면 탭을 닫으면 디버그 실행이 종료되지 않습니다.
이 경우 Visual Studio 도구 모음에서 "디버깅 중지" 버튼을 클릭합니다.
개발 종료
기본적으로 다른 프로젝트와 마찬가지로 Visual Studio를 종료해야 합니다. 파일을 저장하지 않으면 저장 확인이 표시됩니다.
다시 개발할 때 "xxxxxxxx.sin" 파일을 열거나 Visual Studio를 시작할 때 기록을 열 수 있으므로 거기에서 열 수 있습니다.