[javascript] AngularJS는 단일 페이지 애플리케이션 (SPA) 전용입니까?

우리는 우리가 만들고있는 응용 프로그램의 프런트 엔드를 구축 할 수있는 옵션을 찾고 있으며 우리에게 도움이 될 도구를 평가하고 앞으로 나아갈 최고의 플랫폼을 제공하려고합니다.

이것은 Node.js 프로젝트입니다. 우리의 초기 계획은 Express를 사용하고 해당 경로를 내려가는 것이었지만,이 단계를 시작하기 전에 무엇이 있는지 검토하는 것이 가장 좋습니다. 우리의 응용 프로그램에는 단일 페이지 모델에 적합하지 않다고 생각되는 여러 영역이 있습니다.

Backbone.js , Meteor 등 클라이언트를 구축하는 데 사용할 수있는 몇 가지 프레임 워크 와 AngularJS를 보았습니다.

이것은 명백한 질문 일 수 있지만 AngularJS가 순전히 단일 페이지 응용 프로그램 용인지 아니면 Express와 같은 다중 페이지 응용 프로그램에 사용될 수 있는지 여부를 해독 할 수 없습니다.


업데이트 2013 년 7 월 17 일
사람들을 계속 돌보기 위해 프로세스를 진행 하면서이 질문을 업데이트 할 것입니다. 우리는 지금 모든 것을 함께 구축 할 것이며 그것이 얼마나 잘 수행되는지 볼 것입니다. 우리는 우리보다 AngularJS에 더 많은 자격을 갖춘 사람들에게 연락하여 컨텍스트를 공유하는 큰 응용 프로그램을 분할하는 것에 관한 질문을 제기했지만 한 페이지에서 너무 큰 작업을 할 수 있습니다.

합의는 여러 정적 페이지를 제공하고 해당 페이지에서만 작동하는 AngularJS 응용 프로그램을 만들어 SPA 모음을 효과적으로 만들고 표준 연결을 사용하여 해당 응용 프로그램을 서로 연결할 수 있다는 것입니다. 이제 솔루션에 여러 응용 프로그램이 있으므로 유스 케이스가 매우 구체적이므로 먼저 단일 코드 기반을 시도하고 거기서부터 최적화하겠습니다.

업데이트 2016 년 6 월 18 일 프로젝트가 절벽에서 떨어 졌으므로 너무 많은 일을 끝내지 못했습니다. 최근에 다시 선택했지만 더 이상 각도를 사용하지 않고 대신 React를 사용하고 있습니다. 우리는 익스프레스 및 자체 포함 앱을 사용하는 이전 업데이트에 요약 된 아키텍처를 계속 사용하고 있습니다. 예를 들어 /chatReact 채팅 앱을 제공하는 특급 경로 /projects가 있고 프로젝트 앱을 제공하는 다른 경로 가 있습니다. 곧. 우리가 그것을 보는 방식은 각 앱이 기능 세트 측면에서 총체적 루트이므로, 앱 자체로 간주되기 위해서는 독립형이어야합니다. 기술적으로 모든 정보, 기본 표현 및 사용하려는 클라이언트 측 앱 구축의 모든 맛이 있습니다.



답변

전혀. Angular를 사용하여 다양한 앱을 빌드 할 수 있습니다. 클라이언트 측 라우팅은 그 중 작은 부분 일뿐입니다.

클라이언트 측 라우팅 외부에 도움이되는 많은 기능 목록이 있습니다.

  • 양방향 바인딩
  • 템플릿
  • 통화 형식
  • 복수
  • 재사용 가능한 컨트롤
  • RESTful API 처리
  • AJAX 취급
  • 모듈화
  • 의존성 주입

“단일 페이지 앱에서만 사용할 수있다”고 생각하는 것은 미친 일입니다. 물론 .. “Jquery는 애니메이션이있는 프로젝트 전용”이라고 말하는 것과 같습니다.

프로젝트에 적합하면 사용하십시오.


답변

나는 처음으로 Angular와 함께 “어떻게”와 씨름했다. 그러던 어느 날, 그것은 “아직도 자바 스크립트입니다”라고 시작되었습니다. Angular의 입출력에 대한 많은 예제가 있습니다 ( https://github.com/angular-app/angular-app 책과 함께 내가 좋아하는 것 중 하나 ). 가장 기억해야 할 것은 다른 프로젝트에서와 마찬가지로 js 파일을로드하는 것입니다. 다른 페이지가 올바른 Angular 객체 (컨트롤러, 뷰 등)를 참조하고 꺼져 있는지 확인하기 만하면됩니다. 나는 이것이 의미가 있기를 바라지 만 대답은 너무나 간단해서 간과했다.


답변

아마도 내 경험은 누군가에게 유용 할 것입니다. 우리는 프로젝트를 논리적으로 분리했습니다. 피드에 사용하는 하나의 스파, 맵과 함께 작동하는 스파, 사용자 프로필 편집을위한 스파 등. 예를 들어 피드, 사용자 및 맵의 세 가지 앱이 있습니다. 분리 된 URL에서 다음과 같이 사용합니다.

https://host/feed/#/top/
https://host/user/#/edit/1/
https://host/map/favorites/#/add/

이러한 각 응용 프로그램에는 응용 프로그램의 상태 간 자체 로컬 라우팅 매핑이 있습니다. 각 응용 프로그램은 실제로 필요한 컨텍스트 및로드 종속성으로 만 작동하기 때문에 좋은 습관이라고 생각합니다. 또한 디버그 및 통합 프로세스에 매우 적합합니다.

실제로 SPA 응용 프로그램을 혼합하여 쉽게 만들 수 있습니다. 예를 들어 피드는 angularjs 응용 프로그램, url이있는 사용자 응용 프로그램, url이 있으며 backbone.js 응용 프로그램에 매핑됩니다.

귀하의 질문에 대한 답변 :

SPA를위한 Angular는 SPA 애플리케이션을위한 빠르고 빠른 플레이를 제공하지만, 다양한 SPA 애플리케이션의 MPA 애플리케이션을 구축하려는 귀찮은 사람은 없습니다. 그러나 URL 아키텍처에 대한 생각은 응용 프로그램의 SEO 가용성을 잊지 마십시오.

나는 또한 아이디어를지지한다 :

프로젝트와 앱의 차이점은 무엇입니까? 앱은 웹 로그 시스템, 공개 레코드 데이터베이스 또는 간단한 설문 조사 앱과 같은 작업을 수행하는 웹 애플리케이션입니다. 프로젝트는 특정 웹 사이트에 대한 구성 및 앱 모음입니다. 프로젝트에는 여러 앱이 포함될 수 있습니다. 앱은 여러 프로젝트에있을 수 있습니다.


답변

클라이언트 데이터 바인딩이있는 몇 페이지 만 있으면 Knockout 및 Javascript Namespacing을 사용하십시오.

녹아웃은 특히 복잡한 이전 ​​버전과의 호환성이 필요하고 페이지가 상당히 직설적 일 경우 유용합니다. 타사 구성 요소를 사용하는 경우 Knockout의 사용자 지정 바인딩은 간단하고 사용하기 쉽습니다.

자바 스크립트 네임 스페이스를 사용하면 코드를 분리하여 관리 할 수 ​​있습니다.

var myCo = myCo || {};
myCo.page = {
    init: function(){ ... },
    ...
}

다른 스크립트가로드 된 후 스크립트 태그에서

<script>
    myCo.init();
</script>

열쇠는 필요할 때 원하는 도구를 사용한다는 것입니다. 데이터 바인딩이 필요하십니까? 녹아웃 (또는 원하는대로) 라우팅이 필요하십니까? sammy.js (또는 원하는 것).

클라이언트 코드는 원하는만큼 간단하거나 복잡 할 수 있습니다. 기존 독점 프레임 워크를 사용하여 Angular를 매우 복잡한 사이트에 통합하려고 시도했는데 악몽이었습니다. Angular는 새로 시작하면 훌륭하지만 학습 곡선이 있으며 매우 엄격한 워크 플로우에 고정됩니다. 따르지 않으면 코드가 정말 빠르게 꼬일 수 있습니다.


답변

SPA를 개발하려는 경우 Angular가 과도하다고 말하고 싶습니다. 물론 이미 개발에 익숙하다면 계속 진행하십시오. 그러나 프레임 워크를 처음 사용하고 SPA를 개발 해야하는 경우 여러 가지 고유 한 특권으로 더 간단한 것을 시도합니다. Vue.js 또는 Aurelia.io살펴 보는 것이 좋습니다 .

Vue.js 는 양방향 데이터 바인딩, MVVM, 재사용 가능한 컴포넌트, 간단하고 빠른 픽업, 적은 코드 작성 등을 사용합니다. Angular 및 React의 최고 기능 중 일부를 결합합니다.

Aurelia.io , 모든 정직하게, 나는 잘 모른다. 그러나 나는 주변을 들여다 보았으며 위와 비슷한 대안으로 볼 가치가있는 것 같습니다.

링크 :
https://vuejs.org/
http://aurelia.io/


답변