본문 바로가기

앵귤러28

[RxJS / angular] RxJS 란? 제가 앵귤러를 처음 시작하고 느낀 몇 가지 어려움 중 하나가 RxJS 였던 것 같습니다. 이번 포스트를 시작으로 RxJS에 대해 개념부터 Angular에서의 사용법까지 차근차근 다뤄보도록 하겠습니다. RxJS는 무엇인가? RxJS는 Reactive Extensions for JavaScript의 약자입니다. 처음에 Reactive Extension은 마이크로소프트에서 Rx.NET으로 개발했습니다. 그 이후로 Java, Python, Ruby, JavaScript를 비롯한 여러 다른 언어로 구현되었습니다. RxJS를 이용하는 프레임워크로는 Angular, React, Vue가 있습니다. 물론 JavaScript와 TypeScript와 같은 언어와 함께 RxJS를 쓸 수 있습니다. RxJS의 공식문서에 따르.. 2022. 6. 16.
앵귤러 기초(Angular basic) 33. Angular CLI, ng new 생성 파일 AngularCLI에 대해 알아보고, CLI명령인 ng new로 프로젝트를 만들 때 생성되는 파일에 대해 알아보겠습니다. 이번 포스트는 아래 내용을 다루고 있습니다. Angular CLI란 Angular CLI 기본 문법 ng new사용법과 ng new로 생성된 파일들 알아보기 Angular CLI란 Angular CLI는 Angular에 대한 명령줄 인터페이스입니다. Angular CLI의 주된 목적은 Angular 애플리케이션 구축, Angular 파일 생성, 결과 애플리케이션 구축 및 서비스, 테스트 실행, 배포 준비 등을 지원하는 것입니다. 앵귤러 CLI 기본문법 앵귤러 CLI의 기본 문법은 아래와 같습니다. ng -- 예를 새로운 프로젝트를 작성할때는 아래와 같이 이용 합니다. ng new he.. 2022. 2. 12.
앵귤러 기초(Angular basic) 32. 공유 모듈(shared module) 공유 모듈을 만들고 모듈에서 이용해 보도록 하겠습니다. 이번 포스트는 아래 내용을 다루고 있습니다. 공유 모듈의 목적 공유 모듈 정의하기 공유 모듈 작성하기 공유 모듈의 목적 공유 모듈의 목적은 일반적으로 사용되는 기능 조각을 하나의 모듈로 정리하여 공유 모듈을 사용하는(import하는) 모든 모듈에서 사용할 수 있도록 내보내는 것(export) 입니다. 이를 통해 재사용 가능한 컴포넌트와 외부 모듈을 선택적으로 취합하여 통합 편의 모듈로 다시 export할 수 있습니다. 공유 모듈을 만들려면 모듈 파일인 SharedModule을 정의하고 공유된 조각이 이 모듈에 오도록 응용 프로그램의 조각을 재구성해야 합니다. 공유 모듈(Shared Module) 정의 공유 모듈을 사용하기 전의 기능 모듈인 Movie.. 2022. 2. 11.
앵귤러 기초(Angular basic) 29. 라우트 가드(route guard) 관리자 같은 특정 사용자만 특정 url에 접근해야 하는 경우가 있을 수 있습니다. 경로에 대해 접근을 제한하려고 할때 앵귤러에서는 어떻게 해야할까요? 혹은 입력 페이지를 작성한 후 다른 페이지로 이동할때 저장 여부는 어떻게 확인해야 할까요? 앵귤러의 라우팅 가드에 대해 알아 보겠습니다. 이번 포스트는 아래 내용을 다루고 있습니다. 라우트 가드 종류 CanActivate 가드 만들기 라우트 가드 종류 앵귤러 라우터는 경로 탐색을 보호하기 위한 CanActivate, 현재 경로에서 벗어나는걸 보호하기 위한 CanDeactivate, 경로를 활성화하기 전에 데이터를 프리패치 하기위한 Resolve, 비동기 라우팅 방지하기 위한 CanLoad등 여러가지 보호 기능을 제공하고 있습니다. 이번 포스트에서는 CanA.. 2022. 2. 8.