AngularJS 썸네일형 리스트형 AngularJs 2 - main.ts & app.component.ts 이전에 만들었던 프로젝트 디렉토리 밑에 app 이라는 디렉토리를 만들자. 물론 꼭 그렇게 해야되는 것은 아니지만, 일반적인 룰을 따라 주는 것이 편하다. app 디렉토리에 main.ts 와 app.componet.ts 파일을 만든다. main.ts index.html에서 import한다고 했던 app/main 파일이다. 3번째 줄에서 AppComponent라는 모듈을 import하는데 이는 app.component.ts 파일에서 만들어진 것이다. app.component.ts 6번째 줄에서 AppComponet라는 이름으로 export 하고 있다. @Component 데코레이터 함수에 의해 이 콤포넌트가 어떻게 생성되고 사용되어야 하는지 메타데이터를 통해 알려진다. 3번째 줄의 selector라는 필드를.. 더보기 AngularJs 2 - index.html 웹앱의 시작점인 index.html을 만들어보자. 일반적인 html 구조이고, system.src.js의 함수가 사용되고 있다. 이 파일은 이전에 만든 package.json의 의존성에 의해 npm install 시에 설치되었다. 25번째 줄에 의해 29번째 줄의 import시에 main.js라고 써주지 않아도 된다. 36번째 줄의 tag는 이후 만들 app.component.ts에서 참조 하게 된다. * ts 는 TypeScript의 확장자이며, 이를 transpile 하여 생긴 결과가 js 파일이다. 더보기 AngularJs 2 - 시작하기 아직은 베타인 AngularJs 2. 오래전 php로 웹 프로그램을 해본 이후로 이쪽에는 전혀 관심을 두고있지 않았다. 그 이후 많은 툴들, 개념들이 나왔고, 어떤 프로그램을 만들던 이제 UI는 웹으로 만드는 것이 트랜드인듯하다. 브라우저만 있다면 어떤 디바이스에서도 사용가능하기 때문일까? 아무튼, 시작해보자. 일단, 기본 환경부터 만들어야 이후를 진행할 수있다. 5 MIN QUICKSTART를 참고해서 개발 환경을 구축해 둔다. 요약하자면 nmp 설치tsconfig.json 파일 추가typings.json 파일 추가package.json 파일 추가 - 프로젝트별 이름, 버전 정보가 있다.npm install 실행 더보기 이전 1 2 다음