Web Tools Scaffold

Shared boilerplate for all web tool sites (randommac.com, hextoascii.co, etc.)

Stack

• Backend: Symfony 7.2 + FrankenPHP
• Frontend: Tailwind CSS + rspack (via Symfony Encore)
• Font: Inter Variable
• Runtime: Docker (FrankenPHP worker mode)

Features

• 🌗 Dark mode toggle with system preference detection
• 📋 One-click copy to clipboard
• 📊 Bulk generation with CSV/JSON/TXT export
• 🔒 Client-side only processing (no data sent to server)
• 📱 Mobile-responsive with proper tap targets
• 🔍 Full SEO template: meta tags, Open Graph, Twitter Cards, JSON-LD schemas (WebSite, WebApplication, FAQPage, HowTo, BreadcrumbList)
• 🗺️ Auto-generated sitemap.xml and robots.txt
• 🔗 Cross-linking footer (More Tools section)
• 📢 Ad placement slots (sidebar + banner)
• ⚡ Target <1s load time

Quick Start

# Install dependencies
composer install
npm install

# Dev build (watch mode)
npm run watch

# Production build
npm run build

# Run with Docker
docker compose up -d

Configuration

Override these in .env per tool site:

SITE_NAME="Random MAC Generator"
SITE_DOMAIN="randommac.com"
SITE_DESCRIPTION="Free online MAC address generator"
SITE_THEME_COLOR="#3b82f6"
GTM_ID="GTM-XXXXX"
ADSENSE_PUB_ID="ca-pub-XXXXX"

Creating a New Tool

1. Fork/clone this scaffold
2. Update .env with your site config
3. Create your tool's JS in assets/controllers/
4. Add your tool entry in webpack.config.js
5. Override tool_output, tool_options, and content_blocks in your template
6. Replace assets/resources/icons/ with your tool's branding

Template Blocks

The tool/index.html.twig template provides these override blocks:

Block	Purpose
tool_output	Primary output area (above the fold)
tool_options	Tool controls (format, quantity, etc.)
tool_bulk	Bulk results display
content_blocks	SEO content sections
faq	FAQ accordion
sidebar	Related tools + ads

Production Deployment

docker compose -f compose.yaml -f compose.prod.yaml up -d --build

License

Proprietary — Internal use only.