ホームページ 開発ツール Git フロントエンド Gitlab プロジェクトを k8s に自動的にデプロイする方法

フロントエンド Gitlab プロジェクトを k8s に自動的にデプロイする方法

Mar 29, 2023 pm 12:44 PM

この記事では主に、フロントエンド プロジェクトを Kubernetes ベースのコンテナ環境に自動的にデプロイする方法を紹介します。ここでは、GitLab CI/CD を使用してこのプロセスを完了します。GitLab はコード管理、バージョン管理、コラボレーションのためのプラットフォームとして機能し、Kubernetes はコンテナ オーケストレーションとデプロイのためのツールとして機能します。これにより、フロントエンド開発プロセスがより効率的になり、便利。

  1. GitLab の構成

まず、GitLab でプロジェクトを作成し、Git リポジトリに関連付けます。次に、プロジェクト設定で CI/CD 機能をオンにし、使用するランナーを選択します。ここではGitLab Runnerをインストールし、GitLabのRunnerリストに登録してみます。

  1. GitLab Runner のインストールと構成

GitLab Runner のインストール プロセスは比較的簡単で、さまざまなシステムとプラットフォームのインストール ガイドに従うだけです。

インストールが完了したら、GitLab Runner を構成する必要があります。すでに Kubernetes クラスターがあると仮定して、クラスター上で実行されるように GitLab Runner を構成する必要があります。具体的な構成プロセスは次のとおりです:

① まず、ランナーの Kubernetes サービス アカウントを構成する必要があります。サービス アカウントには、クラスター内の Kubernetes API へのアクセスが承認されている必要があります。

② 次に、サービス アカウントを使用して API にアクセスするようにこのランナーを構成する必要があります。これを行うには、ランナーの構成ファイル (config.toml) に次のフィールドを設定する必要があります。

[[runners.kubernetes.volumes.host_path]]
      name = "docker"
      mount_path = "/var/run/docker.sock"
      host_path = "/var/run/docker.sock"
    [[runners.kubernetes.volumes.config_map]]
      name = "kube-config"
      mount_path = "/etc/kubernetes"
    [[runners.kubernetes.volumes.empty_dir]]
      name = "tls"
      mount_path = "/etc/gitlab-runner/certs"
    [[runners.kubernetes.volumes.secret]]
      name = "runner-secret"
      mount_path = "/etc/gitlab-runner"
ログイン後にコピー

このうち、kube-config は、次のフィールドに関連する構成マップの名前です。ランナー、runner-secret は、ランナーに関連するシークレットの名前です。

③ 最後に、Kubernetes で実行されているコンテナを使用できるように、GitLab Runner を更新して再起動する必要があります。次のコマンドを実行して、GitLab Runner を自動的に再起動します。

sudo gitlab-runner restart
ログイン後にコピー
  1. 自動デプロイメントの実現

構成済みの Runner を取得したら、自動デプロイメントの実装を開始できます。ここでは、.gitlab-ci.yml という名前のファイルを使用して CI/CD プロセスを定義します。

まず、Kubernetes でコンテナーを実行するときに使用する Dockerfile を定義する必要があります。この Dockerfile は、以下に示すように、Docker イメージを構築するときに使用されます。

FROM nginx:1.15.8-alpine

COPY dist /usr/share/nginx/html

COPY nginx/default.conf /etc/nginx/conf.d/
ログイン後にコピー

イメージは、ベース イメージとして nginx:1.15.8-alpine になります。フロントエンド ファイルをコピーします。 Nginx Default ディレクトリに移動し、アプリケーションが正常に実行できるように、デフォルトの Nginx 構成ファイルを置き換えます。

続いて、.gitlab-ci.yml ファイルで CI/CD プロセスを定義します。具体的には、このファイルでプロジェクトのビルド プロセスを宣言し、ビルドされた Docker イメージをコンテナー イメージ ライブラリにプッシュし、最後にこのイメージを Kubernetes で実行します。プロセスは次のとおりです。

stages:
  - build
  - release

build:
  stage: build
  script:
    - docker build -t registry.cn-hangzhou.aliyuncs.com/$CI_PROJECT_NAMESPACE/$CI_PROJECT_NAME:$CI_COMMIT_TAG .
    - docker login -u $DOCKER_USERNAME -p $DOCKER_PASSWORD registry.cn-hangzhou.aliyuncs.com
    - docker push registry.cn-hangzhou.aliyuncs.com/$CI_PROJECT_NAMESPACE/$CI_PROJECT_NAME:$CI_COMMIT_TAG
  only:
    - /^v\d+\.\d+(\.\d+)?(-\S*)?$/

release:
  stage: release
  script:
    - kubectl apply -f k8s/
  only:
    - /^v\d+\.\d+(\.\d+)?(-\S*)?$/
ログイン後にコピー

このファイルでは、まずプロセスに buildrelease の 2 つのステージがあることを宣言し、build# で# ビルドしてコンテナー イメージ ライブラリにプッシュするプロセスは # ステージで完了し、Kubernetes デプロイメント プロセスは release ステージで完了します。ここでは、タグがバージョン番号である Git コミットに対してのみ CI/CD プロセスを有効にすることに注意してください。

    アプリケーションのデプロイメント
最後に、アプリケーションを Kubernetes にデプロイします。

deployment.yml というファイルを使用してデプロイメントを完了します。このファイルは、Kubernetes でフロントエンド アプリケーションを実行するための Deployment オブジェクトを宣言します。

apiVersion: apps/v1
kind: Deployment
metadata:
  name: frontend-deployment
spec:
  replicas: 1 # 运行一个副本
  selector:
    matchLabels:
      app: frontend
  template:
    metadata:
      labels:
        app: frontend
    spec:
      containers:
        - name: frontend
          image: registry.cn-hangzhou.aliyuncs.com/wbbry/frontend:latest # 镜像名称
          imagePullPolicy: Always
          ports:
            - containerPort: 80 # 前端端口
ログイン後にコピー
このファイルでは、Deployment オブジェクトの

replicas 番号 (ここでは 1) を指定し、コンテナ イメージの名前とポート番号を宣言します。このデプロイメント ファイルが完了したら、Kubernetes コマンド ライン ツール (kubectl) を使用して Deployment オブジェクトを作成できます。

kubectl apply -f deployment.yml
ログイン後にコピー
この時点で、フロントエンド アプリケーションは Kubernetes 上で正常に実行できるはずです。

結論

この記事では、フロントエンド プロジェクトを Kubernetes ベースのコンテナ環境に自動的にデプロイする方法を紹介します。 GitLab CI/CD、Kubernetes、Docker の使用に焦点を当て、完全なデモを通じてデプロイメント プロセスを示します。この記事がフロントエンド開発エンジニアのお役に立てれば幸いです。

以上がフロントエンド Gitlab プロジェクトを k8s に自動的にデプロイする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

gitはgithubと同じですか? gitはgithubと同じですか? Apr 08, 2025 am 12:13 AM

gitとgithubは同じものではありません。 Gitはバージョン制御システムであり、GithubはGitベースのコードホスティングプラットフォームです。 GITはコードバージョンの管理に使用され、GitHubはオンラインコラボレーション環境を提供します。

Githubは学ぶのが難しいですか? Githubは学ぶのが難しいですか? Apr 02, 2025 pm 02:45 PM

Githubを学ぶのは難しくありません。 1)基本知識をマスターする:GitHubは、コードの変更と共同開発の追跡に役立つGitベースのバージョン制御システムです。 2)コア関数を理解する:バージョン制御は各提出を記録し、ローカル作業とリモート同期をサポートします。 3)使用方法を学びます:リポジトリの作成からコミットをプッシュする、ブランチの使用、リクエストをプルするまで。 4)一般的な問題を解決する:競合のマージやファイルの追加を忘れるなど。 5)最適化の練習:意味のある提出メッセージを使用し、ブランチをクリーンアップし、プロジェクトボードを使用してタスクを管理します。練習とコミュニティコミュニケーションを通じて、Githubの学習曲線は急ではありません。

MicrosoftはGitまたはGithubを所有していますか? MicrosoftはGitまたはGithubを所有していますか? Apr 05, 2025 am 12:20 AM

MicrosoftはGitを所有していませんが、Githubを所有しています。 1.GITは、2005年にLinus Torvazによって作成された分散バージョン制御システムです。2。Githubは、GITに基づくオンラインコードホスティングプラットフォームです。 2008年に設立され、2018年にMicrosoftに買収されました。

Git vs. Github:バージョンコントロールとコードホスティング Git vs. Github:バージョンコントロールとコードホスティング Apr 11, 2025 am 11:33 AM

Gitはバージョン制御システムであり、GithubはGitベースのコードホスティングプラットフォームです。 GITは、コードバージョンを管理し、ローカル操作をサポートするために使用されます。 GitHubは、問題の追跡やPullRequestなどのオンラインコラボレーションツールを提供しています。

履歴書にgitまたはgithubを置くべきですか? 履歴書にgitまたはgithubを置くべきですか? Apr 04, 2025 am 12:04 AM

履歴書では、ポジションの要件と個人的な経験に基づいて、GitまたはGithubを作成することを選択する必要があります。 1.位置にGITスキルが必要な場合は、Gitを強調表示します。 2。ポジションがコミュニティの参加を評価する場合は、Githubを表示します。 3.使用経験とプロジェクトのケースを詳細に説明し、完全な文で終了してください。

簡単な言葉でGitとは何ですか? 簡単な言葉でGitとは何ですか? Apr 09, 2025 am 12:12 AM

GITは、開発者がファイルの変更を追跡し、協力してコードバージョンを管理するのに役立つオープンソース分散バージョン制御システムです。そのコア関数には、1)レコードコードの変更、2)以前のバージョンへのフォールバック、3)共同開発、4)並列開発のためのブランチの作成と管理。

gitまたはgithubから始めるべきですか? gitまたはgithubから始めるべきですか? Apr 06, 2025 am 12:09 AM

GITから始めることは、バージョン制御原則を深く理解するためにより適しており、GitHubから始めることは、コラボレーションとコードホスティングに焦点を当てるのに適しています。 1.GITは、コードバージョン履歴の管理に役立つ分散バージョン制御システムです。 2。Githubは、Gitに基づいたオンラインプラットフォームであり、コードホスティングとコラボレーション機能を提供します。

HTMLにGitHubを使用する方法は? HTMLにGitHubを使用する方法は? Apr 07, 2025 am 12:13 AM

GitHubを使用してHTMLプロジェクトを管理する理由は、バージョン制御、共同開発、作品の提示のためのプラットフォームを提供するためです。特定の手順には次のものが含まれます。1。gitリポジトリの作成と初期化、2。htmlファイルを追加および送信します。3。githubにプッシュ、4。githubpagesを使用してWebページを展開します。さらに、GitHubは、HTMLプロジェクトの最適化とコラボレーションを支援するために、コードレビュー、発行、およびPullRequest機能もサポートしています。

See all articles