Introduction

To run a website locally you need a predictable environment that mirrors production and lets you build, test, and iterate quickly. Running a website on your laptop or desktop reduces deployment cycles, speeds up debugging, and keeps private work from public servers. For entrepreneurs and beginner developers, local websites let you prototype landing pages, test WordPress themes, or develop web apps before publishing.

js apps, and Dockerized workflows. You will find concrete times and checklists, free and paid tool choices, port numbers and host-file examples, and a short command cheat sheet. By the end you will be able to pick a path, install tools, and run a site locally in 10 minutes to a few hours depending on complexity.

Why it matters:

local development reduces mistakes, provides faster reloads (often under 1 second with hot reload), and prevents accidental commits to production. The instructions assume you use Windows, macOS, or Linux and will call out OS-specific notes when it matters.

Run a Website Locally

Overview: running a website locally means serving HTML, CSS, JavaScript, or server-side code from your own computer so a browser can access it via localhost or a mapped hostname. Typical uses include static landing pages, single-page applications, CMS testing, and full-stack app development.

What you need: a code editor, a local server or runtime, and optionally a database.

Editor: Visual Studio Code (free)
Static server: Python, nginx, Live Server extension
Runtime: Node.js for JavaScript servers; PHP and MySQL for classic stacks
Container engine: Docker for consistent builds

Key concepts:

localhost and ports: localhost points to 127.0.0.1. Common ports: 80 (HTTP), 443 (HTTPS), 3000 (React/Node), 8000/8080 (dev servers).
Host file mapping: add 127.0.0.1 mysite.test to map a custom local domain.
Environment parity: aim to match production’s runtime versions (Node.js LTS, PHP version, database engine) to avoid “works on my machine” problems.

When to use local development:

Building prototypes or MVPs (minimum viable product) in 10-120 minutes.
Developing themes or plugins for WordPress over hours to days.
Building APIs and SPA front-ends with continuous hot reload during development.

Example timeline:

Static HTML/CSS prototype: 10-30 minutes.
WordPress theme testing with Local by Flywheel: 10-20 minutes setup.
Node.js full-stack app with database: 2-6 hours initial setup.
Docker-based reproducible environment: 1-2 days for initial learning and setup.

Core Components:

servers, ports, hosts, and runtimes

What a local server does: it listens on a port, serves files or responds to API calls, and can proxy requests to other services. For static sites, a server serves files from a folder. js, PHP, Python) executes code and returns HTML or JSON.

Servers and ports:

Port numbers matter. Use port 80 for default HTTP or pick an available port like 3000 or 8080.
To run two servers, use different ports and configure reverse proxy if needed (nginx, Caddy, or Traefik).
Browser URL format: or http://mysite.test:8080.

Host file mapping (example):

On macOS/Linux: edit /etc/hosts with sudo permissions.
On Windows: edit C:\Windows\System32\drivers\etc\hosts as Administrator.

Example entry:

127.0.0.1 mysite.test

Runtimes and versions:

Match production versions. If production runs Node.js 18.x, install Node.js 18 LTS locally using nvm (Node Version Manager).
For PHP, use the same minor version: PHP 8.1 vs 8.2 can change behavior.
Use database dumps for realistic testing, but mask secrets.

Live reload and hot module replacement:

For static HTML/CSS, Live Server extension in Visual Studio Code reloads the page in under a second.
For React, Vue, or Svelte, the dev server typically offers hot module replacement (HMR) so changes update without a full reload.

Example numbers and resources:

Live Server saves ~30-60 seconds per refresh when editing CSS frequently.
Typical Node.js dev server uses port 3000; a simple Express app can respond in under 5 ms for static responses.

Security and networking:

Local servers are not exposed publicly by default, but when using tunneling tools (ngrok, localhost.run) your site becomes public. Use tokens and temporary URLs when necessary.
Avoid storing production API keys in local environment files. Use .env files and .gitignore.

Step-By-Step Setups:

static, PHP/WordPress, Node.js, and Docker

Static site (10-30 minutes)

Tools: Visual Studio Code (free), Live Server extension (free), Chrome or Firefox.

Steps:

Create folder project-root with index.html and styles.css.
Open folder in VS Code and install Live Server extension.
Right-click index.html and choose “Open with Live Server”. Default URL: or similar.

Checklist:

index.html present and named correctly.
No port conflicts; change Live Server port in settings if needed.

Example: a 5-page static prototype with basic CSS can be set up in 20 minutes and previewed on a mobile device via LAN IP.

PHP / WordPress local (20-60 minutes)

Tools: XAMPP (free), MAMP (free; MAMP Pro paid), Local by Flywheel (free), or Docker.

Steps with XAMPP:

Install XAMPP, start Apache and MySQL.
Place site in htdocs folder or configure virtual host.
Create MySQL database via phpMyAdmin (included).
Install WordPress and update wp-config.php with DB credentials.

Time: WordPress site can be running in 15-45 minutes using Local by Flywheel; 30-60 minutes using XAMPP if unfamiliar with Apache virtual hosts.

Example ports: Apache uses 80 and 443 by default, but XAMPP may use 8080 if port 80 is occupied.

Node.js app (30-90 minutes)

Tools: Node.js LTS (install via nvm), Visual Studio Code, npm or Yarn.

Quick start:

Install Node.js 18 LTS using nvm (Node Version Manager).
Create project folder and run npm init -y.
Install Express: npm install express
Create server.js and run node server.js or use nodemon for auto-restart.

Example commands:

Start a simple static server:

python -m http.server 8000

Start Node app with nodemon:

Typical ports: 3000 (React/Next dev server), 5000 or 8000 for APIs.

Docker-based (2-8+ hours)

Tools: Docker Desktop (free for personal use), docker-compose.

Why use Docker: consistent environment across teams and CI/CD.

Steps:

Write Dockerfile for app and docker-compose.yml to include services (app, db).
Build images and run docker-compose up -d.
Use docker exec to run migrations or seed data.

js + PostgreSQL stack with docker-compose takes 1-4 hours to set up if familiar, 1-2 days if new to Docker.

Use case: when you need exact production parity for native extensions or specific OS-level dependencies.

Best Practices and Testing

Match production as closely as possible but keep iteration fast. For early design work, a static server is faster. For final QA, use the same runtime versions and a staging environment.

Version control and branches:

Use Git for every project. Commit often and use branches for features or experiments.
Keep secrets out of commits by using .gitignore and environment variables.

Environment variables and secrets:

Use a .env file and a library like dotenv in Node.js to access variables. Add .env to .gitignore.
Never commit production credentials. Use local mock services or limited-scope tokens.

Testing and automation:

Unit tests for backend: set up Jest (JavaScript) or PHPUnit (PHP) and run in a local CI-like script.
Browser testing: use Playwright or Cypress for end-to-end tests. A basic Cypress test takes about 15-30 minutes to write and proves critical flows.

Performance profiling:

Use Chrome DevTools to measure load times and JS CPU usage. Lighthouse gives a performance score; aim for a Performance score > 90 for landing pages.
For local API performance, use Apache Bench or wrk for simple load testing with small request counts (1000 requests) to identify glaring issues.

Collaboration:

Share local sites with teammates using ngrok (free and paid tiers) or GitHub Codespaces for cloud-based development. Ngrok temporary URLs can be created in under a minute.

Deployment parity:

Keep a checklist to verify before pushing to production:
Same Node/PHP version
Environment variables set
DB migrations applied
All tests pass

Tools and Resources

Editors and IDEs:

Visual Studio Code - free, extensions for Live Server, Prettier, ESLint.
Sublime Text - paid (license about $99 one-time), lightweight.

Local stacks and runtimes:

XAMPP - free, cross-platform for Apache, MySQL, PHP.
MAMP - free basic; MAMP Pro paid (around $79 one-time for advanced features).
Local by Flywheel (localwp) - free, built for WordPress and very beginner-friendly.
Docker Desktop - free for personal use; Docker Pro starts at about $5 per month, Team and Business tiers higher. Check current Docker pricing for exact numbers.
Node.js - free; use nvm (Node Version Manager) free to switch versions.

Hosting and deployment (for later):

Netlify - free tier for static sites; paid plans from $19 per month for teams.
Vercel - free tier for hobby projects; Pro around $20 per user per month.
GitHub Pages - free for static sites.
DigitalOcean - droplets start at $4-$5 per month for small VPS instances.

Testing and tunnels:

ngrok - free tier with temporary URLs; paid plans for reserved domains (starting around $8-$15 per month).
localhost.run - free simple SSH-based tunnel service.

Version control and CI:

Git - free and essential.
GitHub - free plan, Teams and Enterprise add paid tiers.
GitHub Actions - free tier available, paid for larger usage.

Pricing summary (typical as of mid-2024, verify current pricing):

VS Code: free
XAMPP: free
MAMP Pro: ~ $79 one-time
Local by Flywheel: free
Docker Desktop: free for personal; Pro from ~$5/month
Netlify/Vercel: free tiers; Pro from ~$19-$20/month

Checklist to start a local site (quick):

Install code editor (VS Code).
Choose stack: static, PHP/WordPress, Node, or Docker.
Install runtime: Node.js or XAMPP/MAMP or Docker.
Start server and browse to localhost or mapped hostname.
Commit initial code to Git.

Common Mistakes and How to Avoid Them

Port conflicts

Problem: server fails to start because port is taken.
Avoidance: check active ports (lsof -i :3000 on macOS/Linux, netstat -a -b on Windows) and change dev server port, or stop the conflicting service.

Forgetting to match runtime versions

Problem: app works locally but fails in production due to Node/PHP version mismatch.
Avoidance: use nvm for Node, Docker containers, or document required versions in an .nvmrc or Dockerfile.

Committing secrets

Problem: API keys or database credentials end up in version control.
Avoidance: use .gitignore for .env files and use environment variables or a secrets manager.

Not using version control

Problem: losing work or difficulty collaborating.
Avoidance: initialize Git, commit small changes, and push to remote repos like GitHub.

Overcomplicating with Docker too early

Problem: spending days configuring containers for small static projects.
Avoidance: use Docker when you need environment parity; for simple prototypes use static servers or local stacks.

FAQ

How Long Does It Take to Run a Website Locally?

A basic static site can run locally in 10-30 minutes. A WordPress site using Local by Flywheel can be ready in 10-20 minutes. A full-stack app or Docker workflow can take several hours to a day depending on experience.

Can I Use My Phone to Preview a Local Site?

Yes. 0.0. For remote sharing, use tools like ngrok to create a temporary public URL.

Is Docker Necessary to Run a Local Website?

No. js, PHP stacks, or local tools like XAMPP or Local by Flywheel.

How Do I Map a Custom Domain to My Local Site?

Edit your hosts file with an entry like:

and configure your server (Apache, nginx, or dev server) to respond to that hostname. localhost TLD to avoid conflicts with real domains.

What If My Site Needs a Database?

Install a local database using your stack (MySQL via XAMPP, PostgreSQL via Docker or native installer). Use database dumps for realistic data and run migrations locally. For isolated testing, use SQLite for simple projects.

Next Steps

Pick a quick project and target time: set a goal to run a static prototype in 30 minutes or a WordPress local site in 60 minutes. Follow the checklist above.
Install core tools: Visual Studio Code, Git, and either Node.js or a local stack (XAMPP/Local by Flywheel). Spend 20-60 minutes installing and verifying.
Create a Git repository and commit your first working version. Push to GitHub and set up a free deployment path (Netlify or Vercel) to learn the full pipeline.
If you need production parity, plan a Docker milestone: allocate 4-16 hours over 1-3 days to learn Docker basics, write a Dockerfile and docker-compose.yml, and test the stack locally.

Command cheat sheet (two quick examples):

Checklist before pushing to production:

Match runtime versions
Run tests and linters
Clean secrets and config files
Confirm database migrations are applied

How to Run a Website Locally