Svelte
AppPaaS가 지원하는 프레임워크 Svelte에 대해 설명합니다.
1. 개요
Svelte는 Vue, React, Angular과 달리 적은 코드로 다른 프론트엔드 프레임워크와 동일한 애플리케이션을 제작 할 수 있는 장점을 보유하고 있습니다. Virtual DOM을 사용하지 않아 런타임 패키지가 존재하지 않으며 컴파일 결과물의 용량이 줄어들기 때문에 SPA의 단점을 최소화 할 수 있는 장점이 있습니다.
AppPaaS에서는 Svelte 4, Sveltekit 2, Node 20을 지원합니다.
AppPaaS Svelte 배포를 위해서는 아래와 같은 사전 작업이 필요합니다.
프로젝트 Root 디렉토리에 adapter-node 설치
npm i -D @sveltejs/adapter-node
svelte.config.js 파일 생성 (아래 코드는 생성 된 svelte.config.js 입니다.)
2. 서비스 환경설정
내부 포트 서비스가 배포된 후 리슨되는 포트를 의미합니다. 3000 포트가 사용되며 소스 내에서 해당 포트를 변경했을 경우 변경한 값을 입력해 주어야 합니다. AppPaaS Beta에서는 해당 포트를 기반으로 TCP 헬스체크를 합니다.
외부 포트, 외부 포트 공개 여부 서비스를 퍼블릭으로 오픈할지 여부를 결정하는 설정입니다. 기본으로 443, 오픈으로 설정되어 있으며 오픈 설정 시 외부 도메인이 할당되어 https://{할당된 주소}를 통해 외부에서 접근할 수 있습니다. 비공개로 설정할 경우 외부에서 접근이 불가능하며 내부 도메인 주소로 서비스 간 통신만 지원됩니다.
자동 배포 설정 자동 배포를 설정하면 리포지터리의 선택한 브랜치에 변경이 생길 경우 변경에 대한 훅을 받아 자동으로 빌드 및 배포가 진행됩니다.
3. 고급 환경설정
빌드 명령어 디폴트로
npm run build
가 수행됩니다. 수정이 필요할 경우 해당 값을 오버라이드 할 수 있습니다.설치 명령어 디폴트로
npm install
이 수행됩니다. 수정이 필요할 경우 해당 값을 오버라이드 할 수 있습니다.시작 명령어
node build
가 수행됩니다. 해당 값 역시 오버라이드 할 수 있습니다.환경 변수 Key/Value 형태로 입력되며 입력된 값은 컨테이너 OS의 환경 변수로 주입됩니다. 주입된 환경 변수는 코드 내에서 process.env을 통해 접근하여 사용할 수 있습니다.
Last updated