WebifyCMS Site

The repository serves for webifycms.com site which runs on WebifyCMS alpha.

Getting Started

Prerequisites

• PHP >= 8.4
• Composer
• Node.js >= 20 (for front-end assets)

Docker Setup (recommended)

Local development — compose.override.yml is applied automatically by docker compose, giving you live host bind-mounts (code and asset changes are picked up instantly) and local HTTPS via self-signed certs:

# Host-side dependencies (target the same files the containers bind-mount)
npm install

# Start the containers
docker compose up -d

# Install PHP dependencies
docker compose exec app composer install

# Build front-end assets (this also copies assets/img/ → public/assets/img/)
docker compose exec app npm run build

The site is then available at http://localhost:${NGINX_PORT} and https://webifycms.com.local:${NGINX_PORT_SSL} (both set in .env). For the HTTPS hostname, add 127.0.0.1 webifycms.com.local to /etc/hosts and trust the self-signed cert in docker/nginx/ssl/ once.

Production (server) — same base compose.yml, merged with the machine's own compose.override.yml (gitignored, so each environment keeps its own copy):

# Build and start
docker compose -f compose.yml -f compose.override.yml up -d --build

compose.override.yml is machine-specific and gitignored. On a dev machine it adds live bind-mounts and local TLS; on the server it is a minimal file with environment-specific networking (see docs/DEPLOYMENT.md).

	Local (docker compose)	Production (docker compose -f compose.yml -f compose.override.yml)
app image	docker/php/local.Dockerfile + host bind-mount	docker/php/Dockerfile (bundles code + assets + images)
nginx config	docker/nginx/nginx.local.conf (local TLS)	docker/nginx/nginx.caddy.conf (HTTP, proxy terminates TLS)
SSL certs	docker/nginx/ssl/ (gitignored, self-signed)	none (proxy-managed)
Web root	host ./ bind-mounted	shared app-data volume seeded from the image
networks	webifycms-site	webifycms-site + environment-specific (override)

The local development compose.override.yml looks like this:

services:
  app:
    build:
      context: .
      dockerfile: ./docker/php/local.Dockerfile
    volumes:
      - ./:/var/www/html
  server:
    volumes:
      - ./:/var/www/html
      - ./docker/nginx/nginx.local.conf:/etc/nginx/conf.d/default.conf
      - ./docker/nginx/ssl:/etc/nginx/ssl:ro
    ports:
      - "${NGINX_PORT}:80"
      - "${NGINX_PORT_SSL}:443"

Manual Setup

# PHP dependencies
composer install

# Front-end dependencies
npm install

# Copy environment file
cp .env.example .env

# Build front-end assets
npm run build

Serve the public/ directory with your web server of choice (Nginx config example in docker/nginx/nginx.caddy.conf).

Front-end Assets (Vite)

CSS and JavaScript source files live in the assets/ directory and are processed by Vite.

# Development — starts Vite dev server with HMR on port 5173
npm run dev

# Production build — minifies and hashes files to public/assets/
npm run build

• CSS is extracted from inline <style> tags into assets/css/app.css
• JS is extracted from inline <script> tags into assets/js/app.js
• In development, App\Infrastructure\Helper\Vite serves assets from the Vite dev server
• In production, it reads public/.vite/manifest.json for hashed filenames
• npm run build also copies assets/img/ into public/assets/img/ so images referenced directly from templates (e.g. logo.png) are served in every environment — same as the production Dockerfile
• Add the Vite dev server origin (http://localhost:5173) to your .env if needed

Asset structure

assets/
  css/app.css      ← all styles (design tokens, components, dark mode, responsive)
  js/app.js        ← all scripts (nav scroll, theme toggle, mobile menu, reveal, signup form)
  img/logo.png     ← logo icon mark (standalone)

🤝 Like to contribute?

Contributions, issues, and feature requests are welcome! Feel free to check the following pages:

• Wiki Page
• Project
• Contribution notes.
• Issues page.
• Code of conduct notes.

⭐️ Show your support

If this project interests you, please consider giving it a ⭐️!

Author

👤 Mohammed Shifreen (Project Lead)

• Website: https://mshifreen.com/
• Github: @Shifrin
• LinkedIn: @mshifreen

License

WebifyCMS is licensed under MIT license, see the LICENSE.md file for details.