문의를 보내주셔서 감사합니다! 팀원이 곧 연락드리겠습니다.
예약을 보내주셔서 감사합니다! 저희 팀 멤버 중 한 분이 곧 연락드리겠습니다.
코스 개요
소개
- Angular이란?
- Angular, React, Vue의 비교
- Angular 17의 주요 기능과 아키텍처 개요
- 개발 환경 설정 방법
시작하기
- Angular CLI를 사용해 새로운 Angular 17 프로젝트 생성하기
- 프로젝트 구조와 파일 구성 살펴보기
- 애플리케이션 실행 및 서비스 시작 방법
- 인터폴레이션과 표현식을 활용해 데이터 표시하기
컴포넌트
- Angular 17에서 컴포넌트의 역할 이해하기
- 컴포넌트 생성 및 사용 방법
- 입력값과 출력값을 이용해 컴포넌트 간에 데이터 전달하기
- 컴포넌트 생명주기 훅 활용법
디렉티브
- 구조적 디렉티브와 속성형 디렉티브의 차이점 이해하기
- ngIf, ngFor, ngSwitch 등 기본 제공되는 디렉티브 사용 및 생성 방법
- 사용자 정의 디렉티브 제작 및 활용법
파이프
- Angular 17에서 파이프의 용도 이해하기
- date, currency, json 등 기본 제공되는 파이프 사용 및 생성 방법
- 사용자 정의 파이프 제작법
서비스
- Angular 17에서 서비스의 역할 이해하기
- 서비스 생성 및 활용 방법
- 제공자(Provider)를 이용한 의존성 주입 처리
모듈
- Angular 17에서 모듈의 역할 이해하기
- 모듈 생성 및 사용 방법
- 모듈 간 가져오기와 내보내기 처리
데이터 바인딩
- 단방향 및 양방향 데이터 바인딩의 차이점 이해하기
- 프로퍼티 바인딩, 이벤트 바인딩, banana-in-a-box 문법 활용 방법
- 템플릿 참조 변수 사용법
라우팅
- Angular 17에서 라우팅의 역할 이해하기
- 라우트 생성 및 설정 방법
- routerLink와 router.navigate()을 이용해 경로 간 이동하는 법
- 경로 매개변수, 쿼리 파라미터, 프래그먼트 활용법
폼
- 템플릿 기반 폼과 반응형 폼의 차이점 이해하기
- form controls, form groups, form arrays 등을 사용해 폼 생성 및 검증 방법
- required, minLength, maxLength와 같은 내장된 유효성 검사기 활용법
- 사용자 정의 유효성 검사기 제작법
HTTP 클라이언트
- Angular 17에서 HTTP 클라이언트의 역할 이해하기
- 백엔드 서비스와 통신하기 위한 HTTP 요청 생성 및 사용 방법
- 비동기 데이터 흐름을 처리하기 위해 Observable 활용법
- HTTP 요청 또는 응답을 수정하거나 처리하기 위한 인터셉터 활용법
새로운 선언적 제어 흐름 기능
- 조건부 렌더링, 반복 처리, 빈 컬렉션 관리 등 일반적인 작업을 간소화해주는 새로운 템플릿 제어 블록 문법 설명
- @if, @else, @switch, @case, @default, @for, @empty와 같은 신규 블록 사용 예시 제시
- *ngIf, *ngSwitch, *ngFor와 같은 기존 문법과의 비교 설명
- 새로운 제어 블록이 시그널 기반의 지역 무지연(zoneless) 애플리케이션 개발에 어떻게 도움이 되는지 설명
지연 로딩 블록 기능
- 웹 애플리케이션의 성능과 사용자 경험을 향상시키는 지연 로딩 개념 설명
- 해당 블록의 콘텐츠와 종속 항목들을 필요할 때만 로드하도록 해주는 새롭은 @defer 제어 블록 소개
- 컴포넌트, 디렉티브, 파이프, 애니메이션, 스타일 등 다양한 요소에 @defer 블록을 적용하는 예시 설명
- @defer 블록과 새로운 뷰 전환 API 간의 연동 방식 설명
뷰 전환 API
- 뷰 간 애니메이션 및 전환 효과를 맞춤 제작할 수 있게 해주는 뷰 전환 API의 목적과 장점 설명
- 뷰 전환 API 사용을 활성화해주는 새로운 withViewTransitions 지시자 소개
- fade, slide, zoom, flip 등 다양한 전환 효과를 withViewTransitions와 함께 적용하는 예제 제시
- Angular 라우터 및 브라우저 히스토리 시스템과 뷰 전환 API의 연동 방식 설명
기타 기능 및 개선 사항
- Angular 17에서 새로 제공되는 기타 주요 기능과 개선점 간략 요약:
- @Component.styles 속성을 문자열 형태로 전달하는 기능 지원
- Angular의 애니메이션 관련 코드가 지연 로딩 가능하도록 변경됨
- TypeScript 5.2와의 호환성 제공
- 핵심 시그널 API가 이제 안정화 단계에 진입함
- Node.js v16 지원이 중단되었으며 최소 요구 버전은 v18.13.0임
- Esbuild가 기본 빌더로 채택되었으며 개발 서버는 Vite를 사용하게 됨
요약 및 향후 진행 방향
요건
- HTML, CSS, JavaScript에 대한 이해가 필요합니다
- TypeScript와 RxJS 사용 경험이 있으면 좋습니다
- 웹 개발 실무 경험도 유용합니다
수강 대상
- Angular 17을 활용해 동적이고 반응형인 웹 애플리케이션을 제작하고자 하는 개발자들
- 이전 버전의 Angular에서 업그레이드하여 실력을 향상시키고자 하는 개발자들
- Angular 17에 새로 추가된 기능과 개선 사항들을 탐구해보고 싶은 프로그래머들
28 시간
회원 평가 (2)
저는 주로 훈련 과정을 좋아했습니다. 그녀는 주제를 설명하고, 주제의 끝 부분에서는 우리에게 잘 정의된 실습 세션을 제공했습니다. 실습 세션에서 우리가 직면한 문제들을 신속하게 안내할 수 있었습니다.
Rabin Byanjankar - Lument
코스 - Angular 17
기계 번역됨
매우 대화식이고 정보가 충실했습니다. 트레이너는 우리가 이해하지 못할 때 매우 인내심을 갖고 있었으며, 교육 과정에서 아무도 뒤처지지 않도록 확신했습니다.
Daniel - INIT Innovations in Transportation Ltd.
코스 - Angular 17
기계 번역됨
