Setting Up Local WordPress Development

Duration: 60 minutes

Module 4: Session 1

Learning Objectives

Understand the importance of local development environments
Install and configure Local by Flywheel
Set up WordPress with XAMPP/MAMP
Get introduced to Docker for WordPress development
Compare different local development options
Create your first local WordPress site

Introduction

Local development is essential for WordPress developers. It allows you to build, test, and experiment with WordPress sites on your own computer without needing web hosting or affecting live sites.

💡

Why Local Development?

Local development is faster, safer, and free. You can break things without consequences, test plugins and themes, and work offline. It's the professional way to develop WordPress sites.

Local Development Options

graph TD A[Local Development Options] --> B[Local by Flywheel] A --> C[XAMPP] A --> D[MAMP/WAMP] A --> E[Docker] A --> F[Others] B --> B1[WordPress-specific] B --> B2[Easiest for beginners] B --> B3[Free & Pro versions] C --> C1[Cross-platform] C --> C2[Full stack] C --> C3[Manual WordPress install] D --> D1[Mac/Windows specific] D --> D2[Simple interface] D --> D3[Good for PHP development] E --> E1[Professional] E --> E2[Containerized] E --> E3[Scalable] F --> F1[DevKinsta] F --> F2[Laravel Valet] F --> F3[VirtualBox/Vagrant] style A fill:#0073aa,color:#fff style B fill:#21759b,color:#fff style E fill:#46b450,color:#fff

Comparison of Local Development Tools

Local by Flywheel (Recommended for Beginners)

What is Local?

Local (formerly Local by Flywheel) is a free, WordPress-specific local development application. It's the easiest way to get WordPress running on your computer.

Key Features

One-click WordPress installation
SSL supportfor https:// testing
Live Linkto share local sites temporarily
Multiple PHP versions(5.6, 7.0, 7.1, 7.2, 7.3, 7.4, 8.0, 8.1)
Multiple sitesmanagement
MailHogfor email testing
Database managementwith Adminer
Blueprintfor site templates

Installation Steps

graph LR A[Download Local] --> B[Install Application] B --> C[Launch Local] C --> D[Create New Site] D --> E[Choose Environment] E --> F[Set Credentials] F --> G[Access WP Admin] style A fill:#21759b,color:#fff style G fill:#46b450,color:#fff

Step-by-Step Installation

Download Local

# Visit the official website
https://localwp.com/

# Choose your operating system:
- Windows (64-bit)
- macOS (Intel or Apple Silicon)
- Linux (Ubuntu/Debian)

Install the Application
- Run the downloaded installer
- Follow installation wizard
- Accept terms and choose installation directory

Create Your First Site

# Site Setup
Site Name: my-first-wordpress
Local Site Domain: my-first-wordpress.local
Local Site Path: ~/Local Sites/my-first-wordpress

# Environment Setup
PHP Version: 8.0.22
Web Server: nginx
Database: MySQL 8.0.16

# WordPress Setup
WordPress Username: admin
WordPress Password: admin
WordPress Email: admin@example.com

XAMPP Setup

What is XAMPP?

XAMPP is a free, open-source cross-platform web server solution stack containing Apache, MySQL, PHP, and Perl. It requires manual WordPress installation but offers more flexibility.

XAMPP Components

Installing WordPress on XAMPP

Download and Install XAMPP

# Download from
https://www.apachefriends.org/

# Default installation paths:
Windows: C:\xampp
macOS: /Applications/XAMPP
Linux: /opt/lampp

Start Apache and MySQL

# Open XAMPP Control Panel
# Click "Start" for:
- Apache (Web Server)
- MySQL (Database Server)

# Verify at: http://localhost/

Create Database

# Access phpMyAdmin
http://localhost/phpmyadmin/

# Create new database
Database name: wordpress_local
Collation: utf8mb4_general_ci

Download and Extract WordPress

# Download WordPress
https://wordpress.org/download/

# Extract to:
Windows: C:\xampp\htdocs\wordpress
macOS: /Applications/XAMPP/htdocs/wordpress
Linux: /opt/lampp/htdocs/wordpress

Run WordPress Installation

# Navigate to
http://localhost/wordpress/

# Database Configuration
Database Name: wordpress_local
Username: root
Password: (leave blank for XAMPP)
Database Host: localhost
Table Prefix: wp_

MAMP Setup

What is MAMP?

MAMP (Mac, Apache, MySQL, PHP) is similar to XAMPP but originally designed for macOS. It now supports Windows too. MAMP provides both free and Pro versions.

MAMP vs MAMP Pro

Feature	MAMP (Free)	MAMP Pro
Virtual Hosts	Limited	Unlimited
Mobile Testing	❌	✅
Email Testing	❌	✅ (Mailhog)
Dynamic DNS	❌	✅
Snapshot Backups	❌	✅
Price	Free	$59

Docker Introduction

What is Docker?

Docker uses containerization to create isolated development environments. It's more advanced but offers the most flexibility and closest match to production environments.

graph TD A[Docker WordPress Stack] --> B[WordPress Container] A --> C[MySQL Container] A --> D[phpMyAdmin Container] A --> E[WP-CLI Container] B --> B1[PHP + Apache] B --> B2[WordPress Files] C --> C1[Database Server] C --> C2[Data Volume] D --> D1[Database UI] E --> E1[Command Line Tools] style A fill:#0073aa,color:#fff style B fill:#21759b,color:#fff style C fill:#00758f,color:#fff

Basic Docker WordPress Setup

# docker-compose.yml
version: '3.8'

services:
  wordpress:
    image: wordpress:latest
    ports:
      - "8080:80"
    environment:
      WORDPRESS_DB_HOST: db:3306
      WORDPRESS_DB_USER: wordpress
      WORDPRESS_DB_PASSWORD: wordpress
      WORDPRESS_DB_NAME: wordpress
    volumes:
      - ./wordpress:/var/www/html

  db:
    image: mysql:5.7
    environment:
      MYSQL_DATABASE: wordpress
      MYSQL_USER: wordpress
      MYSQL_PASSWORD: wordpress
      MYSQL_ROOT_PASSWORD: somewordpress
    volumes:
      - db_data:/var/lib/mysql

  phpmyadmin:
    image: phpmyadmin
    ports:
      - "8081:80"
    environment:
      PMA_HOST: db

volumes:
  db_data:

# Run with:
# docker-compose up -d

Choosing the Right Tool

Decision Matrix

Local Development Best Practices

Use Version Control:Initialize Git in your local WordPress projects
Match PHP Versions:Use the same PHP version as your production server
Regular Backups:Export your local databases regularly
Consistent URLs:Use .local or .test domains for local sites
Security:Use strong passwords even in local development
Documentation:Document your local setup and configurations
Testing:Test with debugging enabled (WP_DEBUG = true)

Common Local Development Workflow

1. Set Up Local Environment
   └── Install Local by Flywheel
   └── Create new WordPress site
   └── Configure PHP version and database

2. Development Process
   └── Clone or create theme/plugin
   └── Enable debugging in wp-config.php
   └── Install development plugins (Debug Bar, Query Monitor)
   └── Make changes and test locally

3. Version Control
   └── Initialize Git repository
   └── Create .gitignore for WordPress
   └── Commit changes regularly
   └── Push to GitHub/GitLab/Bitbucket

4. Database Management
   └── Export local database
   └── Search/replace local URLs
   └── Import to staging server
   └── Test on staging

5. Deployment
   └── Push code to production
   └── Migrate database if needed
   └── Clear caches
   └── Verify functionality

Troubleshooting Common Issues

Port Conflicts

# Check if port 80 is in use (Apache)
Windows: netstat -ano | findstr :80
Mac/Linux: sudo lsof -i :80

# Check if port 3306 is in use (MySQL)
Windows: netstat -ano | findstr :3306
Mac/Linux: sudo lsof -i :3306

# Solutions:
1. Stop conflicting services (Skype, IIS, etc.)
2. Change ports in configuration
3. Use Local (handles ports automatically)

Database Connection Errors

# Common wp-config.php settings
define('DB_NAME', 'wordpress');
define('DB_USER', 'root');      // XAMPP/MAMP default
define('DB_PASSWORD', '');       // Empty for XAMPP
define('DB_HOST', 'localhost');  // or 127.0.0.1

# For MAMP on Mac:
define('DB_HOST', 'localhost:8889');

File Permission Issues

# WordPress recommended permissions
Directories: 755
Files: 644
wp-config.php: 600

# Fix permissions (Mac/Linux)
find . -type d -exec chmod 755 {} \;
find . -type f -exec chmod 644 {} \;

Practice Exercise

Set up your first local WordPress development environment:

💻

Hands-On Setup

Install Local by Flywheel:
- Download fromlocalwp.com
- Install and launch the application
Create Your First Site:
- Site name: wordpress-dev
- Choose "Preferred" environment
- Username: admin, Password: admin
Explore WordPress:
- Access WP Admin
- View the site
- Create a test post
- Install a free theme
- Install a plugin
Database Exploration:
- Open Adminer from Local
- Browse WordPress tables
- View wp_posts table

Enable Debugging:

// In wp-config.php add:
define('WP_DEBUG', true);
define('WP_DEBUG_LOG', true);
define('WP_DEBUG_DISPLAY', false);

Practice Assignment

Complete the following tasks to master local WordPress development:

Environment Setup:
- Install Local by Flywheel
- Create 3 different WordPress sites
- Try different PHP versions
XAMPP Alternative:
- Install XAMPP
- Manually install WordPress
- Document the process
Site Configuration:
- Change permalink structure
- Install and activate 5 plugins
- Switch between 3 themes
- Create sample content (5 posts, 3 pages)
Database Practice:
- Export your database
- Create a database backup
- Explore database structure
Documentation:
- Write a setup guide for your environment
- List any issues you encountered and solutions
- Create a local development checklist

PHP WordPress Development

Course Progress