기저귀 갈면서 코딩해야 프로다!

Angular는 화면을 구성하는 최소 단위가 컴포넌트입니다. 클라이언트에게 보이는 최종 화면은 하나의 html로 보이지만, 내부적으로는 여러 개의 컴포넌트들로 이루어져 있을 수 있습니다. 따라서 컴포넌트 간에 데이터를 교환해야 하는 이슈가 발생할 수 있습니다.  이번 장에서는 컴포넌트간에 데이터를 교환하는 방법에 대해 알아보겠습니다. 부모 -> 자식 컴포넌트로의 데이터 전달 parent, child 컴포넌트 2개를 생성합니다. $ ng…

앞서 환경이 구축되었다는 가정하에 Angular 프로젝트를 생성합니다. 터미널에서 ng명령어를 통해 Angular 프로젝트를 생성하고 아래와 같이 서버를 실행합니다. // ng new 프로젝트명(소문자와 '-'만 이용하여 생성) $…

Angular란? Node기반의 완전하고 독립적인 웹 프런트 프레임워크로서, 체계적이고 구조화된 개발 방법 및 환경을 제공합니다. 기존의 웹 개발은 백엔드 서버와 강 결합된 상태의 템플릿 엔진 기반의 개발 방법이 주류였습니다. 웹 개발 환경은 꾸준히 발전해 왔지만 이러한 백엔드 서버의 부가적인 요소로서의 웹 개발은 비효율 적이고, 백엔드 서버의 바운더리 안에서는 더 이상 발전하기 힘든 상황에 직면하였습니다.  Angular를 비롯한 여러 가지 프런트 프레임워크의 주요 목표 중 하나는 html, javascript, css를 통한 웹 개발 시 백엔드 개발 이상의 개발 생산성을 확보하는 것입니다. Angular를 사용하면 개발면에서 상당히 논리적이고 편리한 개발환경을 제공한다는 것을 알 수 있습니다.  뭐가 다른가? 웹 개발을 위한 전용 프레임워크로서, node 기반으로 서버가 실행되며 별도의 백엔드 서버의 부가 요소로서 개발환경을 구성하지 않습니다.(ex. Spring-Freemarker-tomcat) npm명령을 제공하여 쉽게 개발 환경을 구축할 수 있어 기존의 환경보다 놀라운 접근성을 제공합니다.  html, css, typescript 파일로 구성되는 컴포넌트 생성을 통해 기능에 따라 웹 화면을 완전히 독립적으로 실행되는 모듈로 만들 수 있습니다.  Typescript의 사용을 통해 여러 가지 이점을 가지고 개발할 수 있습니다. ( 컴파일을 통한 실행 전 오류 검출, 클래스, 인터페이스, 상속 등 객체지향 프로그래밍 지원, 타입 지정을 통해 데이터의 타입에 따른 오류 처리가 필요 없고, 타입 유추가 가능하여 컴파일 단 오류 검출이 가능.) 막강한 자동완성 기능을 제공하여 웹 개발 시 생산성을 향상할…