본문 바로가기

공부 이야기/그냥 찾아보는 공부

Angular Framework는 무엇인가?

관련 출처 영상)

https://www.youtube.com/watch?v=3K1AhCSW2iM&list=PLq8wAnVUcTFWl-3u5aH7G-5DQuPJP4sUw

 

 

1. Angular JS와는 다른 프로그램이다.

즉, Javascript에서 국한되지 않은 새로운 프레임워크이다.

 

2. Javascript와 Ajax가 사용되지 전의 웹 환경

- 데이터를 교환할 때 화면 전체를 전환해야되는 과-트래픽 문제가 발생했었음

- 따라서 페이지 단위가 아닌 데이터 단위로 요청-응답을 하는 방식으로 변화되었다.

 

3. 변화된 방식 - Ajax

- XML을 비동기적으로 처리해주는 것이 Ajax !!

- 다양한 종류의 데이터가 교환됨에 따라 프론트엔드 작업이 복잡해져 자바스크립트 기술이 필요해짐

 

4. Google

- 브라우저 기반의 OS, 프로그램을 개발하려는 회사

- Chrome만 사용하면 어떤 데이터 요청, 라이브러리 환경을 처리할 수 있도록 함.

- SPA : Single Page Application

자바스크립트로 구성된 Document

기존 Google Web Toolkit을 기반으로 만든 해당 Feedback 프로그램을 더 짧고 효율적으로 만든 라이브러리가 바로 Angular JS 이다.

 

SPA 로직 흐름도, DOM을 이용한 입출력 처리 부분을 Angular JS로 간단화시켰다.

 

5. MVW, W=Whatever

- Angular JS를 이용해서 기존 자바스크립트 방식을 원활하고 신속하게 해준 디자인 패턴 

- 화면 객체(DOM 객체)를 직접 조작하는 방식

- 아래 화면처럼 직접 Document 객체를 선언하고 초기화 할 필요 없이 간단하게 만든 것을 의미 -> 코드의 단축

Angular JS를 이용하게 되면 노란색 박스만 작성하면 된다...!

- MVC의 Controller(트랜잭션 처리 담당)를 Whatever로 바꾸어 놓은 패턴

- MVC 패턴은 화면 UI를 쉽게 구현하기 위한 방법이다. 

- 예시로, JAVA 코드로 System.out 객체를 이용해서 UI를 직접 제어하는 방식이 아닌, 출력 변수 Model을 두는 것.

 

출력 변수 model을 미리 마련한 방법과 그렇지 않은 방법
분기문을 작성하는 것이 아닌 model을 사용하는 것.

- 하나의 과정을 종류에 따라 두 개로 분류한 것이다.

- 화면을 구성하는 모습이 훨씬 간단해지기 때문에 훨씬 효율적인 방법이다.

- 각 기능은 다시 MVC로 나뉜다.

 1) Model [출력 변수]

 2) View [화면에 표시되는 부분]

 3) Controller [변수를 처리하는 분기문 등] 

- 실행 순서에 따라 JAVA - HTML 블록을 확실하게 나뉠 수 있는 장점이 있다.