Рубрики
Uncategorized

Запуск приложения React на локальной кластере Kubernetes на Windows 10

Нажмите здесь для оригинальных предпосылок Post Poerquisites Docker Desktop WSL2 Backend не будет … Помечено с Куберанетами, реагировать, окна, Devops.

Нажмите здесь для оригинального поста

Предварительные условия

Не будет прикрывать процесс установки Docker Desktop и включить WSL2 Backend Здесь в этом блоге. Предположение состоит в том, что читатели могут понять процесс из данных ресурсов самостоятельно. Я мог бы охватить эти темы подробно, если в будущих блогах достаточно спроса.

Убедитесь, что вы работаете Контейнеры Linux Backend в Docker Desktop после установки его.

Minikube Start.

Миникуба Настройки локальной кластеры Kubernetes для разработки на локальном хосте (в данном случае Windows).

Поскольку мы будем использовать локальный докер изображения и обход необходимости подтолкнуть в реестр Docker, а затем указывать то же самое во время развертывания на Kubernetes, INSECURE-реестр = 10.0.0.0/24 используется.

Почему 10.0.0.0/24. ? Проверить

Запустите следующую команду, чтобы запустить локальную кластер Kubernetes в PowerShell (предпочтительно администратор PowerShell)

minikube start --insecure-registry="10.0.0.0/24"

Образец вывода

❯ minikube start --insecure-registry="10.0.0.0/24"

* minikube v1.18.1 on Microsoft Windows 10 Pro 10.0.21332 Build 21332
* Using the docker driver based on existing profile
* Starting control plane node minikube in cluster minikube
* Restarting existing docker container for "minikube" ...
* Preparing Kubernetes v1.20.2 on Docker 20.10.3 ...
* Verifying Kubernetes components...
  - Using image kubernetesui/dashboard:v2.1.0
  - Using image kubernetesui/metrics-scraper:v1.0.4
  - Using image gcr.io/k8s-minikube/storage-provisioner:v4
* Enabled addons: storage-provisioner, dashboard, default-storageclass
* Done! kubectl is now configured to use "minikube" cluster and "default" namespace by default

Создать приложение React

Убедитесь, что узел и NPM установлены в среде Windows

❯ node -v
v15.11.0

❯ npm -v
7.6.3

потом использовать NPX Create-ract-App Test-ract-app Чтобы создать тестовое реагирование

❯ npx create-react-app test-react-app
Need to install the following packages:
  create-react-app
Ok to proceed? (y) y

Creating a new React app in D:\work\test-react-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...

yarn add v1.22.4
[1/4] Resolving packages...
[2/4] Fetching packages...

Наконец, проверьте, что приложение работает как ожидалось

Настройка локальной среды Docker Minikube

Запустите следующую команду, чтобы установить локальную конфигурацию для облегчения итерации разработки, используя локальные изображения докера.

Примечание Это остается местным к вашему терминалу PowerShell, в котором мы запускаем следующую команду

& minikube -p minikube docker-env | Invoke-Expression

Для любого любопытных, беги Minikube Docker-Env чтобы увидеть фактические команды, которые получают бегать

❯ minikube docker-env
$Env:DOCKER_TLS_VERIFY = "1"
$Env:DOCKER_HOST = "tcp://127.0.0.1:52175"
$Env:DOCKER_CERT_PATH = "C:\Users\Naren\.minikube\certs"
$Env:MINIKUBE_ACTIVE_DOCKERD = "minikube"
# To point your shell to minikube's docker-daemon, run:
# & minikube -p minikube docker-env | Invoke-Expression

Докерейте приложение React

Простейший способ создания докера изображения приложения RACT — добавить следующие файлы в корню папки приложения (репозиторий в случае GIT)

Dockerfile

FROM node:10-alpine as build-step

RUN mkdir /app
WORKDIR /app
COPY package.json /app
RUN npm install
COPY . /app
RUN npm run build

FROM nginx:1.17.1-alpine
COPY --from=build-step /app/build /usr/share/nginx/html

.dockerignore.

/node_modules
/build
.git
*.md
.gitignore
Docker Создайте изображение
docker build -t test-react-app .
Проверьте наличие построенного изображения
❯ docker images test-react-app
REPOSITORY       TAG       IMAGE ID       CREATED              SIZE
test-react-app   latest    e81a494ead2b   About a minute ago   21.1MB

Kubernetes развертывание

А Развертывание и Сервис Ресурсы необходимы для развертывания приложения RACT на кластере Kubernetes. Мы можем комбинировать обе спецификации в одиночном Ямл Файл, отделяя их с помощью ----

  • Соблюдайте imagepullpolicy Атрибут, помеченный как никогда не указывает, что не смотрите на реестр Docker для потягивания изображение называется Тестовое реагирование
  • Также мы будем использовать простейшую Сервис называется NodePort Чтобы сопоставить порт узла в кластере Kubernetes к приложениям порт

Развертывание.ЯМЛ

kind: Deployment
apiVersion: apps/v1
metadata:
  name: test-react-app
spec:
  replicas: 1
  selector:
    matchLabels:
      app: test-react-app
  template:
    metadata:
      labels:
        app: test-react-app
    spec:
      containers:
        - name: test-react-app
          image: test-react-app
          imagePullPolicy: Never
          ports:
            - containerPort: 80
      restartPolicy: Always

---

kind: Service
apiVersion: v1
metadata:
  name: test-react-app
spec:
  type: NodePort
  ports:
    - port: 80
      targetPort: 80
      protocol: TCP
      nodePort: 32000
  selector:
    app: test-react-app
Развертывать

Мы используем Kubectl Apply -F Развернуть оба Развертывание и оказание услуг

kubectl apply -f .\deployment.yaml

Образец вывода

❯ kubectl apply -f .\deployment.yaml
deployment.apps/test-react-app created
service/test-react-app created
Проверьте работу стручка

Убедитесь, что используются Pods, использующие Kubectl Получить стручки

❯ kubectl get pods
NAME                             READY   STATUS    RESTARTS   AGE
test-react-app-9bf9cbcdb-h9zvj   1/1     Running   0          12s

Доступ к приложению React

Найти URL-адрес сервиса

Мы используем Миникуба Чтобы узнать URL-адрес сервиса для приложения развернутого реагирования

minikube service test-react-app --url

Образец вывода

❯ minikube service test-react-app --url
🏃  Starting tunnel for service test-react-app.
|-----------|----------------|-------------|------------------------|
| NAMESPACE |      NAME      | TARGET PORT |          URL           |
|-----------|----------------|-------------|------------------------|
| default   | test-react-app |             | http://127.0.0.1:62352 |
|-----------|----------------|-------------|------------------------|
http://127.0.0.1:62352
❗  Because you are using a Docker driver on windows, the terminal needs to be open to run it.
Откройте приложение в браузере

Местная приборная панель Kubernetes

Все время мы можем увидеть эффекты работы любого kubectl Команды в Кубернетах Местная приборная панель

minikube dashboard

Образец вывода

❯ minikube dashboard
🔌  Enabling dashboard ...
    ▪ Using image kubernetesui/dashboard:v2.1.0
    ▪ Using image kubernetesui/metrics-scraper:v1.0.4
🤔  Verifying dashboard health ...
🚀  Launching proxy ...
🤔  Verifying proxy health ...
🎉  Opening http://127.0.0.1:56135/api/v1/namespaces/kubernetes-dashboard/services/http:kubernetes-dashboard:/proxy/ in your default browser...

Открою приборную панель на новой вкладке

Очистка

Уборка Развертывание и Сервис используя следующую команду

kubectl delete -f .\deployment.yaml

Закрыть вниз Миникуба (локальный кластер K8S) и удалить

minikube stop
minikube delete

Оригинал: «https://dev.to/narenandu/running-a-react-app-on-local-kubernetes-cluster-on-windows-10-3mi6»

Читайте ещё по теме: