SST 앱 만들기

이제 SST와 인프라스트럭처 코드 에 대한 배경 지식을 갖췄으니, 첫 번째 SST 앱을 만들어 보겠습니다!

[템플릿 SST 프로젝트][Template]{:target=”_blank”}를 사용할 예정입니다. 이 템플릿은 모노레포 설정이 잘 되어 있어 프론트엔드와 API를 체계적으로 관리할 수 있습니다.

[github.com/sst/monorepo-template][Template]{:target=”_blank”}로 이동한 후, Use this template > Create a new repository를 클릭하세요.

SST 모노레포 GitHub 템플릿 사용 스크린샷

저장소 이름을 지정하세요. 여기서는 notes로 지정했습니다. 그런 다음 Create repository를 클릭하세요.

새 GitHub 저장소 이름 지정 스크린샷

저장소가 생성되면 저장소 URL을 복사하세요.

Change indicator 작업 디렉토리에서 다음 명령어를 실행하세요.

$ git clone <REPO_URL>
$ cd notes

Change indicator 템플릿에서 앱 이름을 변경하세요.

$ npx replace-in-file '/monorepo-template/g' 'notes' '**/*.*' --verbose

Change indicator 의존성을 설치하세요.

$ npm install

기본적으로 템플릿은 API를 생성합니다. 루트의 sst.config.ts에서 이를 확인할 수 있습니다.

/// <reference path="./.sst/platform/config.d.ts" />

export default $config({
  app(input) {
    return {
      name: "notes",
      removal: input?.stage === "production" ? "retain" : "remove",
      home: "aws",
    };
  },
  async run() {
    await import("./infra/storage");
    const api = await import("./infra/api");

    return {
      api: api.myApi.url,
    };
  },
});

앱 이름은 notes로 지정했습니다. IaC(Infrastructure as Code)에서 주의할 점은 앱을 배포한 후 이름을 변경해도 이전에 생성된 리소스의 이름이 바뀌지 않는다는 것입니다. 이전 앱을 제거하고 새 이름으로 다시 배포해야 합니다. 이에 대한 자세한 내용은 SST 워크플로우를 참고하세요.

프로젝트 구조

SST 앱은 두 부분으로 구성됩니다.

infra/ — 앱 인프라

서버리스 앱의 인프라를 정의하는 코드는 프로젝트의 infra/ 디렉토리에 위치합니다.
packages/ — 앱 코드

API가 호출될 때 실행되는 Lambda 함수 코드는 프로젝트의 packages/functions 디렉토리에 위치합니다. packages/core는 비즈니스 로직을 포함하고, packages/scripts는 일회성 스크립트를 위한 공간입니다.

나중에 React 앱을 위한 packages/frontend/ 디렉토리를 추가할 예정입니다.

시작 프로젝트는 간단한 Hello World API를 정의합니다. 다음 장에서는 이를 배포하고 로컬에서 실행해 볼 것입니다.

SST 앱 만들기

프로젝트 구조

SST Guide