>웹 프론트엔드 >JS 튜토리얼 >React와 Kubernetes를 사용하여 안정적인 컨테이너형 애플리케이션을 구축하는 방법

React와 Kubernetes를 사용하여 안정적인 컨테이너형 애플리케이션을 구축하는 방법

WBOY
WBOY원래의
2023-09-26 09:07:411461검색

React와 Kubernetes를 사용하여 안정적인 컨테이너형 애플리케이션을 구축하는 방법

React 및 Kubernetes를 사용하여 안정적인 컨테이너형 애플리케이션을 구축하는 방법

클라우드 네이티브 기술의 급속한 발전으로 컨테이너형 애플리케이션은 오늘날 소프트웨어 개발에서 뜨거운 트렌드가 되었습니다. 널리 사용되는 프런트엔드 프레임워크인 React의 유연성과 효율성으로 인해 많은 개발자가 가장 먼저 선택합니다. 이 기사에서는 React와 Kubernetes를 사용하여 안정적인 컨테이너형 애플리케이션을 구축하는 방법을 소개하고 몇 가지 구체적인 코드 예제를 제공합니다.

  1. React 앱 만들기
    먼저 기본 React 앱을 만들어야 합니다. Create React App을 사용하여 새 React 프로젝트를 초기화할 수 있습니다. 다음 명령을 사용하세요.

    npx create-react-app my-app
    cd my-app
    npm start

이렇게 하면 my-app이라는 새 프로젝트가 생성되고 로컬 개발 서버가 시작됩니다. 프로젝트가 정상적으로 실행되는지 확인한 후 다음 단계를 계속할 수 있습니다.

  1. Dockerfile 작성
    React 애플리케이션을 컨테이너에 패키징하려면 Dockerfile을 생성해야 합니다. 프로젝트의 루트 디렉터리에 Dockerfile이라는 파일을 만들고 파일에 다음 콘텐츠를 추가합니다.

    # 使用Node镜像作为基础镜像
    FROM node:14-alpine
    
    # 将工作目录设置为/app
    WORKDIR /app
    
    # 将package.json和package-lock.json复制到容器中
    COPY package*.json ./
    
    # 安装应用的依赖
    RUN npm install
    
    # 将项目文件复制到容器中
    COPY . ./
    
    # 构建React应用
    RUN npm run build
    
    # 在容器中运行React应用
    CMD ["npm", "start"]

이 Dockerfile은 React 애플리케이션의 이미지를 빌드하고 실행하는 방법을 정의합니다. Node 기반의 Alpine 이미지를 사용하고, 먼저 프로젝트의 종속성을 설치한 다음 프로젝트 파일을 컨테이너에 복사하고 컨테이너에서 React 애플리케이션을 실행합니다.

  1. Docker 이미지 빌드
    프로젝트의 루트 디렉터리에서 다음 명령을 사용하여 Docker 이미지를 빌드합니다.

    docker build -t my-react-app .

    그러면 Dockerfile 파일의 정의에 따라 my-react-app이라는 이미지가 빌드됩니다.

  2. Kubernetes 배포 파일 만들기
    다음으로 애플리케이션을 배포하기 위한 Kubernetes 배포 파일을 만들어야 합니다. 프로젝트의 루트 디렉터리에서 배포.yaml이라는 파일을 만들고 파일에 다음 콘텐츠를 추가합니다.

    apiVersion: apps/v1
    kind: Deployment
    metadata:
      name: my-react-app
      labels:
     app: my-react-app
    spec:
      replicas: 1
      selector:
     matchLabels:
       app: my-react-app
      template:
     metadata:
       labels:
         app: my-react-app
     spec:
       containers:
       - name: my-react-app
         image: my-react-app
         ports:
         - containerPort: 3000

이 파일은 방금 만든 my-react를 사용하여 my-react-app이라는 배포를 정의합니다. -app 미러링되고 포트 3000에 노출됩니다.

  1. Kubernetes 클러스터에 애플리케이션 배포
    명령줄에서 다음 명령을 사용하여 애플리케이션을 Kubernetes 클러스터에 배포합니다.

    kubectl apply -f deployment.yaml

    이렇게 하면 다음에 정의된 대로 Kubernetes 클러스터에 my-react라는 새 애플리케이션이 생성됩니다. 배포.yaml 파일 - 앱 배포.

  2. 앱이 제대로 실행되고 있는지 확인하세요
    다음 명령을 사용하여 앱이 제대로 실행되고 있는지 확인할 수 있습니다.

    kubectl get pods

    모든 것이 정상이면 my-react-app이라는 이름의 Pod가 실행 중인 것을 볼 수 있습니다.

  3. 애플리케이션 액세스
    마지막으로 서비스를 통해 애플리케이션에 액세스할 수 있습니다. 프로젝트의 루트 디렉토리에서 service.yaml이라는 파일을 생성하고 파일에 다음 내용을 추가합니다.

    apiVersion: v1
    kind: Service
    metadata:
      name: my-react-app-service
    spec:
      selector:
     app: my-react-app
      type: LoadBalancer
      ports:
     - protocol: TCP
       port: 80
       targetPort: 3000

    이 파일은 외부에서 사용할 수 있는 my-react-app-service라는 서비스를 정의합니다. 요청은 당사로 전달됩니다. 로드 밸런서를 통해 애플리케이션을 실행합니다.

다음 명령을 사용하여 서비스를 생성합니다.

kubectl apply -f service.yaml

다음 명령을 실행하여 서비스의 외부 IP 주소를 가져옵니다.

kubectl get services

마지막으로 브라우저를 사용하여 애플리케이션을 열 수 있습니다.

http://<EXTERNAL-IP>

위 단계를 수행합니다. , 우리는 React와 Kubernetes를 성공적으로 활용하여 안정적인 컨테이너형 애플리케이션을 구축했습니다. React는 강력한 프런트엔드 개발 기능을 제공하고, Kubernetes는 안정적인 컨테이너 오케스트레이션 및 운영 환경을 제공합니다. 이들의 조합을 통해 우리는 컨테이너화된 애플리케이션을 쉽게 구축, 배포 및 관리할 수 있습니다.

이 기사가 여러분에게 도움이 되기를 바라며, 클라우드 네이티브 기술 개발을 계속해서 깊이 있게 배우고 탐구하는 데 도움이 되기를 바랍니다.

위 내용은 React와 Kubernetes를 사용하여 안정적인 컨테이너형 애플리케이션을 구축하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.