AngularJS와 ASP.NET MVC를 모두 사용해야합니까?


58

AngularJS와 ASP.NET MVC를 배우기 시작했지만 왜 같은 프로젝트에서 두 가지를 함께 사용해야하는지 잘 모르겠습니까?

둘 다 MVC 프레임 워크가 아닙니까? 같은 응용 프로그램에서 둘 다 사용해야합니까? 둘 중 하나입니까?

답변:


74

단일 페이지 애플리케이션 (SPA)을 빌드하는 경우 ASP.NET MVC 에서 "MVC"가 필요하지 않을 수 있습니다 . 뷰, 특히 동적 뷰는 클라이언트 측에서 전달 / 조작 될 수 있습니다. 각도 핸들은 괜찮습니다.

그러나 100 % SPA를 원하지 않을 수도 있습니다. 그리고 뭐? 있습니다 대신 10 페이지,하지만 10 페이지 상상 매우를동적. 사용자가 로그온 한 후 오른쪽 모서리에 약간의 사용자 배지가 있습니다. 역동적이지 않습니다. 그것은 단지 사용자의 "점수"와 그들의 최신 셀카와 같은 멋진 것들을 보여줍니다. 멋진 항목을 캐시하여 쉽게 검색 할 수 있습니다. 이제 두 가지 방법으로 갈 수 있습니다. 클라이언트 측 MVC 순수 주의자라면 다른 모든 데이터와 마찬가지로 초기 HTML 페이로드가 전달 된 후 배지 데이터를 가져옵니다. 그러나 당신은 순수 주의자가 아닐 수도 있습니다. 아마도 당신은 순수 주의자의 반대일지도 모릅니다. 아마도 당신은 불순종 자일 것입니다. 따라서 초기 HTML을 제공하는 대신 서버에 다시 게시하고 JavaScript를 통해 게시하여 배지 데이터를 가져온 다음 클라이언트 측 MVC를 통해 해당 데이터를보기에 병합하는 일부 JavaScript를 제공하는 대신, 초기 HTML로. 초기 HTML이 전달 된 후 일반적인 클라이언트 측 MVC antic을 진행합니다.

서버와 클라이언트의 MVC는 2001 년에 엉망이었던 코드를 구성하는 편리한 방법 일뿐입니다. 둘 중 하나를 선택할 필요는 없습니다. 둘 다 선택할 수 있습니다. 물론, 최초 HTML을 제공 한 후에 더 많이할수록 서버 측 MVC가 덜 필요합니다. 그래도 필요한 경우 거기에 있습니다. 예를 들어 외부 Angular 템플릿이 실제로 .NET MVC ActionResult 인 ASP.NET MVC / Angular 응용 프로그램에서 작업했습니다. 즉, 서버 컨트롤러는 데이터를보기에 병합하고 템플릿으로 Angular에 전달한 다음 Angular의 컨트롤러는 데이터를보기에 병합 할 수 있습니다. 나는 이것이 좋은 생각이라고 말하지는 않지만 한 형태의 MVC가 다른 형태를 쓸모 없게 만든다는 것을 보여줍니다.

또한 Angular를 배포하는 방법에 관계없이 초기 HTML, 템플릿 및 가장 중요한 데이터를 제공하는 방법이 필요합니다. 왜 쉬운 플랫폼을 사용하지 않습니까? 많은 것이 있지만 .NET MVC는 멍청하지 않습니다. 앞서 말했듯이 초기 HTML 및 외부 Angular 템플릿을 MVC 작업의 결과로 만들 수 있지만 .NET의 웹 API 를 사용 하여 데이터를 제공 할 수 있습니다 . 웹 API는 살구 설탕에 절인 과일만큼이나 맛있습니다.

요약 : MVC는 패턴 일뿐입니다. 여러 물리 계층에서 해당 패턴을 사용할 수 있습니다. 사용할 수 없습니다. 말이되면 자유롭게 사용하십시오. 게다가 Angular는 어쨌든 MVC가 아닐 수도 있으므로 (이러한 것들을 좋아하는 사람들에게도) 이름에 "MVC"가있는 도구로 자유롭게 사용하십시오. MVC 인 경우에도 원하는대로 혼합하고 일치시킵니다.


3
놀라운 반응. 설명해 주셔서 감사합니다 +1
Natalie

예를 들어 데이터를 제공하는 웹 API가 있고이 데이터를 그리드로 표시하려면 Angular 또는 MVC를 사용하여 루핑 및 템플릿을 수행합니까? 어떤 방법으로 웹 API 서비스를 호출합니까? 프로젝트의 시작부터 어떤 방향으로 갈지 어떻게 결정합니까?
Natalie

1
@Natalie 데이터가 웹 API에서 가져온 경우 클라이언트 측에서 가져 오는 것 같습니다. 이것은 .NET MVC가 아닌 Angular에서 바인딩하고 있음을 의미합니다. 명시 적으로 반복하지 않습니다. ngRepeat를 사용하여 데이터를 그리드 / 테이블에 바인딩합니다 . 데이터를 가져 오려면 $ http 모듈을 사용하고 Web API 엔드 포인트를 호출하십시오. 사용할 접근 방식을 결정하는 것은 기발한 일입니다. 흑백 답변이 없습니다. 본능을 실험하고 평가하고 따라야합니다.
스캔 로저

... 한마디 한마디. 이전에 Angular 또는 기타 전체 서비스 JavaScript 프레임 워크를 사용하지 않은 경우 로프 학습에 많은 시간을 소비해야합니다. 반드시 간단하지는 않습니다. 그래도 장기적으로 인생을 편하게 해줄 수 있습니다. 열심히 일하다. 그것에 충실하십시오. 당신은 잘 할 것입니다.
Scant Roger

1
@ScantRoger 죄송하지만 귀하의 답변으로 문제가 해결되지 않았습니다. View가 무시할 수없는 MVC 서버 측 프레임 워크를 사용하는 경우 Angular와 어떻게 연결합니까? 서버 (웹 API)에는 이미 모델 및 컨트롤러 정의가 포함되어 있습니다. 따라서 Angular를 사용하면 MVC를 다시 부과합니다. 결국 MCVCM이 되나요? (클라이언트 측과 서버 측 모두에서 모델 및 컨트롤러 정의) 또는 이미 웹 API에 MVC 프레임 워크를 사용중인 경우 Angular와 같은 클라이언트 측 MVC 프레임 워크를 사용하지 않아야하는 이유
Abdul

17

ASP.NET MVC는 서버 측 프레임 워크입니다. 어떤 JavaScript 라이브러리를 사용하든 상관 없습니다. AngularJS는 클라이언트 측 라이브러리로, 서버 측 기술이 웹 사이트를 구동하는 데 중요하지 않습니다. Python, ASP.NET MVC 또는 디스크에 직접 저장된 일반 정적 정적 HTML 파일 일 수도 있습니다.

ASP.NET MVC와 AngularJS는 모두 호환 가능하며 함께 사용하는 프로젝트가 많이 있습니다.

당신이 할 필요 모두를 사용할 수 있나요? 실제로는 아닙니다. 그것은 전적으로 프로젝트의 요구에 달려 있습니다.

  • 웹 사이트가 동적 인 경우 서버 측 스크립팅을 사용해야합니다. ASP.NET을 사용할 수 있으며 AngularJS를 사용한다고해서 서버 측 코드를 더 MVC로 만들 수는 없습니다. 서버 측 응용 프로그램을 MVC로 구성하려면 ASP.NET MVC를 선택하십시오.

  • 마찬가지로 ASP.NET MVC를 사용한다는 사실은 클라이언트 쪽 코드의 구조와 관련이 없습니다. 구조에 대한 생각없이 모든 JavaScript를 단일 파일에 넣을 수 있으며 프로젝트가 커질 때까지 만족할 수 있습니다. 여기서 다시 AngularJS는 클라이언트 측에서 애플리케이션을 구성하는 방법으로 제시됩니다.


참고 사항 : 질문에 ASP.NET MVC 3을 태그했습니다.이 프로젝트는 유지 관리해야하는 레거시 프로젝트가 아니면 지난 4 년 동안 업데이트되지 않은 레거시 서버에서 응용 프로그램을 호스팅 할 때 특정 제약 조건이없는 경우 ASP를 사용할 수 있습니다 대신 .NET MVC 4 또는 5.


1
감사합니다 MainMa. AngularJS는 클라이언트 측이고 MVC는 서버 측이라는 것을 알고 있습니다. 또한 핸들 바, knockoutjs와 같은 다른 라이브러리는 MVC.NET에서 사용할 수 있으며 Angular는 PHP, Java 응용 프로그램에서 사용할 수 있음을 알고 있습니다. 두 사람 모두 "MVC"와 동일한 작업을 수행하지만 하나는 클라이언트 쪽이고 다른 하나는 서버 쪽이기 때문에 두 가지를 함께 사용해야하는 이유는 무엇입니까? 클라이언트 측과 서버 측에서 MVC 프레임 워크를 혼합하는 이유는 무엇입니까? Angular 전용 응용 프로그램을 사용할 수 없습니까? 아니면 MVC.net 전용 응용 프로그램입니까?
Natalie

@Natalie : 알겠습니다. 이에 대한 자세한 정보를 제공하기 위해 답변을 편집했습니다. 짧은 대답은 서버와 클라이언트 모두에서 특정 구조를 갖는 것이 적합한 프로젝트에서이 두 프레임 워크를 혼합한다는 것입니다.
Arseni Mourzenko

예를 들어 데이터를 제공하는 웹 API가 있고이 데이터를 그리드로 표시하려면 Angular 또는 MVC를 사용하여 루핑 및 템플릿을 수행합니까? 어떤 방법으로 웹 API 서비스를 호출합니까? 프로젝트의 시작부터 어떤 방향으로 갈지 어떻게 결정합니까?
Natalie

내 마음에 같은 질문이 있습니다. asp.net MVC를 사용해야 할 이유를 찾지 못했습니다. 서버 측의 Asp.net 웹 API처럼 보이고 클라이언트 측의 Angular면 충분합니다. 그러나 나는 먼저 생각했다. 웹 API = 데이터 액세스 계층, Asp.Net MVC = 비즈니스 로직 계층, 각도 = UI 계층. 그러나 Angular 측에서는 웹 API 호출 만 할 수 있으므로 Asp.Net MVC 서버 측을 사용할 수 없습니다. Asp.Net MVC를 사용해야하는 이유가 좋은 예가 필요하다고 생각합니다.
Salim

9

Visual Studio를 사용하는 경우 각도 및 MVC Web Api 컨트롤러를 포함하는 새로운 '단일 페이지 앱'MVC 웹 사이트 템플릿이 있습니다.

이것은 MVC 서버 측 코드가 각도 클라이언트 측 코드가 호출 할 json 엔드 포인트를 제공하기 때문에 잘 작동합니다.

또한 MVC 컨트롤러를 사용하여 단일 페이지 앱의 기본 HTML보기를 제공 할 수 있습니다. 이것은 서버 측 생성, 권한 부여, 리디렉션, 오류 처리 등의 기능을 제공합니다.

종종 단일 페이지 앱에서도 적은 양의 서버 생성 html / javascript를 원할 것입니다. 다른 환경의 엔드 포인트 URL, 다른 언어 또는 서버 측에서 수행하기가 쉬운 홀수 인증 페이지 등이 있습니다.


1
VS 2015 CE에서 표준 SPA 템플릿을 만들 때 스크립트 폴더에 부트 스트랩, jquery, 녹아웃, 응답 및 새미가 표시되지만 각도는 표시되지 않습니다. 뭔가 빠졌습니까?
TK-421

2

3 년 후 ASP.NET 웹 API를 사용하여 데이터를 제공하고 Angular (js 이상)를 제공하여 클라이언트 측에서 앱을 구성합니다. 정적 사이트를 만드는 경우 ASP.NET MVC를 사용하십시오.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.