

기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

# AWS Step Functions Workflow Studio 작업
<a name="stepfunctions-workflowstudio"></a>

다음 섹션에서는에서 AWS Step Functions Workflow Studio를 사용하는 방법을 설명합니다 AWS Toolkit for Visual Studio Code. AWS Step Functions Workflow Studio에 대한 자세한 내용은 *AWS Step Functions* 개발자 안내서의 [워크플로 개발](https://docs.aws.amazon.com//step-functions/latest/dg/developing-workflows.html) 주제를 참조하세요.

## Workflow Studio 열기
<a name="w2aac17c55b9b5"></a>

다음 목록은 VS Code에서 Workflow Studio를 열 수 있는 다양한 경로를 설명합니다.

**참고**  
VS Code에서 Workflow Studio를 사용하려면 상태 머신 정의가 포함된 `Amazon State Language`(ASL) 파일의 확장자가 `asl.json`, `asl.yml` 또는 `asl.yaml`로 끝나야 합니다. AWS 도구 키트에서 새 상태 시스템 정의를 다운로드하거나 생성하는 방법에 대한 자세한 내용은이 사용 설명서의 [작업 AWS Step Functions](https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/building-stepfunctions.html) 주제에서 *상태 시스템 다운로드* 및 *상태 시스템 생성* 섹션을 참조하세요.
+  AWS 탐색기에서 상태 시스템 정의가 포함된 `ASL` 파일의 컨텍스트 메뉴(마우스 오른쪽 버튼 클릭)를 연 다음 **Workflow Studio에서 열기**를 선택합니다.
+ 상태 머신 정의가 포함된 `ASL` 파일이 열린 상태에서 VS Code 편집기 창의 탭 옆에 위치한 **Workflow Studio로 열기** 아이콘을 선택합니다.
+ 상태 머신 정의가 포함된 `ASL` 파일이 열린 상태에서 파일 상단에 위치한 CodeLens 명령 **Workflow Studio로 열기**를 선택합니다.
+ 상태 머신 정의가 포함된 `ASL` 파일을 닫았다가 다시 열면, 기본 Workflow Studio가 수동으로 비활성화되지 않는 한 파일이 Workflow Studio에서 자동으로 다시 열립니다.

## 설계 모드 및 코드 모드
<a name="w2aac17c55b9b7"></a>

Workflow Studio에는 상태 머신 정의가 포함된 `ASL` 파일로 작업하기 위한 두 가지 모드, **설계** 모드와 **코드** 모드가 있습니다. **설계** 모드는 프로토타입을 빌드할 때 워크플로를 시각화하는 그래픽 인터페이스를 제공합니다. **코드** 모드는 워크플로에서 `ASL` 정의를 보고, 쓰고, 편집할 수 있는 통합 코드 편집기가 있습니다.

**참고**  
설계 모드와 코드 모드의 각 UI 섹션에 대한 자세한 내용은 *AWS Step Functions* 개발자 안내서의 [Workflow Studio 사용](https://docs.aws.amazon.com//step-functions/latest/dg/workflow-studio.html) 주제를 참조하세요. 예를 들어 **Config 모드**와 같은 모든 Workflow Studio 기능을 AWS 도구 키트에서 사용할 수 있는 것은 아닙니다.

**설계** 모드 UI에는 다음의 이미지에 레이블이 붙여지고 설명된대로 7개의 주요 섹션이 있습니다.

1. 모드 버튼: **설계** 모드와 **코드** 모드 간 전환을 위한 버튼입니다.

1. 유틸리티 버튼: Worlkflow Studio에서 나가기, 워크플로 저장, 또는 `ASL` 정의를 JSON 또는 YAML 파일로 내보내기와 같은 작업을 수행하는 데 일련의 버튼입니다.

1. 디자인 도구 모음: 실행 취소, 삭제 및 확대와 같은 일반적인 작업을 수행할 수 있는 일련의 버튼이 포함됩니다.

1. 상태 브라우저: 워크플로 캔버스에 드래그 앤 드롭 상태가 포함된 브라우저입니다. 상태는 탭으로 구성되며 **작업**, **흐름** 및 **패턴**으로 정의됩니다.

1. Canvas 및 워크플로 그래프: 구성 상태를 삭제, 재구성 및 선택할 수 있는 워크플로의 시각적 렌더링입니다.

1. Inspector 패널: 캔버스에서 선택한 모든 상태의 속성을 보고 편집합니다. 캔버스 워크플로 그래프에서 선택한 상태에 따라 탭은 **구성**, **입력/출력**, **변수** 및 **오류 처리**에 대한 상태별 옵션으로 채워집니다.

1. 정보 링크: 도움이 필요하면 컨텍스트 정보가 포함된 패널을 엽니다. 패널에는 *AWS Step Functions* 개발자 안내서의 관련 주제에 대한 링크도 포함됩니다.

![\[AWS 도구 키트에 있는 Workflow Studio UI의 설계 모드\]](http://docs.aws.amazon.com/ko_kr/toolkit-for-vscode/latest/userguide/images/SFNWFS022025.png)


## 설계 중 단일 상태 테스트 사용
<a name="w2aac17c55b9b9"></a>

Workflow Studio 테스트 상태 UI에서 상태 머신의 개별 상태를 테스트할 수 있습니다. 여기에는 상태 입력을 제공하고, 변수를 설정하고, AWS SAM 및 CloudFormation 정의를 모두 대체하는 기능이 포함됩니다.

코드형 인프라(IaC), 리소스 정의 및 데이터 변환에 대한 자세한 내용은 *AWS Step Functions* 개발자 안내서의 [Step Functions 워크플로 빌드 AWS SAM 에 사용](https://docs.aws.amazon.com/step-functions/latest/dg/concepts-sam-sfn.html) 및 [Step Functions에서 JSONata로 데이터 변환 주제를 참조하세요](https://docs.aws.amazon.com/step-functions/latest/dg/transforming-data.html).

다음 절차는 Workflow Studio에서 테스트 상태 UI를 여는 방법을 설명합니다.

**테스트 상태 UI 열기**

1. Workflow Studio의 **설계** 모드 탭에서 캔버스로 이동하고 상태를 선택하여 **Inspector** 패널에서 엽니다.

1. **Inspector** 패널에서 **테스트 상태** 버튼을 선택합니다.

1. VS Code에서 **테스트 상태** UI가 열립니다.

테스트 상태 UI에는 **테스트 입력**, **인수 및 출력**, **상태 정의**의 세 가지 기본 탭이 있습니다. **입력 테스트** 탭에는 **상태 입력을** 제공하고, **변수를** 설정하고, AWS SAM 또는 CloudFormation 템플릿에서 **정의 대체**를 지정할 수 있는 3개의 추가 필드가 있습니다. **상태 정의** 탭에서 워크플로를 조정하고 다시 테스트할 수 있습니다. 테스트 실행이 완료되면 상태 머신 정의에 변경 사항을 적용하고 저장할 수 있습니다.

다음 스크린샷은 주제 리소스 정의를 포함하는 테스트 상태 UI를 보여줍니다.

![\[AWS 도구 키트의 Workflow Studio 테스트 상태 UI\]](http://docs.aws.amazon.com/ko_kr/toolkit-for-vscode/latest/userguide/images/SFNWFSteststate022025.png)


## 기본적으로 Workflow Studio 비활성화하기
<a name="w2aac17c55b9c11"></a>

기본적으로 Workflow Studio는 상태 머신 정의가 포함된 `ASL` 파일의 기본 편집기입니다. 로컬 `.vscode` 디렉터리에서 `settings.json` 파일을 수정하여 기본 설정을 비활성화할 수 있습니다. 기본적으로 Workflow Studio를 비활성화해도 이 주제의 *Workflow Studio 열기* 섹션에 나열된 방법을 통해 액세스할 수 있습니다.

VS Code에서 `settings.json` 파일을 편집하려면 다음 단계를 완료하세요.

1. VS Code에서 **option\$1shift\$1p** (Mac) 또는 **ctrl\$1shift\$1p** (Windows)를 눌러 **명령 팔레트**를 엽니다.

1. VS Code **명령 팔레트**에서 검색 필드에 **Open User Settings (JSON)**을 입력하고 목록에 옵션이 나타나면 해당 옵션을 선택합니다.

1. 편집기의 `settings.json`에서 파일에 다음 수정 사항을 추가합니다.

   ```
                   {
                       "workbench.editorAssociations": {
                       // Use all the following overrides or a specific one for a certain file type        
                       "*.asl.json": "default",
                       "*.asl.yaml": "default",
                       "*.asl.yml": "default"
                       }
                   }
   ```

1. `settings.json`에 변경 사항을 저장하고 VS Code를 새로 고침 하거나 다시 시작합니다.