[typescript] Angular 기본 구조

Angular 애플리케이션의 기본 구조

Angular 애플리케이션을 개발할 때는 애플리케이션의 기본 구조를 이해하는 것이 중요합니다. 이 기본 구조를 이해하면 코드를 구성하고 유지보수하는 데 도움이 됩니다.

프로젝트 구조

Angular 프로젝트의 기본 구조는 다음과 같습니다.

my-app/
|- e2e/
|- node_modules/
|- src/
  |- app/
    |- app.component.html
    |- app.component.css
    |- app.component.ts
    |- app.module.ts
  |- assets/
  |- environments/
  |- index.html
  |- main.ts
  |- styles.css
|- angular.json
|- package.json

핵심 파일 및 폴더

  1. src/: 애플리케이션의 실제 코드와 리소스를 포함하는 기본 폴더입니다.
  2. src/app/: 애플리케이션의 주요 컴포넌트 및 모듈 파일이 들어 있는 폴더입니다.
  3. src/app/app.component.html: 애플리케이션 기본 레이아웃과 HTML 템플릿이 들어 있는 파일입니다.
  4. src/app/app.component.ts: 애플리케이션의 주요 컴포넌트 파일입니다.
  5. src/app/app.module.ts: 애플리케이션의 주요 모듈 파일입니다.
  6. src/assets/: 애플리케이션에서 사용하는 이미지, 폰트 등의 정적 자원을 포함하는 폴더입니다.
  7. src/environments/: 환경 설정 파일들을 포함하는 폴더입니다.
  8. src/main.ts: 애플리케이션 진입점 파일입니다.
  9. src/styles.css: 전역 CSS 파일입니다.

이러한 핵심 파일과 폴더는 Angular 애플리케이션의 기본 구조를 이해하는 데 도움이 됩니다. 각 파일과 폴더는 애플리케이션의 특정 기능이나 설정에 대해 중요한 역할을 합니다.