BackboneJS-애플리케이션
BackboneJS는 비즈니스 로직과 사용자 인터페이스 로직을 분리 할 수있는 구조를 웹 애플리케이션에 제공합니다. 이 장에서는 사용자 인터페이스를 구현하기위한 BackboneJS 애플리케이션의 아키텍처 스타일에 대해 설명합니다. 다음 다이어그램은 BackboneJS의 아키텍처를 보여줍니다-
BackboneJS의 아키텍처는 다음 모듈을 포함합니다-
- HTTP 요청
- Router
- View
- Events
- Model
- Collection
- 데이터 소스
이제 모든 모듈에 대해 자세히 설명하겠습니다.
HTTP 요청
HTTP 클라이언트는 웹 브라우저, 검색 엔진 등이 HTTP 클라이언트처럼 작동하는 요청 메시지의 형태로 서버에 HTTP 요청을 보냅니다. 사용자는 HTTP 요청 프로토콜을 사용하여 문서, 이미지 등의 파일을 요청합니다. 위의 다이어그램에서 HTTP 클라이언트가 라우터를 사용하여 클라이언트 요청을 보내는 것을 볼 수 있습니다.
라우터
클라이언트 측 애플리케이션을 라우팅하는 데 사용되며 URL을 사용하여 조치 및 이벤트에 연결합니다. 응용 프로그램 개체의 URL 표현입니다. 이 URL은 사용자가 수동으로 변경합니다. URL은 백본에서 사용되므로 사용자에게 보내거나 제공 할 애플리케이션 상태를 이해할 수 있습니다.
라우터는 URL을 복사하여보기에 도달 할 수있는 메커니즘입니다. 라우터는 웹 애플리케이션이 앱의 중요한 위치에 대해 링크 가능하고 책갈피 가능하며 공유 가능한 URL을 제공 할 때 필요합니다.
위의 아키텍처에서 라우터는 HTTP 요청을 View에 보냅니다. 애플리케이션에 라우팅 기능이 필요한 경우 유용한 기능입니다.
전망
BackboneJS 뷰는 애플리케이션에서 표시하는 방법과 내용을 담당하며 애플리케이션에 대한 HTML 마크 업을 포함하지 않습니다. 사용자에게 모델의 데이터를 표시하는 아이디어를 지정합니다. 보기는 "데이터 모델의 모양"을 반영하는 데 사용됩니다.
뷰 클래스는 HTML 및 CSS에 대해 전혀 알지 못하며 전체 페이지를 다시로드하지 않고 모델이 변경 될 때 각 뷰를 독립적으로 업데이트 할 수 있습니다. DOM에서 UI의 논리적 청크를 나타냅니다.
위의 아키텍처에서 볼 수 있듯이 View는 Router를 사용하여 수행 한 사용자 요청에 대한 응답을 표시하는 사용자 인터페이스를 나타냅니다.
이벤트
이벤트는 모든 응용 프로그램의 주요 부분입니다. 사용자의 사용자 지정 이벤트를 응용 프로그램에 바인딩합니다. 모든 개체에 혼합 될 수 있으며 사용자 지정 이벤트를 바인딩하고 트리거 할 수 있습니다. 원하는 이름을 사용하여 사용자 지정 이벤트를 바인딩 할 수 있습니다.
일반적으로 이벤트는 프로그램 흐름과 동시에 처리됩니다. 위의 아키텍처에서는 이벤트가 발생하는 시점을 볼 수 있으며, View를 사용하여 모델의 데이터를 나타냅니다.
모델
데이터를 검색하고 채우는 것은 JavaScript 애플리케이션의 핵심입니다. 모델은 애플리케이션의 데이터, 데이터의 논리를 포함하며 프레임 워크의 기본 데이터 개체를 나타냅니다.
모델은 일부 비즈니스 논리 및 비즈니스 유효성 검사가있는 비즈니스 항목을 나타냅니다. 주로 데이터 저장 및 비즈니스 로직에 사용됩니다. 모델은 데이터 저장소에서 검색하고 저장할 수 있습니다. 모델은 라우터를 사용하여보기가 전달한 이벤트에서 HTTP 요청을 가져와 데이터베이스의 데이터를 동기화하고 응답을 클라이언트로 다시 보냅니다.
수집
컬렉션은 컬렉션에서 모델이 수정 된 경우 이벤트를 바인딩하는 모델 집합입니다. 컬렉션에는 루프에서 처리 할 수있는 모델 목록이 포함되어 있으며 정렬 및 필터링을 지원합니다. 컬렉션을 만들 때 속성 인스턴스와 함께 컬렉션이 가질 모델 유형을 정의 할 수 있습니다. 모델에서 트리거 된 모든 이벤트는 모델의 컬렉션에서도 트리거됩니다.
또한보기에서 요청을 가져오고 이벤트를 바인딩하고 데이터를 요청 된 데이터와 동기화하고 응답을 HTTP 클라이언트로 다시 보냅니다.
데이터 소스
서버에서 데이터베이스로 설정하는 연결이며 클라이언트에서 요청한 정보를 포함합니다. BackboneJS 아키텍처의 흐름은 다음 단계와 같이 설명 할 수 있습니다.
사용자는 URL을 사용하여 애플리케이션을 이벤트로 라우팅하는 라우터를 사용하여 데이터를 요청합니다.
뷰는 사용자에게 모델의 데이터를 나타냅니다.
모델 및 컬렉션은 사용자 지정 이벤트를 바인딩하여 데이터베이스에서 데이터를 검색하고 채 웁니다.
다음 장에서는 BackboneJS에서 이벤트의 중요성을 이해할 것입니다.