Angular 14 버전을 사용하면서 ERROR ReferenceError: process is not defined 오류가 발생할 경우 해결 방법입니다. 설치 $ npm install --save-dev process 내용 추가 src/polyfill.ts 파일에 다음 내용을 추가합니다. (window as any).global = window; global.Buffer = global.Buffer || require('buffer').Buffer; global.process = require('process');
Angular 프레임워크로 특정 기능을 구현할 때 어떤 방식으로 사용하는지에 대해 알아보겠습니다. UI Component 구현 클래스에 @Component Annotation을 붙여서 생성합니다. HTML 템플릿 정의 인라인 HTML 코드를 사용할 때는 @Component 어노테이션 template 항목을 사용하고, 외부 파일에서 불러올 때는 templateUrl 항목을 사용합니다. 컴포넌트 Property 를 UI에 표시 템플릿의 이중 중괄호 안에 Property를 사용합니다. {{ customValue }}) 컴포넌트 Property 바인딩 대괄호를 사용해서 Property를 바인딩합니다. 이벤트 처리 이벤트 이름을 괄호로 감싸고 핸들러를 지정합니다. Click 양방향 바인딩 [()] 표기를 사용합니..
Angular는 구글이 만든 단일 페이지 웹 애플리케이션 개발을 위한 자바스크립트 프레임워크입니다. 다양한 플랫폼에서 동작할 수 있게 하는 개발 툴과 기능들을 제공합니다. Module 컴포넌트, 파이프, 서비스 등과 같은 앵귤러 애플리케이션의 주요 부분을 기능단위로 그룹핑하게 해 줍니다. 모든 앵귤러 애플리케이션은 하나의 Root Module을 가집니다. 여러 Feature Module을 가질 수 있습니다. 재사용할 수 있는 기능을 외부에 배포하기 위해 사용되기도 합니다. Component 빌딩 블록 형식 HTML 요소들의 그룹 뷰와 로직으로 구성 $ ng g component todo/todos --module todo/todo.module.ts --export 컴포넌트 내부에서 html, css 코드..
Angular는 Angular CLI를 이용해 프로젝트 관리의 복잡도를 낮추고 Angular 개발에만 집중할 수 있게 합니다. 설치 Angular CLI를 설치하려면 다음과 같은 npm 명령어를 실행합니다. $ npm install -g @angular/cli 설치가 완료되면 ng 명령어를 사용할 수 있습니다. ng 명령어는 Angular CLI에서 제공하는 기능들을 실행하는 역할을 담당합니다. Angular CLI 도움말 옵션을 사용해 확인해 봅니다. $ ng --help ng Commands: ng add Adds support for an external library to your project. ng analytics Configures the gathering of Angular CLI usa..
Angular 강좌 추천 작년에 Angular1 즉 AngluarJS를 Spring Framework + Spring JPA + MySQL 합쳐서 연동하여 개발을 하였었다. 그 때에 AngularJS를 처음 접해보았고, 제가 아는 분에게 배우기도 해서 일부분을 개발하다가 하나의 프로젝트를 처음부터 만들어 봤었다. 그 이후로 Angular를 사용하지 않았었는데, 지금 벌써 Angular 6 버전까지 나와서 놀랐다. 아래 URL은 Angular 6 은 아니지만 Angular 5 버전 강좌다. NodeJS 와 Typescript 가 대세여서 공부해보려고 하다가 Angular를 다시 보게 되어 찾다가 이 강좌가 설명이 너무 잘 되어 있어서 공부를 하는 중이다. 여러모로 감사합니다. URL: https://moo..