migrate to ci-templates

.drone.yml

@@ -1,89 +1,59 @@
+## Universal .drone.yml for all project types
+## Configure your project via service.yaml (see ci-templates/docs/requirements.md)
+
 kind: pipeline
 type: kubernetes
-name: deploy-frontend
+name: ci
-
-# Триггеры: запускать на push в ветки main и develop
-trigger:
-  branch:
-    - master
-    - develop
-  event:
-    - push
 
 steps:
-# --- Шаг 1: Сборка и отправка образа в Harbor ---
+  - name: prepare
-# Этот шаг выполняется для любой из веток (main или develop)
+    image: alpine:3.19
-- name: build-and-push
+    environment:
-  image: plugins/docker
+      GITEA_TOKEN:
-  settings:
+        from_secret: GITEA_TOKEN
-    # Укажите ваш домен Harbor
+    commands:
-    registry: registry.vigdorov.ru
+      - apk add --no-cache git bash yq
-    # Имя репозитория в Harbor (например, в проекте library)
+      - git clone --depth 1 https://token:$GITEA_TOKEN@git.vigdorov.ru/vigdorov/ci-templates.git .ci
-    repo: registry.vigdorov.ru/library/examples-for-kids-app
+      - chmod +x .ci/scripts/*.sh
-    # Тег будет равен первым 7 символам хеша коммита (например, a1b2c3d)
+      - bash .ci/scripts/prepare.sh
-    tags:
-      - ${DRONE_COMMIT_SHA:0:7}
-    # Используем секреты, которые мы создали в Drone
-    username:
-      from_secret: HARBOR_USER
-    password:
-      from_secret: HARBOR_PASSWORD
 
-# --- Шаг 2: Развертывание в DEV-окружение ---
+  - name: build
-- name: deploy-dev
+    image: gcr.io/kaniko-project/executor:v1.23.2-debug
-  image: alpine/k8s:1.28.2 # Образ с kubectl и другими утилитами
+    depends_on: [prepare]
-  # Запускать этот шаг ТОЛЬКО для ветки 'develop'
+    environment:
-  when:
+      HARBOR_USER:
-    branch:
+        from_secret: HARBOR_USER
-      - develop
+      HARBOR_PASSWORD:
-  environment:
+        from_secret: HARBOR_PASSWORD
-    # Используем секрет с kubeconfig
+    commands:
-    KUBECONFIG:
+      - /busybox/sh .ci/scripts/build.sh
-      from_secret: KUBE_CONFIG
-  commands:
-    # Готовим переменные для dev-окружения
-    - 'export APP_NAMESPACE="dev-ns"' # Будем деплоить в отдельный неймспейс
-    - 'export HOSTNAME="dev_examples-for-kids.vigdorov.ru"'
-    - 'export IMAGE_TAG="${DRONE_COMMIT_SHA:0:7}"'
-    - 'export IMAGE_NAME="ci.vigdorov.ru/library/examples-for-kids-app"'
-    - 'export SECRET_NAME="wildcard-cert"'
-    # Создаем неймспейс, если его нет
-    - 'kubectl create namespace $APP_NAMESPACE --dry-run=client -o yaml | kubectl apply -f -'
-    # Заменяем метки в шаблонах на реальные значения и применяем
-    - 'sed -e "s|__IMAGE__|$IMAGE_NAME:$IMAGE_TAG|g" k8s/deployment.yaml | kubectl apply -n $APP_NAMESPACE -f -'
-    - 'kubectl apply -n $APP_NAMESPACE -f k8s/service.yaml'
-    - 'sed -e "s|__HOSTNAME__|$HOSTNAME|g" -e "s|__SECRET_NAME__|$SECRET_NAME|g" k8s/ingress.yaml | kubectl apply -n $APP_NAMESPACE -f -'
-    - 'echo "Deployed to DEV: https://$HOSTNAME"'
 
-# --- Шаг 3: Развертывание в PROD-окружение ---
+  - name: deploy
-- name: deploy-prod
+    image: alpine/helm:3.14
-  image: alpine/k8s:1.28.2
+    depends_on: [build]
-  # Запускать этот шаг ТОЛЬКО для ветки 'main'
+    environment:
-  when:
+      KUBE_CONFIG:
-    branch:
+        from_secret: KUBE_CONFIG
-      - master
+    commands:
-  environment:
+      - apk add --no-cache bash yq kubectl
-    KUBE_CONFIG_CONTENT:
+      - bash .ci/scripts/deploy.sh
-      from_secret: KUBE_CONFIG
+
-  commands:
+  - name: notify
-    # Создаем kubeconfig файл из секрета
+    image: appleboy/drone-telegram
-    - 'mkdir -p ~/.kube'
+    depends_on: [deploy]
-    - 'echo "$KUBE_CONFIG_CONTENT" > ~/.kube/config'
+    settings:
-    - 'chmod 600 ~/.kube/config'
+      token:
-    # Заменяем localhost на внешний IP сервера
+        from_secret: TELEGRAM_TOKEN
-    - 'sed -i "s|https://127.0.0.1:6443|https://10.10.10.100:6443|g" ~/.kube/config'
+      to:
-    # Готовим переменные для prod-окружения
+        from_secret: TELEGRAM_CHAT_ID
-    - 'export APP_NAMESPACE="prod-ns"'
+      format: markdown
-    - 'export HOSTNAME="examples-for-kids.vigdorov.ru"'
+      message: >
-    - 'export IMAGE_TAG="${DRONE_COMMIT_SHA:0:7}"'
+        {{#success build.status}}✅{{else}}❌{{/success}} **{{repo.name}}**
-    - 'export IMAGE_NAME="registry.vigdorov.ru/library/examples-for-kids-app"'
+        Branch: `{{commit.branch}}`
-    - 'export SECRET_NAME="wildcard-cert"'
+        {{commit.message}}
-    # Проверяем подключение к кластеру
+    when:
-    - 'kubectl cluster-info'
+      status: [success, failure]
-    # Создаем неймспейс
+
-    - 'kubectl create namespace $APP_NAMESPACE --dry-run=client -o yaml | kubectl apply -f -'
+trigger:
-    # Разворачиваем приложение
+  branch: [master, develop]
-    - 'sed -e "s|__IMAGE__|$IMAGE_NAME:$IMAGE_TAG|g" k8s/deployment.yaml | kubectl apply -n $APP_NAMESPACE -f -'
+  event: [push]
-    - 'kubectl apply -n $APP_NAMESPACE -f k8s/service.yaml'
-    - 'sed -e "s|__HOSTNAME__|$HOSTNAME|g" -e "s|__SECRET_NAME__|$SECRET_NAME|g" k8s/ingress.yaml | kubectl apply -n $APP_NAMESPACE -f -'
-    - 'echo "Deployed to PROD: https://$HOSTNAME"'

.gitignore

@@ -1,6 +1,6 @@
 /node_modules
 /.vscode
-/build
+/dist
 /coverage
 **/junit.xml
 .dependencies-cache

CLAUDE.md

@@ -30,13 +30,13 @@ examples-for-kids/
 ├── src/            # Исходный код
 ├── public/         # Статические файлы
 ├── coverage/       # Отчеты покрытия тестами
-├── k8s/            # Kubernetes манифесты
+├── service.yaml    # Конфиг для ci-templates
-├── Dockerfile      # Docker сборка
+└── .drone.yml      # CI/CD пайплайн (универсальный)
-└── .drone.yml      # CI/CD пайплайн
 ```
 
 ## Деплой
 
-- CI/CD через Drone
+- Тип: `web-frontend` (ci-templates)
-- Docker образ
+- Dockerfile, nginx.conf, Helm chart — предоставляются ci-templates автоматически
-- Kubernetes deployment
+- Конфигурация через `service.yaml`
+- Домен: examples-for-kids.vigdorov.ru

Dockerfile

@@ -1,14 +0,0 @@
-# build environment
-FROM node:18 as builder
-WORKDIR /app
-COPY package*.json ./
-RUN npm ci
-COPY . .
-RUN npm run build
-
-# production environment
-FROM nginx:alpine
-COPY --from=builder /app/build /usr/share/nginx/html
-COPY nginx.conf /etc/nginx/nginx.conf
-EXPOSE 80
-CMD ["nginx", "-g", "daemon off;"]

k8s/deployment.yaml

@@ -1,22 +0,0 @@
-apiVersion: apps/v1
-kind: Deployment
-metadata:
-  name: examples-for-kids-app
-spec:
-  replicas: 1
-  selector:
-    matchLabels:
-      app: examples-for-kids-app
-  template:
-    metadata:
-      labels:
-        app: examples-for-kids-app
-    spec:
-      imagePullSecrets:
-      - name: harbor-creds # Имя секрета, который мы создали на Шаге 1
-      containers:
-      - name: examples-for-kids-app
-        # __IMAGE__ - это метка, которую заменит Drone
-        image: __IMAGE__
-        ports:
-        - containerPort: 80

k8s/ingress.yaml

@@ -1,23 +0,0 @@
-apiVersion: networking.k8s.io/v1
-kind: Ingress
-metadata:
-  name: examples-for-kids-ingress
-spec:
-  ingressClassName: traefik
-  tls:
-  - hosts:
-    # __HOSTNAME__ - метка для домена
-    - __HOSTNAME__
-    # __SECRET_NAME__ - метка для имени секрета с сертификатом
-    secretName: __SECRET_NAME__
-  rules:
-  - host: __HOSTNAME__
-    http:
-      paths:
-      - path: /
-        pathType: Prefix
-        backend:
-          service:
-            name: examples-for-kids-app-service
-            port:
-              number: 80

k8s/service.yaml

@@ -1,11 +0,0 @@
-apiVersion: v1
-kind: Service
-metadata:
-  name: examples-for-kids-app-service
-spec:
-  selector:
-    app: examples-for-kids-app
-  ports:
-    - protocol: TCP
-      port: 80
-      targetPort: 80

nginx.conf

@@ -1,29 +0,0 @@
-events {}
-
-http {
-    include       /etc/nginx/mime.types;
-    default_type  application/octet-stream;
-
-    server {
-        listen 80;
-
-        location /stub_status {
-            stub_status on;
-            allow all;
-        }
-
-        location / {
-            root /usr/share/nginx/html;
-            index index.html;
-            try_files $uri $uri/ $uri.html =404;
-        }
-
-        location /assets/ {
-            root /usr/share/nginx/html;
-        }
-
-        location ~* \.(js|css|ico|png|jpg|jpeg|gif|svg|woff|woff2|ttf|eot)$ {
-            root /usr/share/nginx/html;
-        }
-    }
-}

service.yaml

@@ -0,0 +1,6 @@
+service:
+  name: examples-for-kids
+  type: web-frontend
+
+deploy:
+  domain: examples-for-kids.vigdorov.ru

webpack.config.js

@@ -8,7 +8,7 @@ module.exports = {
     entry: './src/script.js',
     output: {
         filename: 'main.js',
-        path: path.resolve(__dirname, 'build'),
+        path: path.resolve(__dirname, 'dist'),
     },
     devServer: {
         open: true,