Angular 초기 설정

* 영어표기가 디폴트, 이하 한글표기

* Angular 기준

* 기존에 정리해두었던 내용이 산만한 듯 하여 새로 작성합니다.

---

0. Angular 가 뭔가요

    - 컴포넌트 구조로 웹 애플리케이션을 만드는 프레임워크

     - TypeScript 사용

     - 컴포넌트가 뭔지? (https://seo-developer.tistory.com/90 / 제일 상단 참고)

 

---

 

1. Angular 시작하기

    0). Node.js (Node.js (nodejs.org)) / node js 버전 6.9.0 이상

          -  https://nodejs.org/en

          - JavaScript 엔진으로 빌드된 JavaScript 런타임

          - Angular Cli 를 설치하기 위해 필요함

          - 네트워크 애플리케이션 개발에 사용되는 소프트웨어 플랫폼

          - 설치된 버전을 확인하려면 명령어 프롬프트(cmb)창을 열어서 명령어 입력

              node -v (Node), npm -v(npm)

node -v (Node), npm -v(npm)

 

 

     1). Angular Cli

          - https://angular.dev/tools/cli

          - 앵귤러 기초 명령어 툴 (앵귤러에 대한 명령줄 인터페이스)

npm install -g @angular/cli

 

---

 

2. 주요 명령어

버전 확인	ng serve		설치된 앵귤러의 버전 확인
신규 프로젝트 생성	ng new (projectName)		신규 프로젝트 생성(projectName)
	ng new (projectName) --skip-tests=true		신규 프로젝트 생성, 스펙파일(테스트 용) 생략
	ng new --standalone=false		https://seo-developer.tistory.com/90 참고
서버 오픈 (참고 - https://www.angular.kr/cli/serve)	ng serve, ng s	-o	서버 오픈	구동 시 브라우저 열기
		--allowed-hosts		접근 허용한 호스트 - ip목록
		--disable-host-check		접근 허용하지 않은 호스
		--host 000.000.0.00		ip 000.000.0.00 (내부망 - 같은 인터넷 공유 시 접근가능)
		--port 5000		port 5000 (내부망 - 같은 인터넷 공유 시 접근가능)
새 컴포넌트 생성	ng generate component (componentName) ng g c (componentName)		신규 컴포넌트 생성 확장 (Angular Files - https://marketplace.visualstudio.com/items?itemName=alexiv.vscode-angular2-files) 사용하면 편합니다.
...

 

 

---

 

 

3. 제가 겪었던 당황할만한 상황

    1). 신규 프로젝트 생성하고 서버 오픈 했는데 에러뜸

           - 서버를 오픈한 경로가 맞지 않아서 발생하는 문제

             - 앵귤러 cli 가 설치된, 우리가 생성한 프로젝트로 경로를 이동해준 뒤 서버 오픈하면 됩니당 

 

나는 따라만 했을 뿐이다.

 

cd .\(생성된 프로젝트 이름)

또는 cd (탭을 눌러 생성한 프로젝트 이름 선택)

 

 

host 나 port 를 따로 지정하지 않으면 http://localhost:4200/ 로 서버가 오픈됩니다.

 

 

 

 

 

다들 앵귤러 고수가 되어주세요.

그리고 저도 좀 가르쳐주세요.