웹사이트 검색

GitHub Actions 및 Netlify를 사용하여 Node.js REST API용 CI/CD 파이프라인을 설정하는 방법

앱을 프로덕션에 자동으로 배포하고 릴리스 프로세스를 간소화하려면 이 워크플로를 설정하세요.

Netlify는 웹 호스팅 플랫폼이자 클라우드에서 웹 애플리케이션을 배포하고 관리하기 위한 포괄적인 도구 모음입니다.

그러나 그 기능은 이보다 훨씬 더 확장됩니다. 서버리스 기능을 사용하면 전용 서버 없이 서버 측 코드를 실행할 수 있습니다.

GitHub Actions를 사용하여 Netlify에 Node.js REST API를 배포하기 위해 CI/CD 파이프라인을 설정하는 방법을 살펴보세요.

GitHub Actions를 사용한 CI/CD 파이프라인: 개요

CI/CD(지속적인 통합 및 지속적인 전달) 파이프라인은 소프트웨어 애플리케이션이 프로덕션으로 배송되기 전에 거치는 일련의 순차적이고 자동화된 프로세스입니다.

일반적으로 CI/CD 파이프라인은 소스, 빌드, 테스트 및 배포 단계를 포함한 여러 주요 단계로 구성됩니다.

이러한 단계를 수동으로 수행하는 것도 가능하지만 자동화하면 다음과 같은 여러 가지 이점을 얻을 수 있습니다.

  • 인적 오류의 위험을 최소화합니다.
  • 출시 프로세스 속도를 높입니다.
  • 고품질 소프트웨어를 프로덕션 환경으로 배송하기 위한 일관된 워크플로우를 보장합니다.

GitHub 작업이란 무엇입니까?

GitHub Actions는 CI/CD 파이프라인을 자동화하기 위해 프로젝트 저장소에서 직접 워크플로를 코드로 정의하는 데 사용할 수 있는 사전 구축된 다양한 작업을 제공하는 GitHub 내에 통합된 도구입니다.

또한 특정 프로젝트 요구 사항에 맞게 사용자 정의 작업을 생성하여 번거로움 없이 애플리케이션을 제작하고 프로덕션 환경에 배포할 수 있습니다. GitHub Actions의 장점 중 하나는 끌어오기 요청 및 문제 추적과 같은 다른 GitHub 기능과 원활하게 통합된다는 것입니다.

이를 통해 필요할 때 CI/CD 파이프라인이 자동으로 트리거되도록 보장하는 새로운 커밋과 같은 특정 이벤트를 기반으로 워크플로를 트리거할 수 있습니다.

Node.js 프로젝트 설정

시작하려면 Express 웹 서버를 만들어야 합니다. 이렇게 하려면 로컬로 새 폴더를 만들고 터미널에서 디렉터리를 변경하세요.

mkdir express-netlify
cd express-netlify

다음으로 노드 패키지 관리자인 npm을 사용하여 package.json 파일을 만듭니다.

npm init -y

마지막으로 프로젝트에 필요한 종속성을 설치합니다.

npm install express netlify-lambda serverless-http

netlify-lambda 패키지는 서버리스 기능 테스트를 용이하게 하는 로컬 개발 서버 역할을 합니다. serverless-http는 Express.js 앱을 서버리스 기능 핸들러와 호환되는 형식으로 조정하는 데 도움이 됩니다.

Netlify는 본격적인 백엔드 애플리케이션 호스팅 및 실행에 대한 기본 지원을 제공하지 않습니다. 대신 백엔드 기능을 처리하기 위한 대체 솔루션으로 서버리스 기능을 제공합니다.

이러한 기능은 서버 측 로직을 관리하고, HTTP API 요청을 처리하고, 동적 콘텐츠를 제공하여 서버리스 패러다임 내에서 백엔드와 유사한 기능을 제공합니다.

GitHub 저장소에서 이 프로젝트의 코드를 찾을 수 있습니다.

익스프레스 웹 서버 생성

프로젝트 폴더의 루트 디렉터리에 dist, functions, src라는 세 개의 폴더를 만듭니다.

Express 서버를 설정하기 전에 dist 폴더에 빈 index.html 파일을 만듭니다. 이 파일은 Netlify가 Express 애플리케이션을 성공적으로 배포하고 API 경로를 제공할 수 있도록 하는 자리 표시자 역할을 합니다.

이제 src/app.js 파일을 만들고 다음 코드를 추가하세요.

const express = require("express");
const serverless = require("serverless-http");
const app = express();
const router = express.Router();
router.get("/", (req, res) => {
  res.send("hello world!")
});
app.use(`/.netlify/functions/app`, router);
module.exports = app;
module.exports.handler = serverless(app);

이 코드는 GET 요청을 처리하는 루트 URL에 대한 단일 경로를 사용하여 Express 서버를 정의합니다. app.use 함수는 경로의 미들웨어를 Express 애플리케이션에 등록하여 /.netlify/functions/app 경로에 대한 모든 HTTP 요청이 제대로 이루어지도록 보장합니다. 프로덕션 환경에서도 라우터에 의해 처리됩니다.

따라서 /api/auth와 같은 새 엔드포인트를 추가하면 /.netlify/functions/app/api/auth에서 액세스할 수 있습니다. 마지막으로 코드는 Express 애플리케이션과 서버리스 핸들러 기능을 내보냅니다.

이를 통해 서버의 로컬 테스트가 가능하고 Netlify에서 서버리스 기능으로 배포할 수 있습니다.

Netlify.toml 파일 정의

루트 디렉터리에 새 Netlify.toml 파일을 만들고 다음 코드를 추가합니다.

[build]
  base = "/"
  command = "npm run build"
  publish = "/dist/"
  functions = "functions/"
  [build.environment]
    NODE_VERSION = "16"
[functions]
  external_node_modules = ["express"]
  node_bundler = "esbuild"
[[redirects]]
  force = true
  from = "/api/*"
  status = 200
  to = "/.netlify/functions/app/:splat"
[[redirects]]
  from = "/*"
  status = 200
  to = "/index.html"

코드는 Netlify의 Express 앱에 대한 빌드 및 배포 구성 설정을 지정합니다. 여기에는 기본 디렉터리, 빌드 명령, 게시 디렉터리 및 함수 디렉터리와 같은 설정이 포함됩니다.

또한 HTTP API 요청의 라우팅을 관리해야 하는 리디렉션 설정을 정의하여 해당 요청이 Netlify 서버리스 기능으로 올바르게 전달되도록 합니다.

Package.json 파일 업데이트

package.json 파일을 열고 다음 명령을 스크립트 개체에 추가합니다.

  "scripts": {
    "start": "netlify-lambda serve src",
    "build": "netlify-lambda build src"
  },

다음 명령을 실행하여 애플리케이션을 로컬로 빌드하고 시작합니다.

npm run build
npm run start

서버는 포트 9000에서 시작됩니다. http://localhost:9000/.netlify/functions/app에 요청하여 Postman을 사용하여 API를 테스트할 수 있습니다.

마지막으로, Netlify에서 배포를 자동화하기 위해 GitHub Actions 워크플로를 설정하기 전에 GitHub에 저장소를 만들고 프로젝트 파일을 푸시하세요.

Netlify에 Express 애플리케이션 배포

먼저 GitHub Actions 워크플로를 구성하기 전에 Netlify에 API를 배포하세요. Netlify에 Express 앱을 배포하려면 다음 단계를 따르세요.

  1. Netlify로 가서 계정을 만들고 개요 페이지에 로그인하세요.
  2. 사이트 탭을 선택하고 클릭합니다.
  3. Git에서 가져오기 버튼을 클릭하고 Git 제공자 플랫폼으로 GitHub를 선택합니다. Netlify는 GitHub에 인증하여 계정과 프로젝트 저장소에 대한 액세스 권한을 부여하라는 메시지를 표시합니다.
  4. 표시된 저장소 목록에서 Express 프로젝트 저장소를 선택하십시오.

  5. 리포지토리를 선택한 후 배포 프로세스에 대한 빌드 설정을 구성해야 합니다. Netlify는 애플리케이션을 구축하는 데 사용되는 기술을 자동으로 감지하고 필요한 구축 설정으로 필드를 미리 채워 이 프로세스를 단순화합니다. 이 경우 빌드 명령, 게시 및 함수 디렉터리입니다.

  6. 마지막으로 사이트 배포 버튼을 클릭하여 프로세스를 완료합니다.

GitHub Actions 워크플로 만들기

프로젝트의 GitHub 저장소에서 작업 탭을 클릭하세요. 지속적 통합 섹션에서 Node.js 구성 워크플로를 선택하고 클릭합니다.

GitHub 편집기에서 파일 이름을 Netlify.yml로 바꾸고 상용구 Node.js 워크플로 코드를 삭제한 후 아래 코드를 추가합니다.

name: Build and Deploy to Netlify
on:
  push:
  pull_request:
jobs:
  build:
    runs-on: ubuntu-22.04
    steps:
      - uses: actions/checkout@v3
      # ( Build to ./dist or other directory... )
      - name: Deploy to Netlify
        uses: nwtgck/actions-netlify@v2.0
        with:
          publish-dir: './dist'
          production-branch: main
          github-token: ${{ secrets.GITHUB_TOKEN }}
          deploy-message: "Deploy from GitHub Actions"
          enable-pull-request-comment: false
          enable-commit-comment: true
          overwrites-pull-request-comment: true
        env:
          NETLIFY_AUTH_TOKEN: ${{ secrets.NETLIFY_AUTH_TOKEN }}
          NETLIFY_SITE_ID: ${{ secrets.NETLIFY_SITE_ID }}
        timeout-minutes: 1

워크플로 속성에 대한 분석은 다음과 같습니다.

  • on: 이 워크플로의 작업을 트리거하는 이벤트입니다.
  • 작업: 특정 작업이 실행되어야 하는 이벤트(빌드 및 배포 이벤트)를 지정합니다.
  • 실행: 작업을 위한 호스트 프로덕션 환경입니다.
  • 단계: 특정 작업을 수행하는 데 관련된 일련의 단계를 지정합니다.
  • with: 작업이 제대로 실행되는 데 필요한 인수를 정의합니다.
  • env: 워크플로에 필요한 환경 변수를 지정합니다.

마지막으로 이 파일에 대한 업데이트를 커밋합니다. GitHub는 워크플로를 자동으로 트리거해야 합니다.

그러나 초기 빌드에서는 워크플로에 필요한 비밀 변수(배포된 사이트 ID 및 Netlify의 인증 토큰)를 추가해야 하므로 오류가 발생합니다. Netlify의 사이트 설정으로 이동하여 사이트 ID를 복사하세요.

인증 토큰을 얻으려면 사용자 프로필 아이콘을 클릭하고 드롭다운 창에서 사용자 설정 옵션을 선택하세요. 설정 페이지에서 애플리케이션을 선택하고 새 액세스 토큰을 클릭하여 인증 토큰을 생성합니다.

GitHub 저장소의 환경 변수와 저장소 비밀 섹션 모두에 NETLIFY_SITE_ID 및 NETLIFY_AUTH_TOKEN이라는 두 가지 환경 변수를 추가합니다. 이렇게 변경한 후 워크플로를 다시 실행하세요. Netlify는 이 파이프라인을 사용하여 푸시한 모든 후속 변경 사항을 자동으로 배포합니다.

/.netlify/functions/app URL에 요청하여 Postman을 사용하여 API를 테스트해 보세요.

GitHub Actions 및 Netlify를 사용하여 CI/CD 파이프라인 구성

Netlify의 서버리스 기능을 활용하면 Netlify에서 클라이언트 측 기능과 백엔드 기능을 모두 포함하는 완전한 기능을 갖춘 웹 애플리케이션을 배포할 수 있습니다.

또한 GitHub Actions를 사용하여 애플리케이션용 CI/CD 파이프라인을 설정하면 빌드 및 배포 프로세스를 자동화하는 간소화된 접근 방식을 제공합니다. 이를 통해 아이디어 구상부터 출시 단계까지 원활하고 안정적인 개발 프로세스를 보장하는 워크플로를 정의할 수 있습니다.

관련기사: