'앵귤러JS'에 해당되는 글 1건

  1. 2013.03.22 [AngularJS]앵귤러 JS

[AngularJS]앵귤러 JS

AngularJS 2013. 3. 22. 18:07
728x90

먼저 쓴 글은 다른 분들의 정리를 참고하여 중요시하다길래 일단 정리하여 올린거지만

아직 잘 모르겠다 . 천천히 튜토리얼을 보면서 하나씩 배워바야겠다.

 

우선은 먼저 AngularJS 에대해 기본적인 개념을 알아 보려 한다.

 

구글에서 구축하는 jQuery를 능가 할수 있을지는 모르겠다 난 잘 ..

아무튼 데이터 바인딩에 연동되는 Angular JS에 대해 알아 보자

 

우선 사이트는 http://angularjs.org/

 

크롬에서 들어가시는것을 추천합니다. IE는 7,8,9 이하 버전에서는 다운이 안되? 더라구요.

 

 

 

home화면이다, home, Learn, Develop, Discuss 항목이 있다.

 

그중에도 develop 항목안에 api reference가 있다.

프로그래머 지망생이니 api가 어딧는지가 우선 중요한거 아니겠는가 ㅋ;

 

* AngularJs 의 기본 형태

 

- 특징 -

html 태그 안에 ng-app 라는 속성이 포함되어 있다는 점,

AngularJs 를 로드 한다는 점.

{{ }} 로 감싸진 Angular 표현식이 존재한다는 점.

 

- 양방향 데이터 바인딩 구현,

- 자바스크립트 상에서 MVC 모델을 구현,

- 다이렉티브로 태그를 커스터마이징 가능

 

* Angular JS Loading 과정

 

ng-app 지시어를 통해 AngularJS 의 로딩은 대부분 매우 쉽고 간편하게 이루어진다.

일부의 경우 스크립트 로더를 사용하는 형태로 수동적으로 어플리케이션으로 시작 할 수 있다.

 

세가지 매우 중요한 과정이 어플리케이션의 로딩 중에 일어나게 된다.

 

1. dependency injection 을 위해 사용되는 인젝터가 생성된다.

2. 인젝터는 어플리케이션의 모델을 위한 컨텍스트가 되는 루트 스코프를 생성한다.

3. 앵귤러는 그 이후에 ng-app 의 루트 요소로부터 시작점을 삼아 하위요소들을 "컴파일" 한다.

 

한번 어플리케이션이 로딩되고 나면 프라우저에서 어떤 이벤트 (마우스클릭, HTTP 응답, 키 입력 등 ) 가 입력될 때까지 기다리게 된다.

이런 이벤트가 일어나게 되면 앵귤러는 이벤트를 인지하고 이 이벤트가 어떤 모델이든 변경시키고 또 그 변화된 것을 찾게되면 앵귤러는 영향을 반영한 뷰를 리플렉트 하게 된다.

 

어플리케이션의 구조는 매우 간단하다.

 

차근차근 공부를 더 해봐야겠다. 잘만 사용하면 그때 구글 세미나에 가서 들은바론 jQuery보다도 코드수가 더 줄어들었다는... -_+

728x90

'AngularJS' 카테고리의 다른 글

AngularJS 튜토리얼  (0) 2013.03.22
Posted by 정망스
,


맨 위로
홈으로 ▲위로 ▼아래로 ♥댓글쓰기 새로고침