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 という新しいプロジェクトが作成され、ローカル開発サーバーが起動します。プロジェクトが正常に実行できることを確認したら、次のステップに進むことができます。

2. 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 アプリケーションを実行します。

3. Docker イメージの構築
   プロジェクトのルート ディレクトリで、次のコマンドを使用して Docker イメージを構築します:

   docker build -t my-react-app .

   これにより、名前付きの Docker イメージが構築されます。 Dockerfile ファイルの定義に基づいており、my-react-app のミラーです。

4. Kubernetes デプロイメント ファイルの作成
   次に、アプリケーションをデプロイするための Kubernetes デプロイメント ファイルを作成する必要があります。プロジェクトのルート ディレクトリで、deployment.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 というファイルを定義します。 app では、先ほど構築した my-react-app イメージを使用し、ポート 3000 に公開します。

5. アプリケーションを Kubernetes クラスターにデプロイする
   コマンド ラインで次のコマンドを使用して、アプリケーションを Kubernetes クラスターにデプロイします:

   kubectl apply -f deployment.yaml

   これは次のようになります。 deployment.yaml ファイルの定義に基づいて、Kubernetes クラスターに my-react-app という名前のデプロイメントを作成します。

6. アプリが適切に実行されていることを確認します
   次のコマンドを使用して、アプリが適切に実行されていることを確認できます:

   kubectl get pods

   すべてが正常な場合は、 「my-react-app's Pod is running」という名前のメッセージを確認してください。

7. アプリケーションへのアクセス
   最後に、サービスを通じてアプリケーションにアクセスできます。プロジェクトのルート ディレクトリで、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 中国語 Web サイトの他の関連記事を参照してください。