[AngularJS 기초 강의] 앵귤러JS 프레임워크의 의미와 재미

[AngularJS 기초 강의] 앵귤러JS 프레임워크의 의미와 재미, 뜻

AngularJS는 구글에서 만든 Single Page APP (SPA)를 만들때 반복되는 코드와 복잡한 코드를 줄이고 테스트를 쉽게 하도록 하기 위해 만든 자바스크립트 MVC 프레임워크입니다.

이를 이용하면 HTML 기반에서 MVC(Model View Controller) 패턴을 적용하여 적은 소스 코드로 웹 어플리케이션을 쉽고 빠르게 만들 수 있다고 합니다.

라이브러리가 아니고 프레임워크이므로 정해진 기본구조 위에 필요한 기능을 갖다 얹기만 하면 되는데요. 즉 새롭게 만드는 것이 아니고 만들어진 것을 가져와 사용하는 경우입니다.

AngularJS의 유래

 - 2009년에 구글직원인 Misko hevery와 Adam abrons가 공동 개발하였으며 시초는 온라인 JSON Storage Service를 지원하는 소프트웨어로 개발되어 졌습니다.

 이후 MIT 라이선스를 보유하였으며, Open Source 라이브러리로 채택되었으며 2013년 9월 기준 1.0.8 버전으로 정식 출시되었습니다.

AngularJS는 오픈소스이며, 당연히 모두 무료입니다.

 자바 스크립트 프레임 워크의 기반이며 자신의 이벤트를 나눈 지시문이 있습니다. 

 Factories, Modules, Providers, Services, Expressions, Data Binding, Dependancy Injection, Controllers, Validator, Filter, Scope, Directives 가 있습니다.

이들의 의미는 다음 강의에 보겠습니다.

AngularJS의 유용한 장점은

새로운 속성으로 HTML을 확장하고, 단일 페이지 응용 프로그램(앱) 작업에 최적화 되어있으며, 쉽게 배울 수 있다는 큰 장점이 있습니다.

AngularJS의 기본적으로 필요한 사전지식은 HTML, CSS, JavaScript입니다.

초반에는 HTML을 하다가 자바스크립트(함수) 쪽을 하다보면 꽤나 어려워 질겁니다.

저도 함수에 막혀 삽질하는 시간이 많네요...

AngularJS의 특징을 자세하게 다시 적어보도록 하겠습니다.

1. Dependency - 

AngularJS는 개발 및 이해가 빠르며, 테스트하기 위해 쉽게 응용 프로그램을 만들어 개발자들에게 도움을주는 내장 의존성 주입 서브 시스템을 가지고있습니다.

2. MVC - 

AngularJS는 MVC 모델에서 작동하는 자바 스크립트 프레임 워크입니다.

3. FREE - 

AngularJS는 오픈 소스이며 무료입니다.

4. Validation - 

AngularJS는 자바 스크립트와 같은 동일한 클라이언트 측 유효성 검사를 제공합니다. 유효성 검사를 사용하여 당신은 당신의 검증 결과를 만들 수 있습니다.

5. Filter - 

데이터를 수정하기위한 필터가 주로 사용됩니다. (|) 문자 필터 파이프를 사용하여 표현 및 지침에 추가 될 수있습니다.

6. Directives - 

AngularJS의 지시문을 볼때 새로운 구문들이 많이 보일 것입니다. 이 지시문들은 HTML 요소의 특징과 기능을 개선합니다. 

 이런 지시자들은 HTML에 특별한 DOM 요소의 요점입니다. 예를 들어, 정적 HTML과 표시한 날짜 피커 위젯을 만들 줄 모른다고 한다면 우리가 이 지시문(HTML)에 이 새로운 구문(지시자)을 HTML에 적용시켜 보자는 것입니다.

 참고로 AngularJS 지시자의 접두사 ng-는 HTML 특성을 확장합니다.(vs2015에 ng를 작성하면 보기말이 확장되어 나옵니다.)

7. Forms - 

AngularJS의 형태는 버튼과 같은 입력 제어 장치, 입력 요소의 집합입니다. 

AngularJS는 모델 객체 ($ scope)에 HTML 양식 입력 필드의 데이터 바인딩에 대한 몇 가지 기능을 가지고 있습니다. ng-model 지시어를 사용하여 모델 속성에 입력 필드를 바인딩합니다.