ASP.NET Core MVC 시작

작성자: Rick Anderson

이 자습서에서는 컨트롤러와 보기를 사용하여 ASP.NET Core MVC 웹 배포에 대해 설명합니다. ASP.NET Core 웹 개발이 처음인 경우 이 자습서의 Razor Pages 버전을 통해 좀 더 쉽게 시작할 수 있습니다. ASP.NET Core UI 선택을 참조하세요, 이는 Razor Pages, MVC 및 Blazor의 UI 개발을 비교합니다.

이 자습서는 컨트롤러와 뷰를 사용한 ASP.NET Core MVC 웹 개발을 설명하는 시리즈의 첫 번째 자습서입니다.

시리즈의 끝에 영화 데이터를 관리, 유효성 검사 및 표시하는 앱이 있습니다. 다음을 배우게 됩니다:

• 웹앱 만들기
• 모델 추가 및 준비 설정
• 데이터베이스 작업
• 검색 및 유효성 검사 추가

예제 코드 보기 또는 다운로드 (다운로드 방법).

필수 조건

Visual Studio

• ASP.NET 및 웹 개발 워크로드가 있는 Visual Studio 2022

  

Visual Studio Code

• Visual Studio Code
• Visual Studio Code용 C# 개발 키트
• .NET 9.0 SDK

macOS, Linux 또는 Windows에서 Visual Studio Code 지침을 따를 수 있습니다. Visual Studio Code 이외의 IDE(통합 개발 환경)를 사용하는 경우 변경이 필요할 수 있습니다.

웹앱 만들기

Visual Studio

• Visual Studio를 시작하고 새 프로젝트 만들기를 선택합니다.
• 새 프로젝트 만들기 대화 상자에서 ASP.NET Core 웹앱(Model-View-Controller)>다음을 선택합니다.
• 새 프로젝트 구성 대화 상자에서 다음을 수행합니다.
  • MvcMovie에 를 입력합니다. 프로젝트 이름을 MvcMovie로 지정해야 합니다. 코드를 복사할 때 대문자 표시가 각 namespace와 일치해야 합니다.
  • 프로젝트의 위치는 어디서나 설정할 수 있습니다.
• 다음을 선택합니다.
• 추가 정보 대화 상자에서:
  • .NET 9.0(표준 용어 지원) 선택합니다.
  • 최상위 문을 사용하지 않음이 선택 취소되어 있는지 확인합니다.
• 만들기를 선택합니다.

프로젝트를 만드는 다른 방법을 비롯한 자세한 내용은 Visual Studio에서 새 프로젝트 만들기를 참조하세요.

Visual Studio에서는 생성된 MVC 프로젝트에 기본 프로젝트 템플릿을 사용합니다. 생성된 프로젝트는 다음과 같습니다.

• 작동하는 앱입니다.
• 기본 시작 프로젝트입니다.

Visual Studio Code

이 자습서에서는 VS Code를 잘 알고 있다고 가정합니다. 자세한 내용은 VS Code 시작 및 Visual Studio Code 도움말을 참조하세요.

• 터미널 메뉴에서 새 터미널을 선택하여 통합 터미널을 엽니다.

• 프로젝트가 포함될 디렉터리(cd)로 변경합니다. 프로젝트는 어디에나 배치할 수 있습니다.

• 다음 명령을 실행합니다.

  dotnet new mvc -o MvcMovie
  code -r MvcMovie
  

  이 dotnet new 명령은 MvcMovie 폴더에 새 ASP.NET Core MVC 프로젝트를 만듭니다.

  이 code 명령은 Visual Studio Code의 현재 인스턴스에서 MvcMovie 프로젝트 폴더를 엽니다.

Visual Studio Code에서 다음을 묻는 대화 상자를 표시할 수 있습니다. 이 폴더에 있는 파일의 작성자를 신뢰합니까?

• 부모 폴더의 모든 파일을 신뢰하는 경우 부모 폴더에 있는 모든 파일의 작성자를 신뢰를 선택합니다.
• 예, 프로젝트 폴더에 .NET에서 생성된 파일이 있으므로 작성 자를 신뢰합니다.
• Visual Studio Code에서 프로젝트를 빌드하고 디버그하기 위해 자산을 추가하라는 요청이 나타나면 예를 선택합니다. Visual Studio Code에서 빌드 및 디버그 자산을 추가하도록 제공하지 않는 경우 명령 팔레트 보기를>선택하고 검색 상자에 ".NET"를 입력합니다. 명령 목록에서 명령을 선택합니다 .NET: Generate Assets for Build and Debug .

Visual Studio Code는 .vscode 및 launch.json 파일이 생성된 폴더를 tasks.json 추가합니다.

앱 실행

Visual Studio

• Ctrl+ 키를 눌러 디버거 없이 앱을 실행합니다.

  프로젝트가 SSL을 사용하도록 아직 구성되지 않은 경우 Visual Studio에 다음 대화 상자가 표시됩니다.

  

  IIS Express SSL 인증서를 신뢰하는 경우 예를 선택합니다.

  다음 대화 상자가 표시됩니다.

  

  개발 인증서를 신뢰하는 데 동의하는 경우 예를 선택합니다.

  Firefox 브라우저를 신뢰하는 방법에 대한 자세한 내용은 Firefox SEC_ERROR_INADEQUATE_KEY_USAGE 인증서 오류를 참조하세요.

Visual Studio에서는 앱을 실행하고 기본 브라우저를 엽니다.

주소 표시줄에 localhost:<port#>이 표시되고 example.com 등은 표시되지 않습니다. 로컬 컴퓨터의 표준 호스트 이름은 localhost입니다. Visual Studio가 웹 프로젝트를 만들면 임의의 포트가 웹 서버에 사용됩니다.

Ctrl+ 키를 눌러 디버깅하지 않고 앱을 시작하면 다음을 수행할 수 있습니다.

• 코드를 변경합니다.
• 파일을 저장합니다.
• 브라우저를 빠르게 새로 고치고 코드 변경 내용을 확인합니다.

디버그 메뉴에서 앱을 디버그 또는 비 디버그 모드로 시작할 수 있습니다.

도구 모음에서 https 단추를 선택하면 앱을 디버그할 수 있습니다.

다음 이미지는 앱을 보여줍니다.

• 브라우저 창을 닫습니다. Visual Studio에서 애플리케이션을 중지합니다.

Visual Studio Code

• 다음 명령을 실행하여 HTTPS 개발 인증서를 신뢰합니다.

  dotnet dev-certs https --trust
  

  위의 명령은 이전에 인증서를 신뢰할 수 없었던 경우 다음 대화 상자를 표시합니다.

  

• 개발 인증서를 신뢰하는 데 동의하는 경우 예를 선택합니다.

  자세한 내용은 SSL 적용 문서의 ASP.NET Core HTTPS 개발 인증서 신뢰 섹션을 참조하세요.

Firefox 브라우저를 신뢰하는 방법에 대한 자세한 내용은 Firefox SEC_ERROR_INADEQUATE_KEY_USAGE 인증서 오류를 참조하세요.

• Visual Studio Code에서 Ctrl+(Windows)/^+(macOS)를 눌러 디버깅하지 않고 앱을 실행합니다.

  Visual Studio Code:

  • Kestrel 시작
  • 브라우저를 시작합니다.
  • https://localhost:<port#>로 이동합니다.

  주소 표시줄에 localhost:<port#>이 표시되고 example.com 등은 표시되지 않습니다. 로컬 컴퓨터의 표준 호스트 이름은 localhost입니다. Localhost는 로컬 컴퓨터의 웹 요청만 지원합니다.

Ctrl+F5를 선택하여 디버깅 없이 앱을 시작하면 다음을 수행할 수 있습니다.

• 코드를 변경합니다.

• 파일을 저장합니다.

• 브라우저를 빠르게 새로 고치고 코드 변경 내용을 확인합니다.

  

• 브라우저 창을 닫습니다.

• Visual Studio Code의 실행 메뉴에서 디버깅 중지를 선택하거나 Shift+ 키를 눌러 앱을 중지합니다.

Visual Studio

Visual Studio 도움말

• Visual Studio를 사용하여 C# 코드를 디버그하는 방법 알아보기
• Visual Studio IDE 소개

Visual Studio Code

Visual Studio Code 도움말

• 시작

• 디버깅

• 통합 터미널

• 키보드 바로 가기

  • macOS 바로 가기 키
  • Linux 바로 가기 키
  • Windows 키보드 단축키

이 시리즈의 다음 자습서에서는 MVC에 대해 알아보고 코드 작성을 시작합니다.

다음: 컨트롤러 추가