모듈이란 ? 앵귤러는 모듈들로 이루어져 있다. 앵귤러로 만들어진 어플리케이션은 보통 많은 모듈들이 모여서 기능을 수행하게 된다. 일반적인 모듈은 각각 하나의 특정한 목적을 가지고 만들어지고, 그 하나의 기능만을 수행하도록 설계한다. 모듈을 만들고, 어플리케이션에서 사용할 부분을 exports - import 하여 전체적으로 해당 모듈을 사용한다. 튜토리얼을 할 때에 app.component.ts 를 만들었었는데, 이 component가 가장 기본적인 모듈 중에 하나이다. Import와 Export 튜토리얼 적에, 우리는 원리를 이미 import와 export를 사용했었다. 1234./public/app/boot.ts 파일 import {bootstrap} from 'angular2/platform/bro..

Angular js 2.0 살펴보기 Angular.JS 2.0 의 전체 흐름과 구성을 알게 된다면, 세부적인 부분에 대한 이해에 큰 도움이 될 것이다. 게다가 아직 세부 모듈들에 대한 설명이 전무(핵심 모듈들만 아주 약간 정보가 제공된다) 한 상황에서, 전체적인 흐름을 익히고 있는 것도 좋을 듯 하다. 그림은 앵귤러 2.0 정식 홈페이지에서 가져왔다. 어떻게 이해해야 할까 천천히 이해하는 것이 좋겠다. 요소 하나 하나를 따로 포스팅하면서 공부해 갈 계획이다. 위의 그림만으로도 각각의 역할이 어느 정도는 이해가 된다. 기존의 일반 자바스크립트와 html에서는, 양방향 바인딩이 쉽지 않았다. html을 불러오고, 이를 DOM을 통하여 property를 바꾸는 것은 간단한 javascript로 가능하지만, 반..

시작하기 전에..이번 내용도 저번 시간에 했던 내용들을 그대로 이어서 한다. 그러나 몇몇 변화한 점이 있다. style 부분을 ts 내부에서 style로 선언해 준것이 아니라 처음 실행 화면인 angular2.ejs 파일 내부에 추가시켰다. 따라서 화면에 bootstrap.css 파일을 불러들이는 코드를 집어넣어주도록 화자. 을 ejs 파일에 추가시켜주면 되겠다.객체 구분하기 사실상 이번 포스트 결과물은 저번 포스트의 결과물과 별다를 것이 없다. 그러나 결과물은 같을지 몰라도 그 파일들을 보면 분명히 다르다는 것을 알 수 있다. 중요한 점은 파일을 기능별로 세분화하여 구분하였다는 것이다. 이는 관리하는 데에 있어서 굉장히 편한 점으로 다가올 것은 분명한 사실이다. 123456export interface..

그림 클릭시 정식 홈페이지로 이동합니다. 저번 시간에 했던 내용을 이어서 할 예정입니다. 파일을 준비해주세요 !View.htmlapp.component.ts 파일에서 View에 해당하는 template을 templateUrl로 바꿀 수 있습니다. 따라서 View에 해당하는 부분을 따로 파일로 저장하고 Url 지정을 해주면 됩니다. 123456789101112131415161718192021222324{{title}} {{person.id}} {{person.name}} {{selectedPerson.name}} Introduce! {{selectedPerson.webpage}} id: {{selectedPerson.id}} name: Website: Colored by Color Scriptercs vi..

그림 클릭시 정식 홈페이지로 이동합니다. 개발 환경 구성 먼저 시작하기에 앞서 알아두어야 할 점은, AngularJS는 2.0 버전부터 Microsoft에서 개발하는 Javascript의 superset 언어인 Typescript를 기본으로 제작되고 있습니다. 따라서 2.0을 실행하기 위해선 Typescript Compiler를 통하여 javascript로 바꾸어야 인터넷 브라우저가 정상적으로 읽어줄 수 있습니다. 그러한 모듈들을 모두 설치하여야 합니다. 먼저 npm으로 모듈들을 다운로드하기 위하여 package.json 파일을 수정하여야 합니다. package.json1234567891011121314151617181920212223242526272829303132333435{ "name": "expr..

What is Angular.js?! AngularJS는 구글에서 개발된, 그리고 계속 개발중인 Javascript 기반 웹 MVC(Model View Controller) 또는 MVW(Model View Whatever) 프레임워크이다. 위의 사진은 구글에서 조사한 웹 프레임워크 검색으로 분석한 트렌드인데, AngularJS의 괌심도가 급격히 상승하고 있다는 것을 알 수 있다. SPA (Single Page Application) 개발에 특화되어 있다.단일 페이지에서 각종 data의 변화를 새로운 페이지에서 불러와야 하는 것이 아니라바로 그 페이지에서 확인 및 활용이 가능해 진다. 유지 보수가 쉽고 , 위에 말했듯이 데이터 바인딩을 통하여 페이지 내부에서 뷰 업데이트가 가능하고, 코드의 양이 다른 프레..