Sample React Plugin GitLab

Sample-React: WordPress Plugin with React Frontend (Developer Guide) This document provides a comprehensive, step-by-step guide for building a WordPress plugin named Sample-React with a React frontend. This includes Docker setup, React app integration, development hot reloading, and production build configuration. Prerequisites - Docker & Docker Compose installed (Optional) - Node.js & npm installed - WordPress development knowledge (for plugin side) - React.js development knowledge (for frontend side) 🗂️ Folder Structure Overview 🐳 Step 1: Docker Environment Setup Create docker-compose.yml in the root of the project: Run: Visit: - WordPress: http://localhost:8000 - PhpMyAdmin: http://localhost:8080 ⚛️ Step 2: Initialize React App Add Proxy for Dev Server In react-app/package.json, add: This allows API requests from React to reach the WordPress backend during development. 📦 Step 3: Create WordPress Plugin Create sample-react.php inside the plugin folder: 🧠 Step 4: Setup React Entry Edit HTML Root react-app/public/index.html Edit React App Entrypoint react-app/src/index.js 🔄 Step 5: Development Workflow (React Dev Server) - React dev server runs at: http://local