jQuery 배경이 있다면 "angularjs에서 생각하고 있니?[닫은]
질문
jQuery에서 클라이언트 측 응용 프로그램을 개발하는 것에 익숙하다고 가정하지만 이제 Angularjs를 사용하여 시작하고 싶습니다.필요한 패러다임 변화를 설명 할 수 있습니까?다음은 답변을 프레임하는 데 도움이되는 몇 가지 질문입니다.
- How do I architect and design client-side web applications differently? What is the biggest difference?
- What should I stop doing/using; What should I start doing/using instead?
- Are there any server-side considerations/restrictions?
나는 jQuery와 Angularjs 사이의 자세한 비교를 찾고 있지 않습니다.
답변
1. 페이지를 디자인하지 마십시오. DOM 조작으로 변경하십시오.
jQuery에서 페이지를 디자인하고 동적으로 만듭니다.이것은 jQuery가 증가를 위해 설계되었고 그 간단한 전제로부터 엄청나게 성장했기 때문입니다.
그러나 Angularjs에서는 아키텍처를 염두에두고부터 시작해야합니다."나는 돔 의이 조각을 가지고 있고 x"를 x "로 만들고 싶다.
2. Angularjs로 jQuery를 증가시키지 마십시오
마찬가지로 jQuery가 x, y 및 z를 수행하는 아이디어로 시작하지 마십시오. 그래서 Angularjs를 모델 및 컨트롤러의 위에 추가 할 것입니다.이것은 당신이 시작할 때 정말 유혹합니다. 그래서 새로운 AngularJS 개발자가 적어도 그들이 "각도"를 수행하는 데 익숙해 질 때까지 항상 jQuery를 사용하지 않는 것이 좋습니다.
나는 여기에서 많은 개발자가 보았고 메일 링리스트에서 jQuery 플러그인이 150 회 또는 200 줄의 jQuery 플러그인으로 정교한 솔루션을 만들고 혼란스럽고 회복 된 콜백 콜렉션과 $ applys의 컬렉션을 가진 Angular에 접착되어 있습니다.그러나 그들은 결국 그것을 일하고 있습니다!문제는 jQuery 플러그인이 갑자기 모든 것이 이해할 수 있고 간단 해지는 코드의 일부분에서 angularj에서 다시 쓸 수있는 대부분의 경우입니다.
결론은 다음과 같습니다. 해결책이있을 때 첫 번째 "Angularjs에서 생각하십시오";솔루션을 생각할 수없는 경우 지역 사회에게 물어보십시오.그 모든 것이 쉬운 솔루션이 없으면 jQuery를 자유롭게 도달하십시오.그러나 jQuery가 앙구리를 마스터하지 못하게하지 않게하지 마십시오.
3. 항상 아키텍처 측면에서 생각하십시오
먼저 단일 페이지 응용 프로그램이 응용 프로그램임을 알고 있습니다.그들은 웹 페이지가 아닙니다.그래서 우리는 클라이언트 측 개발자와 같은 생각 외에 서버 측 개발자처럼 생각해야합니다.우리는 우리의 응용 프로그램을 개인, 확장 가능한 테스트 가능한 구성 요소로 나누는 방법에 대해 생각해야합니다.
그럼 어떻게 그렇게합니까?Angularjs에서 어떻게 생각하니?jQuery와 대조되는 일반적인 원칙이 있습니다.
보기는 "공식 기록"입니다.
jQuery에서는 프로그래밍 방식으로보기를 변경합니다.우리는 다음과 같이 UL으로 정의 된 드롭 다운 메뉴를 가질 수 있습니다 :
<ul class="main-menu">
<li class="active">
<a href="#/home">Home</a>
</li>
<li>
<a href="#/menu1">Menu 1</a>
<ul>
<li><a href="#/sm1">Submenu 1</a></li>
<li><a href="#/sm2">Submenu 2</a></li>
<li><a href="#/sm3">Submenu 3</a></li>
</ul>
</li>
<li>
<a href="#/home">Menu 2</a>
</li>
</ul>
jQuery에서는 응용 프로그램 논리에서 다음과 같은 것으로 활성화 할 것입니다.
$('.main-menu').dropdownMenu();
우리가 그냥보기를 볼 때, 여기에 어떤 기능이 있는지 즉시 분명하지는 않습니다.소규모 응용 프로그램의 경우 괜찮습니다.그러나 사소한 응용 프로그램의 경우 사물이 신속하게 혼란스럽고 유지하기가 어렵습니다.
Angularjs에서는 뷰 기반 기능에 대한 공식 기록입니다.우리의 UL 선언은 대신 이처럼 보입니다 :
<ul class="main-menu" dropdown-menu>
...
</ul>
이 두 사람은 똑같은 일을하지만 Angularjs 버전에서는 템플릿을보고있는 사람이 무엇을 할 것인지를 알고 있습니다.개발 팀의 새로운 회원이 보드에 올 때마다 그녀는 이것을 볼 수 있으며 그 다음에 운영하는 DropDownMenu라는 지침이 있음을 알 수 있습니다.그녀는 모든 코드를 통해 올바른 대답을 일으키거나 조직 할 필요가 없습니다.이 전망은 우리에게 일어날 일이 무엇인지 말했습니다.훨씬 깨끗한.
Angularjs의 새로운 개발자는 종종 특정 종류의 모든 링크를 찾고 지시문을 추가하려면 어떻게해야합니까?개발자는 항상 회신 할 때 항상 flabbergasted입니다.그러나 당신이 그렇게하지 않는 이유는 이것이 half-jquery, half-angularjs, 좋은 것과 같습니다.여기서 문제는 개발자가 Angularjs의 맥락에서 "jQuery"를 "jQuery"하려고한다는 것입니다.그것은 결코 잘 작동하지 않을 것입니다.보기는 공식 기록입니다.지침 이외의 지역 (아래에서는 더 많은 것), 당신은 결코 돔을 바꾸지 않을 것입니다.지시문이보기에 적용되므로 의도가 명확합니다.
기억하십시오 : 디자인하지 마십시오.설계자, 그리고 디자인을 설계해야합니다.
데이터 바인딩
이것은 Angularjs의 가장 멋진 기능 중 하나이며 이전 섹션에서 언급 한 DOM 조작의 종류를 수행 할 필요가 많은 많은 필요성을 줄입니다.Angularjs는 자동으로 조회를 업데이트하여 필요하지 않습니다!jQuery에서는 이벤트에 응답 한 다음 콘텐츠를 업데이트합니다.뭔가 :
$.ajax({
url: '/myEndpoint.json',
success: function ( data, status ) {
$('ul#log').append('<li>Data Received!</li>');
}
});
다음과 같이 보입니다.
<ul class="messages" id="log">
</ul>
관심을 섞는 것 외에도 우리는 또한 앞서 언급 한 의도를 나타내는 것과 동일한 문제가 있습니다.그러나 더 중요한 것은 DOM 노드를 수동으로 참조하고 업데이트해야했습니다.그리고 로그 항목을 삭제하려는 경우 DOM에 대해 코드를 보호해야합니다.DOM과는 다른 논리를 어떻게 테스트합니까?그리고 프레젠테이션을 변경하고 싶다면 어떨까요?
이것은 조금 지저분하고 사소한 가슴.그러나 Angularjs에서 우리는 이것을 할 수 있습니다 :
$http( '/myEndpoint.json' ).then( function ( response ) {
$scope.log.push( { msg: 'Data Received!' } );
});
그리고 우리의 견해는 다음과 같이 보일 수 있습니다.
<ul class="messages">
<li ng-repeat="entry in log">{{ entry.msg }}</li>
</ul>
그러나 그 문제 때문에 우리의 견해는 다음과 같이 보일 수 있습니다.
<div class="messages">
<div class="alert" ng-repeat="entry in log">
{{ entry.msg }}
</div>
</div>
이제는 정렬되지 않은 목록을 사용하는 대신 부트 스트랩 경고 상자를 사용하고 있습니다.그리고 우리는 컨트롤러 코드를 변경하지 않았습니다!그러나 더 중요한 것은 로그가 업데이트되는 위치 또는 방법에 관계없이보기가 변경됩니다.자동으로.정돈 된!
여기에 표시되지는 않았지만 데이터 바인딩은 양방향입니다.따라서 해당 로그 메시지는 을 수행하여 뷰에서 편집 할 수 있습니다.그리고 많은 기쁨이있었습니다.
별개의 모델 레이어
jQuery에서 DOM은 모델과 같은 종류입니다.그러나 Angularjs에서 우리는 우리가 원하는 방식으로 관리 할 수있는 별도의 모델 레이어를 가지고 있으며, 우리가 원하는 방식으로 완전히 독립적으로 관리 할 수 있습니다.이는 위의 데이터 바인딩에 도움이되며, 우려의 분리를 유지하며 훨씬 더 큰 테스트 가능성을 도입합니다.다른 답변은이 시점을 언급 했으므로 그냥 그냥 떠날 것입니다.
우려의 분리
그리고 위의 모든 넥타이 가이 오버 아치형 주제로 : 당신의 우려를 분리하십시오.귀하의 견해는 무엇이 일어날 일이 일어나는 일에 대한 공식 기록으로서 행동합니다.모델은 데이터를 나타냅니다.재사용 가능한 작업을 수행하는 서비스 계층이 있습니다.DOM 조작을 수행하고 지침으로보기를 보완합니다.그리고 당신은 그것을 컨트롤러와 함께 접착합니다.이것은 또한 다른 답변에서 언급되었으며, 내가 아래의 다른 섹션에서 논의하는 테스트 빌리지에 관한 유일한 방법을 언급했습니다.
의존성 주사
우려의 분리로 우리를 돕기 위해 의존성 주입 (DI)입니다.서버 측 언어 (자바에서 PHP까지)에서 왔을 경우 이미이 개념에 익숙하지만 jQuery에서 오는 클라이언트 쪽 사람이 어리석은 것처럼 보일 수 있습니다....에그러나 그렇지 않습니다.:-)
광범위한 관점에서 DI는 구성 요소를 매우 자유롭게 선언 한 다음 다른 구성 요소로부터 구성 요소를 선언 할 수 있으며 그 유사체를 요청하고 부여됩니다.주문 또는 파일 위치 또는 그런 것에 대해 알아야 할 필요가 없습니다.전원은 즉시 표시되지 않을 수 있지만, 하나의 (공통) 예 : 테스트를 제공 할 수 있습니다.
우리의 응용 프로그램에서 REST API를 통해 서버 측 저장을 구현하고 응용 프로그램 상태, 로컬 저장소에 따라 서버 측 저장소를 구현하는 서비스가 필요합니다.컨트롤러에서 테스트를 실행할 때 우리는 서버와 통신해야합니다. 우리는 컨트롤러를 테스트하고 있습니다.우리는 원래의 구성 요소와 동일한 이름의 모의 서비스를 추가 할 수 있으며 인젝터는 컨트롤러가 자동으로 가짜를 가져 오는 것을 보장합니다 - 우리의 컨트롤러는 그 차이점을 알지 못하고 차이를 알 수 없도록합니다.
테스트에 대한 말하기 ...
4. 시험 중심 개발 - 항상
이것은 정말로 아키텍처의 3 절의 부분이지만, 제가 자체 최상위 섹션으로 퍼팅하는 것이 중요합니다.
당신이 보았고, 사용되거나, 쓰여진 많은 많은 jQuery 플러그인 중 몇 명이 첨부 된 테스트 스위트를 가지고 있었습니까?jQuery가 그 일에 매우 괴롭히지 않기 때문에별로 많지 않습니다.그러나 Angularjs는입니다.
jQuery에서 테스트 할 수있는 유일한 방법은 테스트가 DOM 조작을 수행 할 수있는 샘플 / 데모 페이지와 독립적으로 구성 요소를 만들 수 있습니다.따라서 우리는 별도로 구성 요소를 개발 한 다음 응용 프로그램에 통합해야합니다.얼마나 불편한!jQuery로 개발할 때 많은 시간이 있으므로 테스트 중심의 개발 대신 반복적 인 것을 선택합니다.그리고 누가 우리를 비난 할 수 있었습니까?
그러나 우리는 우려를 분리했기 때문에 우리는 Angularjs에서 반복적으로 시험 중심의 개발을 할 수 있습니다!예를 들어, 우리는 현재의 경로가 무엇인지 메뉴에서 표시하기 위해 슈퍼 간단한 지시문을 원한다고 가정 해 봅시다.우리는 우리의 응용 프로그램을보기에서 우리가 원하는 것을 선언 할 수 있습니다.
<a href="/hello" when-active>Hello</a>
좋아, 이제 우리는 활성 지시문을 사용할 때 존재하지 않는 테스트를 쓸 수 있습니다.
it( 'should add "active" when the route changes', inject(function() {
var elm = $compile( '<a href="/hello" when-active>Hello</a>' )( $scope );
$location.path('/not-matching');
expect( elm.hasClass('active') ).toBeFalsey();
$location.path( '/hello' );
expect( elm.hasClass('active') ).toBeTruthy();
}));
그리고 우리가 테스트를 실행할 때, 우리는 그것이 실패했는지 확인할 수 있습니다.오직 지금 우리는 지시문을 만드는 것입니다.
.directive( 'whenActive', function ( $location ) {
return {
scope: true,
link: function ( scope, element, attrs ) {
scope.$on( '$routeChangeSuccess', function () {
if ( $location.path() == element.attr( 'href' ) ) {
element.addClass( 'active' );
}
else {
element.removeClass( 'active' );
}
});
}
};
});
이제 테스트가 통과하고 메뉴가 요청 된대로 수행됩니다.우리의 개발은 반복적이고 테스트 중단됩니다.사악한 멋진.
5. 개념적으로 지시문은 포장되지 않습니다 jQuery
당신은 종종 "지침에서 DOM 조작 만 수행"합니다.이것은 필수품입니다.기한으로 대우하십시오!
그러나 조금 더 깊은 다이빙을하자.
일부 지시는 이미보기에 이미 무엇이 있는지 (NgClass라고 생각합니다)가 똑바로 DOM 조작을 곧바로 장식 한 다음 기본적으로 완료됩니다.그러나 지침이 "위젯"과 같고 템플릿을 가지고 있으면 우려의 분리를 존중해야합니다.즉, 템플릿도 링크 및 컨트롤러 기능의 구현과 크게 독립적으로 유지되어야합니다.
Angularjs는이 모든 도구 세트가있어 매우 쉽게 만들 수 있습니다.NGClass를 사용하면 클래스를 동적으로 업데이트 할 수 있습니다.NGModel은 양방향 데이터 바인딩을 허용합니다.ngshow 및 nghide는 프로그래밍 방식으로 요소를 표시하거나 숨 깁니다.그리고 우리가 자신을 쓰는 것들을 포함하여 더 많은 것들을 포함합니다.즉, 우리는 DOM 조작없이 모든 종류의 awesomeness를 수행 할 수 있습니다.덜 DOM 조작은 쉬운 지시문이 테스트하고, 스타일을 쉽게하기가 쉽고, 미래에 변화 할 수 있고, 더 재사용 가능하고 배포 할 수 있습니다.
나는 jQuery를 무리를 던질 장소로 지침을 사용하여 Angularjs를 사용하는 많은 개발자를 많이 본다.즉, "컨트롤러에서 DOM 조작을 할 수 없으므로 해당 코드를 지침에 넣을 것"이라고 생각합니다.확실히 훨씬 낫지 만, 종종 틀린 것입니다.
우리가 제 3 장에서 프로그래밍 된 로거를 생각해보십시오. 우리가 지시문에 넣으더라도 우리는 여전히 "각도 방식"을 원합니다.그것은 여전히 돔 조작을하지 않습니다!DOM 조작이 필요한 경우에는 많은 시간이 있습니다. 그러나 그것은 당신이 생각하는 것보다 훨씬 희귀합니다!신청서의 DOM 조작을하기 전에 정말로 필요할 때 직접 물어보십시오.더 나은 방법이있을 수 있습니다.
다음은 내가 가장 자주 볼 수있는 패턴을 보여주는 빠른 예입니다.우리는 전용 버튼을 원합니다.(참고 :이 예에서는 조금 고지되어 있고 정확히 같은 방식으로 해결되는 복잡한 사례를 대표하는 Skosh 자세한 것입니다.)
.directive( 'myDirective', function () {
return {
template: '<a class="btn">Toggle me!</a>',
link: function ( scope, element, attrs ) {
var on = false;
$(element).click( function () {
on = !on;
$(element).toggleClass('active', on);
});
}
};
});
이 문제가 발생한 몇 가지가 있습니다.
- First, jQuery was never necessary. There's nothing we did here that needed jQuery at all!
- Second, even if we already have jQuery on our page, there's no reason to use it here; we can simply use
angular.elementand our component will still work when dropped into a project that doesn't have jQuery. - Third, even assuming jQuery was required for this directive to work, jqLite (
angular.element) will always use jQuery if it was loaded! So we needn't use the$- we can just useangular.element. - Fourth, closely related to the third, is that jqLite elements needn't be wrapped in
$- theelementthat is passed to thelinkfunction would already be a jQuery element! - And fifth, which we've mentioned in previous sections, why are we mixing template stuff into our logic?
이 지시문은 훨씬 더 단순히 그렇게 훨씬 더 단순히 다시 작성할 수 있습니다.
.directive( 'myDirective', function () {
return {
scope: true,
template: '<a class="btn" ng-class="{active: on}" ng-click="toggle()">Toggle me!</a>',
link: function ( scope, element, attrs ) {
scope.on = false;
scope.toggle = function () {
scope.on = !scope.on;
};
}
};
});
다시 말하지만, 템플릿은 템플릿에 있으므로 (또는 사용자)는 필요한 스타일을 충족시키는 것에 대해 쉽게 교환 할 수 있으며 논리는 절대로 만지지 않아도됩니다.재사용 가능성 - 붐!
그리고 테스트와 같은 다른 모든 이점이 있습니다. 쉽습니다!템플릿에있는 것이 무엇이든 상관없이 지시문의 내부 API는 결코 만지지 않으므로 리팩토링이 쉽습니다.지시문을 만지지 않고 원하는만큼 템플릿을 변경할 수 있습니다.그리고 당신이 변화하는 것이 무엇이든간에 테스트가 여전히지나갑니다.
00T!
따라서 지시문이 jQuery와 같은 함수의 컬렉션이 아닌 경우, 그들은 무엇입니까?지시문은 실제로 HTML 확장입니다.HTML이 필요로하는 일을하지 않으면 지시문을 작성하여 HTML의 일부인 것처럼 사용하십시오.
Angularjs가 상자에서 뭔가를하지 않으면 팀이 NgClick, NGClass, et al과 함께 맞게 팀이 어떻게 성취 할 것인지를 생각해보십시오.
요약
jQuery를 사용하지 마십시오.조차 포함하지 마십시오.그것은 당신을 다시 붙잡을 것입니다.이미 jQuery에서 해결하는 방법을 알고 있다고 생각하는 문제가 발생하면 Angularjs의 경계 내에서 그것을하는 방법에 대해 생각해보십시오.당신이 모르는 경우, 물어보십시오!20 번 밖으로 19 번, 그것은 jQuery가 필요하지 않고 jQuery로 해결하려고 시도하는 것이 더 많은 일을 할 수 있습니다.
답변
명령 → 선언적
jQuery에서 선택기는 DOM 요소를 찾은 다음 이벤트 핸들러를 바인딩 / 등록하는 데 사용됩니다.이벤트 트리거가 트리거되는 경우, 그 (필수) 코드가 DOM을 업데이트 / 변경하기 위해 실행됩니다.
Angularjs에서는 DOM 요소가 아닌 뷰에 대해 생각하고 싶습니다.views는 Angularjs 지시문을 포함하는 (선언적) HTML입니다.지시문은 우리를위한 장면 뒤에 이벤트 핸들러를 설정하고 동적 데이터 바인딩을 제공합니다.선택기는 거의 사용되지 않으므로 IDS (및 일부 유형)의 필요성이 크게 감소합니다.보기는 모델 (범위를 통해)에 묶여 있습니다.보기는 모델의 투영입니다.이벤트 변경 모델 (즉, 데이터, 범위 속성) 및 해당 모델이 자동으로 업데이트되는 뷰를 변경합니다.
Angularjs에서는 데이터를 보유하는 jQuery 선택된 DOM 요소가 아닌 모델에 대해 생각해보십시오.사용자가 보는 것을 조작하기 위해 콜백을 등록하기 위해 콜백을 등록하는 대신 해당 모델의 투영으로보기에 대해 생각해보십시오.
우려의 분리
jQuery는 눈에 띄는 자바 스크립트 - 동작 (JavaScript)을 구조 (HTML)와 분리합니다.
Angularjs는 컨트롤러와 지시문 (각각의 컨트롤러 및 / 또는 컴파일 및 링크 기능을 가질 수 있음)을 사용하여 View / Structure (HTML)에서 동작을 제거합니다.Angular에는 응용 프로그램을 분리 / 구성 할 수있는 서비스 및 필터가 있습니다.
https://stackoverflow.com/a/14346528/215945를 참조하십시오
신청 설계
Angularjs 응용 프로그램을 디자인하는 한 가지 방법 :
- Think about your models. Create services or your own JavaScript objects for those models.
- Think about how you want to present your models -- your views. Create HTML templates for each view, using the necessary directives to get dynamic databinding.
- Attach a controller to each view (using ng-view and routing, or ng-controller). Have the controller find/get only whatever model data the view needs to do its job. Make controllers as thin as possible.
프로토 타입 상속
자바 스크립트 프로토 타선 상속이 작동하는 방식을 알지 못하지 않고 jQuery에서 많은 것을 할 수 있습니다.AngularJS 애플리케이션을 개발할 때 자바 스크립트 상속을 잘 이해하면 몇 가지 일반적인 함정을 피할 수 있습니다.권장 독서 : Angularjs의 범위 프로토 타입 / 프로토 타입 상속의 뉘앙스는 무엇입니까?
답변
Angularjs vs. jQuery.
Angularjs와 jQuery는 매우 다른 이데올로기를 채택합니다.jQuery에서 오는다면 당신은 놀라운 차이점을 발견 할 수 있습니다.각진은 당신을 화나게 할 수 있습니다.
이것은 정상이며, 당신은 푸시해야합니다.각도는 가치가 있습니다.
큰 차이 (TLDR)
jQuery는 DOM의 임의의 비트를 선택하고 광고를 변경하는 툴킷을 제공합니다.당신은 조각으로 조각을 좋아하는 것을 꽤 많이 할 수 있습니다.
Angularjs 대신 컴파일러를 제공합니다.
이것이 의미하는 것은 AngularJS가 전체 DOM을 위에서 아래로 읽고 문자 그대로 컴파일러에 대한 지침으로 코드로 취급합니다.DOM을 가로 지르면 AngularJS Compiler가 작동하는 방법과해야 할 일을 알리는 특정 지시문 (컴파일러 지침)을 찾습니다.지시문은 속성, 태그, 클래스 또는 의견과 일치 할 수있는 JavaScript로 가득 찬 물체입니다.
각 컴파일러가 특정 지시문과 일치하는 DOM이 일치하는 것을 결정할 때 DOM 요소, 모든 속성 (로컬 변수 저장소 인) 및 기타 유용한 비트를 통과하는 지시문 기능을 호출합니다.이러한 속성에는 지시문에 의해 해석 될 수있는 표현식이 포함될 수 있으며 렌더링하는 방법과 다시 그 자체를 다시 그려야하는지 알려줍니다.
그런 다음 지시문은 컨트롤러, 서비스 등과 같은 추가 각도 구성 요소를 당겨 낼 수 있습니다. 컴파일러의 맨 아래에있는 내용은 완전히 형성된 웹 응용 프로그램이며, 유선 및 준비가되어 있습니다.
즉, 각도는 템플릿이 구동됩니다.귀하의 템플릿은 다른 방식으로 다른 방법이 아닌 자바 스크립트를 구동합니다.이것은 역할의 급진적 인 반전이며, 지난 10 년 동안 쓰는 눈에 띄는 자바 스크립트의 완전한 반대편입니다.이것은 약간의 익숙해 질 수 있습니다.
이런 소리가 오버 규범적이고 제한 될 수 있으면 진리에서 아무것도 더 멀리 떨어질 수 있습니다.Angularjs는 HTML을 코드로 취급하기 때문에 웹 응용 프로그램에서 HTML 레벨 세분성을 얻을 수 있습니다.모든 것이 가능하며, 몇 가지 개념적 도약을 만드는 일단 대부분의 것들은 놀랍도록 쉽습니다.
곤경의 껄끄 러운 껄끄 러 가자.
첫째, 각도는 jQuery를 대체하지 않습니다
각도와 jquery는 다른 것들을합니다.Angularjs는 웹 응용 프로그램을 생산할 수있는 일련의 도구를 제공합니다.jQuery는 주로 DOM을 수정하기위한 도구를 제공합니다.페이지에 jQuery가 있으면 Angularjs가 자동으로 사용됩니다.그렇지 않은 경우 Angularjs는 jQuery Lite와 배송되지만 여전히 완벽하게 사용 가능한 jQuery 버전입니다.
misko는 jquery를 좋아하며 그것을 사용하는 것을 사용하는 것을 좋아하지 않습니다.그러나 범위, 템플릿 및 지시문의 조합을 사용하여 수행 한 모든 작업을 수행 할 수 있다는 것을 향상시킬 수 있으며 가능한 경우 코드가 더 이산적이고 구성 가능하며 구성 할 수 있기 때문에이 워크 플로우를 선호해야합니다.모난.
jQuery를 사용하는 경우, 장소 전체에서 뿌리지 않아야합니다.Angularjs에서 DOM 조작을위한 올바른 위치는 지침에 있습니다.나중에 더 많은 것.
선택자와 선언 적 템플릿이있는 눈에 띄지 않는 JavaScript
jQuery는 일반적으로 미숙하지 않습니다.JavaScript 코드는 헤더 (또는 꼬리말)에 연결되어 있으며, 이것은 언급 된 유일한 장소입니다.선택기를 사용하여 페이지의 비트를 선택하고 그 부분을 수정할 수있는 플러그인을 작성합니다.
JavaScript가 제어됩니다.HTML에는 완전히 독립적 인 존재가 있습니다.JavaScript가 없으면 HTML은 의미 론적으로 남아 있습니다.OnClick 속성은 매우 나쁜 연습입니다.
Angularjs에 대해 알아 차릴 수있는 첫 번째 요소 중 하나는 사용자 정의 특성이 모든 곳에 있음을 알리는 것입니다.HTML은 NG 속성이 흩어져 있으며, 이는 본질적으로 스테로이드에 대한 속성을 켜줍니다.이들은 지시문 (컴파일러 지시문)이며 템플릿이 모델에 연결되는 주요 방법 중 하나입니다.
처음 볼 때 오래된 학교 침입 자바 스크립트 (처음에 있었던 것처럼)로 Angularjs를 쓸 수 있습니다.실제로 Angularjs는 이러한 규칙에 의해 재생되지 않습니다.Angularjs에서 HTML5는 템플릿입니다.Angularjs가 웹 페이지를 생성하는 것은 컴파일됩니다.
이것은 첫 번째 큰 차이입니다.jQuery에서 웹 페이지는 조작 할 DOM입니다.Angularjs에서 HTML은 컴파일하는 코드입니다.Angularjs는 전체 웹 페이지에서 읽고 문자 그대로 작성한 컴파일러를 사용하여 새 웹 페이지로 컴파일합니다.
귀하의 템플릿은 선언적이어야합니다.그 의미는 단순히 그것을 읽음으로써 명확해야합니다.우리는 의미있는 이름으로 사용자 정의 특성을 사용합니다.우리는 의미있는 이름으로 다시 새로운 HTML 요소를 구성합니다.최소한의 HTML 지식과 코딩 기술이없는 디자이너는 AngularJS 템플릿을 읽고 수행하는 것을 이해할 수 있습니다.그 또는 그녀는 수정할 수 있습니다.이것은 각도 방식입니다.
템플릿은 운전석에 있습니다.
Angularjs를 시작하고 자습서를 통해 실행할 때 자신에게 요청한 첫 번째 질문 중 하나는 "내 코드는 어디에 있습니까?"입니다.나는 자바 스크립트를 작성했지만, 나는이 모든 행동을 가지고 있습니다.대답은 분명합니다.AngularJS가 DOM을 컴파일하기 때문에 Angularjs는 HTML을 코드로 취급하고 있습니다.많은 간단한 경우 템플릿을 작성하고 AngularJS가 응용 프로그램으로 컴파일하기에 충분합니다.
템플릿은 응용 프로그램을 구동합니다.그것은 DSL로 취급됩니다.Angularjs 구성 요소를 작성하며 Angularjs는 템플릿의 구조를 기반으로 적시에 그들을 끌어 당기고 적시에 사용할 수 있도록 관리합니다.이것은 템플릿이 출력을위한 표준 MVC 패턴과 매우 다릅니다.
예를 들어 레일의 루비보다 XSLT와 더 비슷합니다.
이것은 약간의 익숙해지는 통제의 급진적 인 반전입니다.
JavaScript에서 응용 프로그램을 운전하려는 중지하십시오.템플릿이 응용 프로그램을 구동하고 Angularjs가 구성 요소를 함께 배선하도록하십시오.이것은 또한 각도입니다.
의미 론적 HTML 대 시맨틱 모델
jQuery와 함께 HTML 페이지에는 의미있는 의미있는 콘텐츠가 포함되어야합니다.JavaScript가 꺼지면 (사용자 또는 검색 엔진에 의해) 콘텐츠가 액세스 할 수 있습니다.
Angularjs는 HTML 페이지를 템플릿으로 취급하기 때문입니다.콘텐츠가 일반적으로 API에서 오는 모델에 저장된 것처럼 템플릿은 의미 론적이지 않습니다.Angularjs는 시맨틱 웹 페이지를 생성하기 위해 모델로 DOM을 컴파일합니다.
HTML 소스는 더 이상 의미가 없으며 대신 API와 컴파일 된 DOM이 의미 론적입니다.
Angularjs에서는 모델의 삶을 의미합니다. HTML은 디스플레이만을위한 템플릿 일뿐입니다.
이 시점에서 SEO와 접근성에 관한 모든 종류의 질문이 있으며, 이렇게됩니다.여기에 열린 문제가 있습니다.대부분의 스크린 독자는 이제 자바 스크립트를 구문 분석합니다.검색 엔진은 Ajaxed 콘텐츠를 인덱싱 할 수도 있습니다.그럼에도 불구하고 PushState URL을 사용하고 있는지 확인하고 괜찮은 사이트 맵이 있습니다.이 문제에 대한 논의는 여기를 참조하십시오 : https://stackoverflow.com/a/23245379/687677
우려의 분리 (SoC) 대 MVC.
우려의 분리 (SoC)는 SEO, 접근성 및 브라우저 비 호환성을 비롯한 다양한 이유로 수년간의 웹 개발에 걸쳐 자란 패턴입니다.다음과 같습니다.
- HTML - Semantic meaning. The HTML should stand alone.
- CSS - Styling, without the CSS the page is still readable.
- JavaScript - Behaviour, without the script the content remains.
다시 말하지만 Angularjs는 규칙에 따라 재생되지 않습니다.뇌졸중에서 Angularjs는 10 년 동안받은 지혜가 10 년으로 없으며 대신 템플릿이 더 이상 의미가없는 MVC 패턴을 구현합니다.
다음과 같습니다.
- Model - your models contains your semantic data. Models are usually JSON objects. Models exist as attributes of an object called $scope. You can also store handy utility functions on $scope which your templates can then access.
- View - Your views are written in HTML. The view is usually not semantic because your data lives in the model.
- Controller - Your controller is a JavaScript function which hooks the view to the model. Its function is to initialise $scope. Depending on your application, you may or may not need to create a controller. You can have many controllers on a page.
MVC와 SOC는 동일한 규모의 반대쪽 끝이 아니며 완전히 다른 축에 있습니다.SoC는 Angularjs 컨텍스트에서는 의미가 없습니다.당신은 그것을 잊어서 움직여야합니다.
나처럼, 당신은 브라우저 전쟁을 통해 살았습니다.이 아이디어는 매우 공격적입니다.그것을 극복하고, 그만한 가치가있을 것입니다, 나는 약속합니다.
플러그인 대 지침
플러그인은 jQuery를 확장합니다.Angularjs 지시문은 브라우저의 기능을 확장합니다.
jQuery에서 우리는 jquery.prototype에 함수를 추가하여 플러그인을 정의합니다.그런 다음 요소를 선택하고 결과에 플러그인을 호출 하여이를 DOM에 연결합니다.아이디어는 jQuery의 기능을 확장하는 것입니다.
예를 들어, 페이지에서 회전 목마를 원한다면, 아마도 NAV 요소에 래핑 된 수치 목록을 정의 할 수 있습니다.그런 다음 페이지에서 목록을 선택하고 슬라이딩 애니메이션을 수행하기 위해 시간 초과가있는 갤러리로 삽입되어 일부 jQuery를 작성할 수 있습니다.
Angularjs에서 우리는 지시문을 정의합니다.지시문은 JSON 객체를 반환하는 함수입니다.이 객체는 Angularjs를 찾아내는 DOM 요소를 알고 있으며, 변경 사항을 변경합니다.지시문은 원하는 속성이나 요소를 사용하여 템플릿에 연결됩니다.이 아이디어는 HTML의 기능을 새로운 속성 및 요소로 확장하는 것입니다.
AngularJS 방식은 원시 보는 HTML의 기능을 확장하는 것입니다.HTML처럼 보이는 HTML을 작성하여 사용자 정의 속성 및 요소로 확장해야합니다.
회전 목마를 원한다면
소규모 지시어의 제비가 많습니다. 구성 스위치가있는 큰 플러그인
jQuery의 경향은 수많은 값과 옵션을 통과하여 구성한 라이트 박스와 같은 큰 플러그인을 작성하는 것입니다.
이것은 Angularjs의 실수입니다.
드롭 다운의 예를 들어보십시오.드롭 다운 플러그인을 작성할 때 클릭 핸들러의 코드를 유혹 할 수 있습니다. 아마도 펼쳐진 요소의 클래스를 변경할 것입니다. 펼쳐진 요소의 클래스를 변경하고, 메뉴를 숨겨진 모든 것들을 보여줄 수 있습니다.
작은 변화를 원할 때까지.
호버를 펼치고 싶은 메뉴가 있다고 가정 해보십시오.잘 이제 우리는 문제가 있습니다.우리의 플러그인은 클릭 처리자에게 유선 하여이 특정 사례에서 다르게 작동하는 구성 옵션을 추가해야합니다.
Angularjs에서는 더 작은 지침을 작성합니다.우리의 드롭 다운 지시문은 엄청나게 작습니다.접힌 상태를 유지하고 (), (), 펼치기 () 또는 토글 ()에 메서드를 제공 할 수 있습니다.이러한 메소드는 단순히 $ scope.menu.visible을 업데이트 할 수 있습니다. 이는 주를 보유하고있는 부울입니다.
이제 우리의 템플릿에서 우리는 이걸로 철회 할 수 있습니다 :
<a ng-click="toggle()">Menu</a>
<ul ng-show="menu.visible">
...
</ul>
Mouseover에서 업데이트해야합니까?
<a ng-mouseenter="unfold()" ng-mouseleave="fold()">Menu</a>
<ul ng-show="menu.visible">
...
</ul>
템플릿은 HTML 레벨 세분성을 얻으므로 응용 프로그램을 구동합니다.케이스 예외에 따라 사례를 만들고 싶다면 템플릿이 쉽게됩니다.
폐쇄 대 $ Scope.
jQuery 플러그인은 폐쇄로 만들어집니다.개인 정보는 그 폐쇄 내에서 유지됩니다.그 폐쇄 내에서 스코프 체인을 유지하는 것은 당신에게 달려 있습니다.jQuery에 의해 플러그인에 전달 된 DOM 노드 세트에만 액세스 할 수 있습니다. 클로저 및 정의한 전역에서 정의 된 모든 로컬 변수와 함께 정의됩니다.즉, 플러그인은 매우 자체적으로 포함되어 있음을 의미합니다.이것은 좋은 일이지만 전체 응용 프로그램을 만들 때 제한적 일 수 있습니다.동적 페이지의 섹션간에 데이터를 전달하려고 시도하면 해독이됩니다.
Angularjs에는 $ Scope 객체가 있습니다.이들은 모델을 저장하는 Angularjs가 생성하고 유지 관리하는 특수 객체입니다.특정 지시문은 기본적으로 JavaScript 프로토 타입 상속을 사용하여 기본적으로 랩핑 $ 범위를 상속하는 새로운 $ Scope를 생성합니다.$ Scope 객체는 컨트롤러와 뷰에서 액세스 할 수 있습니다.
이것은 영리한 부분입니다.$ SCOPE 상속의 구조가 대략 DOM의 구조를 따라하기 때문에 요소는 자신의 범위에 액세스 할 수 있으며, 글로벌 스코프와 동일하지는 않습니다.
이렇게하면 데이터를 전달하고 적절한 수준의 데이터를 저장하는 것이 훨씬 쉽습니다.드롭 다운이 펼쳐지는 경우 드롭 다운 $ 범위 만 알아야합니다.사용자가 기본 설정을 업데이트하면 전역 $ Scope를 업데이트하고 사용자 기본 설정을 듣는 중첩 된 범위가 자동으로 경고됩니다.
실제로 당신이 그것을 긴장 시키면 비행과 같아지면 복잡한 것일 수도 있습니다.$ Scope 객체를 만들 필요가 없으며 Angularjs가 템플릿 계층 구조를 기반으로하여 올바르게 및 적절하게 사용자를 위해 인스턴스화하고 구성합니다.Angularjs는 종속성 주입의 마법 (나중에)을 사용하여 구성 요소가 사용할 수 있습니다 (나중에).
수동 DOM 변경 대 데이터 바인딩
jQuery에서는 손으로 모든 DOM을 변경합니다.새로운 DOM 요소를 프로그래밍 방식으로 생성합니다.JSON 배열이 있고 DOM에 넣으려면 HTML을 생성하고 삽입하는 기능을 작성해야합니다.
Angularjs 도이 작업을 수행 할 수 있지만 데이터 바인딩을 사용하는 것이 좋습니다.모델을 변경하고 DOM이 템플리트를 통해이를 바인딩하기 때문에 DOM이 자동으로 업데이트되지 않고 개입이 필요하지 않습니다.
데이터 바인딩이 템플릿에서 수행되므로 속성 또는 중괄호 구문을 사용하여 쉽게 할 수 있습니다.그것과 관련된인지 적 오버 헤드가 거의 없으므로 항상 자신을 찾을 수 있습니다.
<input ng-model="user.name" />
입력 요소를 $ scope.user.name에 바인딩합니다.입력을 업데이트하면 현재 범위의 값을 업데이트하고 그 반대의 경우도 마찬가지입니다.
비슷하게:
<p>
{{user.name}}
</p>
단락에 사용자 이름을 출력합니다.라이브 바인딩이므로 $ scope.user.name 값이 업데이트되면 템플리트가 업데이트됩니다.
모든 시간
jQuery에서 Ajax 전화를 만드는 것은 상당히 간단하지만 아직도 두 번 생각할 수있는 것입니다.생각할 수있는 복잡성이 추가되고 유지할 수있는 공정한 덩어리가 있습니다.
Angularjs에서는 Ajax가 귀하의 기본 Go-to 솔루션이며 거의 눈에 띄지 않고 항상 발생합니다.NG-include가있는 템플릿을 포함 할 수 있습니다.가장 단순한 사용자 정의 지시문으로 템플릿을 적용 할 수 있습니다.Ajax 호출을 서비스에서 래핑하고 GitHub 서비스 또는 Flickr 서비스를 만들 수 있습니다.이 서비스는 놀라운 쉽게 액세스 할 수 있습니다.
서비스 개체 vs 도우미 기능
jQuery에서는 API에서 피드를 당기는 것과 같은 작은 아닌 DOM 관련 작업을 수행하려는 경우, 우리는 클로저에서 그 일을하기 위해 작은 기능을 작성할 수 있습니다.그것은 유효한 해결책이지만, 우리가 그 피드가 자주 액세스하기를 원한다면 어떻게 될까요?다른 응용 프로그램에서 해당 코드를 재사용하려면 어떻게해야합니까?
Angularjs는 미국의 서비스 객체를 제공합니다.
서비스는 함수와 데이터가 포함 된 간단한 개체입니다.그들은 항상 싱글 톤이며, 그 중 하나 이상이 될 수는 없습니다.스택 오버플로 API에 액세스하려면이를 수행하는 방법을 정의하는 StackoverFlowService를 작성할 수 있습니다.
우리가 장바구니가 있다고 가정 해 봅시다.우리는 장바구니를 유지 관리하고 항목을 추가하고 제거하기위한 방법을 포함하는 ShowingCartService를 정의 할 수 있습니다.서비스는 싱글 톤이므로 다른 모든 구성 요소가 공유하기 때문에 장바구니에 쓸 수있는 모든 객체를 사용하여 데이터를 가져올 수 있습니다.항상 같은 카트입니다.
서비스 객체는 우리가 꼭 맞는대로 사용할 수 있고 재사용 할 수있는 자체 포함 된 Angularjs 구성 요소입니다.기능과 데이터가 포함 된 간단한 JSON 객체입니다.그들은 항상 싱글 톤이므로 한 곳에서 서비스에 데이터를 저장하면 동일한 서비스를 요청하여 해당 데이터를 어딘가에서 가져올 수 있습니다.
의존성 주입 (DI) 대 인식 - AKA De-Spaghettification
Angularjs는 귀하의 의존성을 관리합니다.객체를 원한다면 단순히 참조하십시오. 그리고 Angularjs가 당신을 위해 그것을 얻을 것입니다.
이것을 사용하기 시작할 때까지 이것은 거대한 시간이 무엇인지 설명하기가 어렵습니다.Angularjs di와 같은 것은 jquery 안에 존재하지 않습니다.
DI는 응용 프로그램을 작성하고 함께 배선하는 대신 문자열로 식별되는 각 구성 요소 라이브러리를 정의합니다.
Flickr에서 JSON 피드를 당기는 방법을 정의하는 'flickrservice'라는 구성 요소가 있습니다.이제 Flickr에 액세스 할 수있는 컨트롤러를 쓰고 싶다면 컨트롤러를 선언 할 때 'flickrservice'를 이름으로 참조해야합니다.Angularjs는 구성 요소를 인스턴스화하고 내 컨트롤러에서 사용할 수 있도록 관리합니다.
예를 들어, 여기에서는 서비스를 정의합니다.
myApp.service('FlickrService', function() {
return {
getFeed: function() { // do something here }
}
});
이제 해당 서비스를 사용하려고 할 때 다음과 같이 이름으로 참조하십시오.
myApp.controller('myController', ['FlickrService', function(FlickrService) {
FlickrService.getFeed()
}]);
Angularjs는 컨트롤러를 인스턴스화하는 데 FlickRService 객체가 필요하다는 것을 인식하고 우리를 위해 하나를 제공 할 것입니다.
이로 인해 일을 매우 쉽게 배선 할 수 있으며 간판에 대한 경향이 거의 없게됩니다.우리는 평평한 구성 요소 목록을 가지고 있으며 Angularjs는 우리가 필요로하는 것으로 우리에게 하나씩 손을 며칠 수 있습니다.
모듈러 서비스 아키텍처
jQuery는 코드를 구성 해야하는 방법에 대해 거의 말합니다.Angularjs는 의견이 있습니다.
Angularjs는 코드를 배치 할 수있는 모듈을 제공합니다.예를 들어 Flickr에 대해 대화하는 스크립트를 작성하는 경우 Flickr 모듈을 만들려면 모든 Flickr 관련 기능을 랩핑 할 수 있습니다. 모듈에는 다른 모듈 (DI)이 포함될 수 있습니다.주 응용 프로그램은 일반적으로 모듈이며 응용 프로그램이 의존 할 다른 모든 모듈이 포함되어야합니다.
Flickr을 기반으로 다른 응용 프로그램을 작성하려면 간단한 코드 재사용을 얻으려면 Flickr 모듈과 Voila를 포함 할 수 있습니다. 새 응용 프로그램의 모든 Flickr 관련 기능에 액세스 할 수 있습니다.
모듈에는 Angularjs 구성 요소가 포함되어 있습니다.모듈을 포함 할 때 해당 모듈의 모든 구성 요소가 고유 한 문자열로 식별 된 간단한 목록으로 사용할 수있게됩니다.그런 다음 Angularjs의 종속성 주입 메커니즘을 사용하여 해당 구성 요소를 서로 주입 할 수 있습니다.
요약하다
Angularjs와 jQuery는 적이 아닙니다.Angularjs에서 jQuery를 매우 잘 사용하는 것이 가능합니다.Angularjs Well (템플리트, 데이터 바인딩, $ Scope, Directives 등)을 사용하는 경우 그렇지 않으면 훨씬 적은 jQuery가 필요합니다.
실현하기위한 주요 사항은 템플릿이 응용 프로그램을 구동하는 것입니다.모든 일을하는 큰 플러그인을 작성하려고하지 마십시오.대신 하나의 일을하는 작은 지침을 작성한 다음 간단한 템플릿을 함께 써서 함께 연결하십시오.
눈에 띄지 않는 JavaScript에 대해 덜 생각하고 대신 HTML 확장면에서 생각하십시오.
내 작은 책
나는 Angularjs에 대해 너무 흥분했고, 나는 온라인 http://nicholasjohnson.com/angular-book/을 읽을 수있는 짧은 책을 썼습니다.도움이되기를 바랍니다.
답변
필요한 패러다임 변화를 설명 할 수 있습니까?
명령적 인 vs 선언
jQuery를 사용하면 DOM에 일어납니다. 단계별로 수행해야합니다.Angularjs를 사용하면 원하는 결과를 설명하지만 수행하는 방법은 아닙니다.여기에 더 많은 것.또한 Mark Rajcok의 답변을 확인하십시오.
클라이언트 측 웹 응용 프로그램을 다르게 건축하고 디자인하려면 어떻게합니까?
Angularjs는 MVC 패턴을 사용하는 전체 클라이언트 측 프레임 워크입니다 (그래픽 표현을 확인하십시오).그것은 우려의 분리에 크게 초점을 맞 춥니 다.
가장 큰 차이점은 무엇입니까?내가 무엇을 멈추어야하는지 / 사용해야합니까?대신 / 사용을 시작해야합니까?
jquery는 도서관입니다
Angularjs는 MVC, 의존 주입, 데이터 바인딩 등의 시원한 것들을 결합하는 고도로 테스트 할 수있는 아름다운 클라이언트 측 프레임 워크입니다.
그것은 테스트 중심의 개발을 용이하게하는 우려와 테스트 (단위 테스트 및 종단 간 테스트)의 분리에 중점을 둡니다.
시작하는 가장 좋은 방법은 멋진 튜토리얼을 통과합니다.몇 시간 안에 단계를 통과 할 수 있습니다.그러나 장면 뒤의 개념을 습득하려는 경우에는 추가 읽기에 대한 수많은 참조가 포함됩니다.
서버 측 고려 사항 / 제한이 있습니까?
이미 순수한 jQuery를 사용하고있는 기존 응용 프로그램에서 사용할 수 있습니다.그러나 AngularJS 기능을 완전히 활용하려면 서버 측을 RESTFul 방식으로 코딩하는 것이 좋습니다.
그렇게하면 서버면이 편리한 API의 추상화를 만드는 자원 팩토리를 활용할 수 있으며 서버 측 통화 (GET, SAVE DELETE 등)를 쉽게 쉽게 할 수 있습니다.
답변
"패러다임 교대"를 설명하기 위해 짧은 대답이 충분할 수 있다고 생각합니다.
Angularjs는 요소를 찾는 방식을 변경합니다
jQuery에서는 일반적으로 선택기를 사용하여 요소를 찾은 다음 전선을 업로드합니다. $ ( '# id .class'). (도우먼트)를 클릭하십시오.
Angularjs에서는 지시문을 사용하여 요소를 직접 표시하고 다음을 삭제합니다. ">
Angularjs는 선택자를 사용하여 요소를 찾을 필요가 없거나 Angularjs의 JQLite 대 전체 Blown JQuery의 기본 차이점이 선택기를 지원하지 않는다는 것입니다.
따라서 사람들이 "jQuery를 전혀 포함하지 마십시오"라고 말할 때 주로 선택자를 사용하기를 원하지 않기 때문에 주로 있습니다.대신 지시문을 사용하는 법을 배우기를 원합니다.직접, 선택하지 마십시오!
답변
jquery.
jQuery는 GetElementByHerpderp와 같은 긴 JavaScript 명령을 짧고 브라우저를 짧게 만듭니다.
Angularjs.
Angularjs는 HTML은 정적 페이지 용으로 설계 되었기 때문에 동적 웹 응용 프로그램에서 잘 작동하는 일을하는 자신의 HTML 태그 / 속성을 만들 수 있습니다.
편집하다:
"나는 jquery 배경을 가지고 있는지 말하고 어떻게 angularjs에서 어떻게 생각합니까?""나는 HTML 배경을 가지고있는 방법을 가지고 있다고 말하는 것과 같습니다. 어떻게 생각합니까?"질문을 묻는 사실은이 두 자원의 근본적인 목적을 이해하지 못할 것입니다.이것이 "Angularjs가 지시문을 사용하면 jQuery가 CSS 선택기를 사용하여 이들과 그 등의 jQuery 객체를 만들기 위해 CSS 선택기를 사용하기 위해서는 근본적인 차이를 가리킴으로써 질문에 대답하기로 선택한 이유입니다....에이 질문에는 긴 답변이 필요하지 않습니다.
jQuery는 브라우저에서 프로그래밍 JavaScript를 쉽게 프로그래밍 할 수있는 방법입니다.짧은, 브라우저 명령 등
Angularjs는 HTML을 확장하므로 응용 프로그램을 만드는 곳에서
최근댓글