AngularJS 클라이언트 MVC 패턴?

AngularJS 클라이언트 MVC 패턴?

지금까지 주로 사용하고 있었습니다.Struts 2,Spring,JQuery웹 애플리케이션을 구축하기 위한 테크놀로지 스택입니다.서 중요한 것은 이 측을 MVC(+ 측 검증되었습니다.웹 브라우저의 주요 역할은 요청/응답 주기(+ 클라이언트 측 검증)로 제한되었습니다.데이터 검색, 비즈니스 로직, 배선 및 검증은 주로 서버 측에서 담당했습니다.

Angular에 대해 몇 가지 질문이 있습니다.JS 프레임워크는 다음과 같은 인용문을 통해 영감을 받았습니다.

---

각도에서JS 튜토리얼:

Angular 앱의 경우 Model-View-Controller(MVC) 설계 패턴을 사용하여 코드를 분리하여 문제를 분리할 것을 권장합니다.

Wikipedia Model – View – Controller에서 다음을 수행합니다.

Model-View-Controller(MVC; 모델 뷰 컨트롤러)는 정보 표현과 정보와의 상호작용을 분리하는 아키텍처입니다.모델은 애플리케이션 데이터와 비즈니스 규칙으로 구성되며 컨트롤러가 입력을 매개하여 모델 또는 뷰용 명령으로 변환합니다.

---

Angular JS는 클라이언트 측을 사용합니다.MVC 로직을 할 수 있는 방법은 없는 입니까?그럼 클라이언트 측에도 검증 로직을 포함시킬 수 있는 방법은 없는 건가요?

견고한 각도를 쓰는 가장 좋은 방법은 무엇입니까?JS 어플리케이션?클라이언트측의 MVC와 서버측의 MC(모델, 컨트롤러)의 종류

즉, MODEL과 CONTROLER가 한 가지 방법으로 중복된다는 것입니까(클라이언트/서버).

제 질문이 다소 이상하다는 것을 알지만, 그 이유는 제가 전통적인 서버측 MVC 패턴에 익숙하기 때문이라고 생각합니다.나는 이미 같은 전환을 한 사람이 있다고 확신한다.

전혀 이상한 질문이 아닙니다.저는 많은 자바 개발자들에게 Angular를 판매하려고 노력했는데, 그들은 이렇게 묻습니다.배울 때 직접 물어봤어요(아직 배우고 있어요, btw)

만약 당신이 설명한 것처럼 기존의 자바 웹 앱을 Angular-Ize한다면, 당신은 먼저 당신의 서버를 RESTful API로 만들어야 한다.JSP 등을 분리합니다.이것은 사실 Angular 앱을 작성하기 위한 어려운 IMO입니다.REST API를 올바르게 만드는 것입니다.서버에 어떤 로직이 필요한지를 결정하는 열쇠는 그것을 순수한 API로 생각하고 프런트 엔드를 갖는다는 것을 잠시 잊는 것이었습니다.

이 질문은 저에게 큰 도움이 되었습니다.만약 누군가가 특정 자원을 저장하려고 하는데 그 자원에 유효한 데이터가 없다면, 그 자원에 대해 알려줄 프런트엔드가 없습니다.그들은 API에 직접 접속하고 있기 때문에 API는 이를 거부할 필요가 있습니다.백엔드는 철저한 검증을 담당합니다.이는 귀사의 비즈니스 논리에도 적용됩니다.누군가가 API만을 사용하고 있다고 가정하면 서버가 무엇을 해야 하는지 알 수 있습니다.

서버는 (아마도) json 형식의 데이터를 판매해야 하기 때문에(Spring MVC + Jackson을 사용), 모델을 Angular에 노출하고 데이터베이스와 통신합니다.

그럼 앵귤러 쪽 MVC는 뭐죠?

• 모델: REST API에서 가져온 데이터입니다.API가 JSON을 판매하고 있는 경우 이러한 오브젝트는 이미 1등급 javascript 오브젝트가 됩니다.
• 표시: HTML 및 DOM 조작이 필요한 경우의 지시
• 컨트롤러: (컨트롤러에서 제외된 커스텀 서비스도 포함))
  • REST API를 쿼리하여 View에 필요한 정보를 $scope에 배치합니다.
  • 서버에 대한 콜백이 필요할 수 있는 이벤트에 응답하기 위한 디렉티브의 콜백을 제공합니다.
  • 검증: 통상은, 디렉티브에의 콜백을 개입시켜 실시합니다.서버에 이미 있는 검증의 일부와 중복되는 경우가 있습니다만, 유저가 모든 것을 검증할 때까지 기다리는 것을 원하지 않습니다.클라이언트는, 검증에 관한 정보를 유저에게 곧바로 전달할 필요가 있습니다.
  • 비즈니스 논리: 검증과 거의 같은 이야기입니다.

그런데 왜 클라이언트와 서버에서 논리가 중복되는 걸까요?주로 한 개의 앱을 작성하지 않기 때문에 두 개의 독립적인 내용을 작성하게 됩니다.

1. 프런트 엔드 없이 견고하고 사용할 수 있어야 하는 REST API
2. 사용자에게 즉시 피드백을 주고 서버를 기다릴 필요가 없는 GUI.

즉, UI가 있다는 것을 잊어버리고 REST API를 바로 잡으면 Angular에 들어가는 내용이 훨씬 명확해집니다.

나는 "비즈니스 논리"라는 용어가 여기서 좀 잘못된 용어라고 생각한다.클라이언트 사이드 앱의 "비즈니스"는 사용자 인터페이스를 처리하는 비즈니스입니다.보안 규칙이나 소유권 논리, 기타 민감한 지적 재산과 같은 것이 아닙니다.

따라서 Angular에서 나눗셈은 (일반적으로) 다음과 같습니다.

• 컨트롤러(컨트롤러): UI의 배후에 있는 데이터(범위)를 조작합니다.
• Directives : 스코프를 통해 컨트롤러와 통신하도록 DOM을 설정하고 DOM을 조작합니다.
• 템플릿(보기):DOM 요소에 디렉티브를 할당합니다.
• 스코프(모델 또는 뷰 모델): 시스템의 모든 부분 간에 데이터를 반송하기 위한 것입니다.
• [Services] : 삽입 가능한 재사용 가능한 코드 비트.일반적으로 Ajax, 쿠키 또는 기타 I/O 처리와 같은 종속성에 사용됩니다.

MVC가 아니라 거의 MVVM입니다.

당신의 "비즈니스" 논리나 규칙은...보안이 필요한 경우 항상 서버 수준에서 보안을 유지해야 합니다.

MVC 패턴의 일부 버전에서는 데이터와 데이터를 조작하는 로직이 모두 "모델" 계층('컨트롤러' 계층은 바인딩만 수행)에 존재함을 이해하는 것이 중요합니다.그러나 AngularJS에서는 데이터($scope)만 "모델" 계층에 있고 데이터($scope)를 조작하는 논리는 "컨트롤러" 계층에 있습니다.

@Roy TrueLove의 말이 너무 좋아요.하지만 이것이 angularjs를 사용하는 궁극적인 방법이라고 말할게요.물론 angular의 이점을 최대한 활용하려면 이러한 방식으로 애플리케이션을 수행하는 방법을 배워야 합니다.언젠가 그곳에 있기를 기도합니다.

한편, 학습중, 그리고 클라이언트측의 주된 업무수단으로 angularj를 완전하게 사용하는 이행중에, 작은 미션에 angularj를 사용하기 시작해, 점차, 그 사고방식에 익숙해질 수 있습니다.

천천히 받아들이면서 천천히 가길 권하지만, 확실히 보증합니다.

Angularjs는 가장 큰 작업만큼 작은 작업에도 대응할 수 있기 때문에 이 접근법에 적합하도록 설계되었습니다.예를 들어 처음 angular를 사용한 것은 사용자가 ids를 입력할 때 이름을 표시하기 위해서입니다.

여기 답변에 동의합니다.댓글 좀 남겨주세요.응용 프로그램을 작성할 때는 먼저 문제 영역에 집중해야 합니다.실제 비즈니스의 소프트웨어 모델을 만듭니다.예를 들어, 문제 도메인이 쇼핑인 경우 모델링해야 하는 몇 가지 요구 사항은 다음과 같습니다.

• 신용카드는 유효합니다.
• X브랜드 신용카드로 결제하시면 10% 할인해 드립니다.
• 쇼핑 카트에는 체크아웃을 수행할 품목이 하나 이상 포함되어 있어야 합니다.
• 사용자가 쇼핑 카트에 아이템을 추가하려면 먼저 아이템에 재고가 있어야 합니다.

이러한 요건의 실장은, 고객의 문제 영역을 모델화합니다.이것은 고객의 비즈니스 논리입니다.

Angular는 프런트 엔드 프레임워크 및 툴킷입니다.웹 프런트 엔드입니다.이를 웹 프런트엔드로 구현하면 모바일이나 데스크톱 애플리케이션 등 다른 프런트엔드 또는 인터페이스에서 모델을 재사용할 수 있는 기능을 놓치게 됩니다.따라서 비즈니스 로직 구현은 사용자 인터페이스 프레임워크에서 분리되고 영구 프레임워크에서도 분리되는 것이 이상적입니다.그러면 사용자 인터페이스 문제를 처리하고 비즈니스 로직 개체와 통신할 수 있는 인터페이스 개체가 생성됩니다.스프링 MVC 컨트롤러 및/또는 앵귤러 컨트롤러 또는 서비스입니다.

여기에 기재되어 있는 원칙을 따르는 샘플 어플리케이션이 있습니다.

새로운 테크놀로지에 열광하는 조직도 있기 때문에 저도 같은 질문을 하고 있는 것 같습니다.「클라우드를 원합니다...잠깐, 나는 경량화를 원한다"는 말은 더 가벼운 프레임워크로 전환할 자격이 있는지의 여부를 정당화하기 어렵다.

Spring / JBoss 심 / J를 사용하여 웹 어플리케이션을 개발합니다.항상 SF와 MVC 프레임워크에 있습니다.대부분의 경우 Java 스크립트는 프레젠테이션 층 검증을 위해 상주하며 주요 작업 클래스/엔티티 및 비즈니스 로직은 Java 코드에 상주합니다.Angular에 대한 기본적인 실습 후 MVC가 무엇을 의미하는지 이해하기 시작했습니다. 프리젠테이션 레이어에서 다른 레벨을 추상화하면 프런트 엔드에 독자적인 뷰와 컨트롤러를 가질 수 있습니다.질문에 답하려면 모두의 코멘트와 마찬가지로 프레젠테이션 레이어에 배치하는 것이 가장 좋습니다.

시큐러티의 관점에서는, 무겁거나 민감한 비즈니스 룰은, 세계에 공개하고 싶지 않기 때문에, 서버 측에 있는 것이 좋다고 생각합니다.비즈니스 로직이 제대로 개발되지 않으면 코드의 약점을 쉽게 찾아 악용할 수 있습니다.

Angular와 같은 프레임워크는 소규모 상점/SOHO에서 고객을 응대하는 것과 같습니다.인력은 적고 매우 효율적이고 빠릅니다.비즈니스 및 배송/수신 상품을 효율적으로 취급하는 고객에게 적합합니다(REST, JSON지정된 역할과 태스크를 가지고 있지만 일부 작업자는 작업 이상의 작업을 수행합니다.이 가게는 평소 삼엄한 보안을 강조하지 않아 절도나 강도에게 취약하다.

Spring/Struts 2와 같은 서버측 프레임워크에 대해서는 관리 수준이 다르며 대규모 비즈니스(배치 작업, 웹 서비스, 엔터프라이즈 버스)에 대응할 수 있는 최신 기업(CMM 레벨 5)을 상상해 보십시오.그들은 고객을 직접 대하지는 않지만, 종종 브로커나 소매점을 거친다.기업의 보안은 보다 견고하며, 많은 경우 보안 또는 중요한 정보는 금고(암호화/사인온)로 보호됩니다.

나의 접근 방식은 항상 상향식 접근 방식입니다.데이터베이스 설계부터 적절하게 구성/관련된 테이블을 사용하여 필요에 따라 저장 프로시저를 저장한 후 솔루션에 엔티티 프레임워크를 추가하거나 ADO를 사용합니다.EF가 옵션이 아닌 경우 순.그런 다음 비즈니스 로직과 모델을 개발하여 데이터를 데이터베이스로 송수신합니다.

모델이 확립되면 다음 두 가지 경로를 선택할 수 있습니다.MVC 컨트롤러 개발 및/또는 WebAPI 컨트롤러 개발.두 컨트롤러 모두 모델에 액세스할 수 있습니다. 클래스를 인스턴스화하고 메서드를 호출하기만 하면 됩니다.

MVC 컨트롤러에 의해 제어되는 MVC 뷰를 설정할 수도 있고 HTML 페이지 또는 SPA(NodeJ에서 호스트되는Single Page Application)의 완전히 다른 세트를 설정할 수도 있습니다.

완전히 다른 HTML 페이지 세트에서는 Get, Post, Put 및 Delete 메서드를 사용하여 WebAPI 컨트롤러를 사용해야 하며 클라이언트를 식별하기 위해 토큰을 앞뒤로 포함하고 CORS를 활성화해야 합니다(Cross Origin Request용).

MVC 뷰를 사용하면 컨트롤러 속성 및/또는 세션을 사용하여 클라이언트를 식별할 수 있으며 CORS에 대해 걱정할 필요가 없습니다.또, 필요에 따라서, 뷰를 강하게 타이핑 할 수도 있습니다.유감스럽게도 UI 개발자 세트가 있는 경우 동일한 MVC 솔루션에서 작업해야 합니다.

두 경우 모두 Angular를 사용할 수 있습니다.JS: 컨트롤러 간에 데이터를 주고받을 수 있습니다.

IMHO Angular의 개념JS 컨트롤러는 C# MVC 또는 C# WebAPI 컨트롤러와 다릅니다.각진JS 컨트롤러에는 "ApiFactory"를 통한 엔드포인트 호출뿐만 아니라 모든 Javascript 로직이 저장되어 있습니다.반면 C# 컨트롤러는 서버 측의 엔드포인트일 뿐이며 UI 요구를 받아들여 응답합니다.

언급URL : https://stackoverflow.com/questions/13067607/angularjs-client-mvc-pattern