Как выглядит production разработка WEB на (react, php, docker, gihub)?

Ваш процесс разработки включает несколько важных частей:

1. Разделение кода на два репозитория: один для React (фронтенд), другой для PHP (бэкенд).
2. Использование Docker и Docker Compose для создания контейнеризированного окружения, которое включает в себя Nginx, PHP и базу данных.
3. Работа с GitHub для управления версиями вашего кода.

Давайте рассмотрим, как все эти части могут работать вместе.

• Разделение кода

Создайте два различных репозитория в GitHub, один для вашего кода на React и один для вашего кода на PHP. Это позволит вам отдельно управлять версиями каждого из этих проектов.

• Docker и Docker Compose

Docker позволяет вам создать изолированные контейнеры для каждого из ваших сервисов, так что вы можете быть уверены, что они будут работать в любой системе, на которой установлен Docker.
Docker Compose позволяет вам определить и запускать многоконтейнерные Docker-приложения. Ваш файл docker-compose.yml может выглядеть так:

 version: '3' 

services: 

  php: 

    build: 

      context: ./path-to-your-php-repo 

      dockerfile: Dockerfile 

    volumes: 

      - ./path-to-your-php-repo:/var/www/html 

    links: 

      - db 

  nginx: 

    build: 

      context: ./path-to-your-nginx-config 

      dockerfile: Dockerfile 

    ports: 

      - "80:80" 

    volumes: 

      - ./path-to-your-php-repo:/var/www/html 

    links: 

      - php 

  db: 

    image: mysql:5.7 

    environment: 

      MYSQL_ROOT_PASSWORD: root 

      MYSQL_DATABASE: dbname 

      MYSQL_USER: user 

      MYSQL_PASSWORD: password 

  frontend: 

    build: 

      context: ./path-to-your-react-repo 

      dockerfile: Dockerfile 

    volumes: 

      - ./path-to-your-react-repo:/app 

    ports: 

      - "3000:3000" 

 

Обратите внимание, что вы должны заменить path-to-your-php-repo и path-to-your-react-repo на реальные пути к вашим репозиториям.
Также обратите внимание, что вам потребуется Dockerfile для каждого из ваших сервисов. Вот примеры для PHP и React:
Dockerfile для PHP:

 FROM php:7.4-fpm 

WORKDIR /var/www/html 

COPY . . 

RUN docker-php-ext-install pdo_mysql 

 

Dockerfile для React:

 FROM node:12 

WORKDIR /app 

COPY package*.json ./ 

RUN npm install 

COPY . . 

EXPOSE 3000 

CMD ["npm", "start"] 

 

• Использование GitHub

Ваши разработчики могут клонировать оба репозитория и использовать docker-compose up для запуска всего окружения. Они могут вносить изменения в код и коммитить их в соответствующий репозиторий.

• CI/CD Pipeline

Вы можете использовать GitHub Actions или другую систему CI/CD для автоматического тестирования и развертывания вашего кода. При каждом пуше в ветку main или master (или при создании pull request) вы можете настроить вашу систему CI/CD так, чтобы она запускала ваши тесты и, если они проходят, развертывала ваш код на вашем сервере.
Пример рабочего процесса GitHub Actions для PHP и React может выглядеть так:

 name: CI 

 

on: 

  push: 

    branches: [ main ] 

  pull_request: 

    branches: [ main ] 

 

jobs: 

  build: 

    runs-on: ubuntu-latest 

 

    steps: 

    - uses: actions/checkout@v2 

 

    - name: Build Docker images 

      run: docker-compose build 

 

    - name: Run tests 

      run: docker-compose run php vendor/bin/phpunit # Replace with your test command 

 

Отдельные репозитории под клиент и под сервер. Клиент и сервер собираются каждый в свой отдельный Docker образ. В репу сервера положить docker-compose файл в котором это все запускается - два сервиса, клиент и сервер из своих образов.
На продакшен сервере поставить Kubernetes или тот же docker compose(может оказаться не очень хорошей идеей).
В CI для клиента и для сервера примерно одинаковый пайплайн нужно настроить - сборка образа, пуш образа в registry, рестарт с новым образом deployment'а в kubernetes/рестарт docker-compose.