STCMS Documentation

Complete guide to building modern, secure React/PHP applications with STCMS framework

Get Started Learn Architecture

How To Use STCMS

Complete guide to building with STCMS - Hybrid PHP/React CMS

Table of Contents

1. Installation & Setup

Quick Start

Step 1: Install STCMS

composer require gemvc/stcms

Step 2: Initialize Project

php vendor/gemvc/stcms/bin/stcms init

Step 3: Install Frontend Dependencies

npm install

Step 4: Build Assets

npm run build

Step 5: Start Development Server

php -S localhost:8000

What You Get

  • • Symfony Cache - Modern caching (APCu/file)
  • • Symfony Dotenv - Environment management
  • • Guzzle HTTP - API integration
  • • Twig Templates - Server-side rendering
  • • Vite Build System - React bundling
  • • Security Headers - Apache configuration

2. Project Structure

Directory Layout

project-root/
├── assets/
│   ├── js/
│   │   ├── app.jsx                # Main React entry point
│   │   ├── registry.js            # Component registry
│   │   └── components/            # React components
│   └── css/                       # Styles
├── pages/
│   ├── index.twig                 # Landing page
│   └── react.twig                 # React examples
├── templates/
│   └── default.twig               # Base layout
├── public/
│   └── assets/build/app.js        # Built JS bundle
├── vite.config.js                 # Vite config
├── package.json                   # NPM dependencies
├── composer.json                  # PHP dependencies
├── index.php                      # PHP entry point
├── .env                           # Environment config
├── .htaccess                      # Apache config
└── vendor/                        # Composer dependencies

3. Creating Pages

Basic Page Example

File: pages/about.twig


{% block title %}About Us{% endblock %}

{% block content %}


    
About Our Company

    
    

        
This is our about page content...

    

    
    
    



{% endblock %}

Page Best Practices

  • • Always extend default.twig for consistent layout
  • • Use semantic HTML and Tailwind classes for styling
  • • Add React mount points with unique IDs
  • • Keep pages focused on content, not logic
  • • Use descriptive file names (e.g., contact.twig)

Success!

This is a working version of the how page. The issue was likely with the complexity of the original file.