기본 콘텐츠로 건너뛰기

[Angular] 설치 하기

[Angular] 설치 하기

Angular 설치 하기!!

1. Angular를 설치하기 전에 Nodejs를 먼저 설치해야 합니다.

- NodeJs는 https://nodejs.org/ 에서 다운로드 받을 수 있습니다.

- 최신버전보다 추천버전을 사용하길 권장드립니다. (버그가 적음)

- 정상적으로 설치 되었는지 cmd 창을 열어서 확인해봅시다. ( Window Key + R, cmd 입력 )

node --version

- 버전이 확인되면 정상설치 완료!!

2. Angualr를 설치해봅시다.

- https://angular.io/ 에서 "Get Started" 를 누르시면 설치 방법을 확인할 수 있습니다.

- cmd 창을 열고 아래의 명령어 실행!

npm install -g @angular/cli

- nodeJs의 npm을 통해 angular를 설치합니다.

-> 여기서 npm은 nodejs package manager를 말합니다. npm을 통해 개발에 필요한 라이브러리를 다운받아 사용할 수 있습니다.

-> "-g" 옵션은 global 을 말합니다. 특정 app에서 사용하는것이 아니고 PC전체에 필요한 프로그램을 설치할때 "-g" 옵션을 사용합니다.

- 이제 Angular 버전을 확인하여 정상적으로 설치되었는지 확인해 봅시다. ( nodejs와 마찬가지로 cmd 창을 열어서 아래 명령어 입력)

ng -v

위 사진과 같이 Angualr 버전이 나오면 설치 완료!!

3. AngularJS (Angular 1 버전)와 Angular (Angualr 2 이상 버전)는 상당한 차이가 있습니다. 보통은 Angular 1버전을 AngularJS라고 부르고 2 이상 버전은 그냥 Angular라고 부르고 있습니다. AngualrJS는 일반 Script 언어의 발전버전이라면, Angular는 ES6 & Typescript를 적용한 Component 기반의 프레임워크라고 할 수 있습니다. 그리고 2 이상의 버전은 Back-end 까지 포함하여 개발 가능하고, 개발자와 디자이너의 역할을 잘 분리할 수 있도록 설계되어 있습니다. 그냥 서로 다른 언어라고 보면 더 편할 것 같습니다.

이것으로 첫번째 Posting을 마칩니다. ^^

사실 저는 웹개발자는 아니고, Oracle ERP 유지보수를 하고 있습니다. ERP만 주로 하다보니 웹에 대해서 한번 공부해보고 싶어서 Angular를 선택하여 공부하고 있습니다. 제가 공부한 내용을 복습한다는 생각으로 블로그에 포스팅 해보려고 합니다. 혹시 틀린부분이 있으면 꼭 알려주세요. 같이 하나씩 알아가요!!

Oracle ERP 관련해서 궁금한게 있으면 물어보셔도 됩니다.. ㅎㅎ OAF, Forms, PO 모듈 등등.. (설마 진짜 물어보지는 않겠죠? ㅠㅠ)

즐거운 하루 되셔요!

from http://ganggu.tistory.com/1 by ccl(A) rewrite - 2020-03-07 02:21:01

댓글

이 블로그의 인기 게시물

[Debugging] AngularJS2 - Can't bind to 'ngModel' since it isn't a...

[Debugging] AngularJS2 - Can't bind to 'ngModel' since it isn't a... - 좋아요 하이 .. !! Angular2 로 개발을 하다가 아래와 같은 에러를 만났다. 흠 .. 이게 뭘까 열심히 구글링을 해봤다. 간단한 내용이다. 모듈을 추가해주기만 하면 된다. app.module.ts를 열어보자. 여기에다가 FormsModule 과 ReactiveFormsModule을 추가해주면 문제가 해결된다 ! 다들 즐거운 코딩하자. from http://devkingdom.tistory.com/106 by ccl(A) rewrite - 2020-03-18 00:54:15

[aws] deploy Angular app with s3 | AWS S3로 angular 앱 배포하기

[aws] deploy Angular app with s3 | AWS S3로 angular 앱 배포하기 angular project를 빌드한다 ng build --prod 그러면 dist 폴더가 생긴다. dist 폴더 안에 있는 아이들을 사용한다. 아마존 s3 콘솔로 이동 https://s3.console.aws.amazon.com/s3/home?region=ap-northeast-2 새로운 Bucket 을 생성한다(Create bucket). 버킷 이름은 고유하게 짓는다. 버킷 생성후 properties tab > static website hosting을 클릭한다. index document는 index.html은 쓴다. properties > static website hosting Permission tab 에서 권한을 수정한다. overview tab 에서 필요한 파일 업로드 dist 폴더 안에 있는 파일들을 업로드 한다. bucket policy 설정 properties > static website hosting > endpoint 클릭하면 서버에 올라간 앱을 확인 할 수 있다 일단 angular 앱을 올리긴 했는데.. 이걸로는 아무것도 할 수 었다. django로 만든 서버를 올리고 database를 연결하고 그것을 지금 이 angular 앱과 연결해야한다. 아직 어떻게 해야 할지는 모르겠음 계속 삽질 중. 그래도 angular app 하나 올라갔는데 재밌네 from http://paigeblog.tistory.com/18 by ccl(A) rewrite - 2020-03-25 16:20:22

Angular2 시작하기

Angular2 시작하기 Angular2 시작하기 1. NodeJS 설치 - https://nodejs.org/ko/ NodeJS 공식 홈페이지 접속하여 Node를 다운 후 설치. 2. NPM 을 통한 Angular-Cli 설치 Window Command 를 통하여 npm install -g @angular/cli 명령어를 실행한다. 위와 같이 정상적으로 angular-cli 가 설치되었다면 Project 가 위치할 폴더를 생성. 참고 사이트 : https://cli.angular.io/ 3. Angular-cli 를 통한 Angular Project 생성. Window Command 를 통한 ng new [폴더명] 위와 같이 Angular 기본 프로젝트가 생성됨. 해당 프로젝트로 폴더로 이동하여 ng serve 명령어 실행 Node 를 통해 Angular 프로젝트 실행. http://localhost:4200 접속하게되면 위와같이 Angular 프로젝트 실행된다. 앞으로 Angular2 의 개념들을 포스팅하면서 Spring-Boot , Spring Project의 Angular-cli 를 이용하여 ng build 하여 포팅하는 글을 올리겠습니다. from http://overclassbysin.tistory.com/3 by ccl(A) rewrite - 2020-03-07 07:55:13