create-berna-stencil 2.3.0 → 2.4.1

package/.eleventy.js

@@ -43,6 +43,7 @@ module.exports = function (eleventyConfig) {
   eleventyConfig.addPassthroughCopy("src/frontend/.htaccess");
   eleventyConfig.addPassthroughCopy("src/frontend/web.config");
   eleventyConfig.addPassthroughCopy("src/frontend/assets");
+  eleventyConfig.addPassthroughCopy("src/frontend/data");
   eleventyConfig.addPassthroughCopy("src/frontend/robots.txt");
 
   eleventyConfig.addPassthroughCopy({

package/README.md

@@ -12,7 +12,7 @@ Building a website from scratch involves a lot of moving parts: templating engin
 - 📁 **Scalable structure** — a clean, opinionated project layout that grows with your needs
 - 🌍 **Open source** — free to use, free to modify, free to share
 
-![Version](https://img.shields.io/badge/version-2.3.0-blue)
+![Version](https://img.shields.io/badge/version-2.4.1-blue)
 ![License](https://img.shields.io/badge/license-Apache--2.0-blue)
 ![Eleventy](https://img.shields.io/badge/11ty-v3.1.2-black)
 

package/_tools/modules/updateIncludes.js

@@ -5,21 +5,15 @@ const INCLUDES_PATH = 'src/frontend/components/layouts/includes.njk';
 
 // --- Helpers ---
 
-// Returns the file content as a string, or null if the file doesn't exist
 function readIncludes() {
     if (!fileSystem.existsSync(INCLUDES_PATH)) return null;
     return fileSystem.readFileSync(INCLUDES_PATH, 'utf8');
 }
 
-// Writes updated content back to the includes file
 function writeIncludes(content) {
     fileSystem.writeFileSync(INCLUDES_PATH, content);
 }
 
-// Builds the regex that matches the elif block for a given camelCase page name.
-// Defined once here to avoid duplication and the stateful /g flag bug:
-// using /g with .test() advances lastIndex, making a subsequent .replace() start
-// from the wrong position. A fresh non-/g regex avoids this entirely.
 function buildElifRegex(camelName) {
     return new RegExp(
         `[ \\t]*\\{%\\s*elif\\s+title\\s*==\\s*"${camelName}"\\s*%\\}[\\s\\S]*?(?=[ \\t]*\\{%\\s*(?:elif|else|endif))`,
@@ -28,14 +22,12 @@ function buildElifRegex(camelName) {
 
 // --- Public API ---
 
-// Inserts a new elif block before {% else %} for the given page
 function addLayout(pageName) {
     const content = readIncludes();
     if (!content) return;
 
     const camelName = toCamelCase(pageName);
 
-    // Skip if the block already exists
     if (content.includes(`{% elif title == "${camelName}" %}`)) return;
 
     const newElif =
@@ -47,7 +39,6 @@ function addLayout(pageName) {
     console.log(`[UPDATED] Layout block added for "${camelName}".`);
 }
 
-// Removes the elif block for the given page, then collapses extra blank lines
 function removeLayout(pageName) {
     const content = readIncludes();
     if (!content) return;
@@ -60,7 +51,6 @@ function removeLayout(pageName) {
         return;
     }
 
-    // Build a fresh regex instance for replace to avoid stale lastIndex
     const updated = content
         .replace(buildElifRegex(camelName), '')
         .replace(/\n\s*\n\s*\n/g, '\n\n');
@@ -69,10 +59,23 @@ function removeLayout(pageName) {
     console.log(`[CLEANED] Layout block removed for "${camelName}".`);
 }
 
-// Renames a layout block by removing the old one and inserting a new one
 function renameLayout(oldName, newName) {
-    removeLayout(oldName);
-    addLayout(newName);
+    const content = readIncludes();
+    if (!content) return;
+
+    const oldCamel = toCamelCase(oldName);
+    const newCamel = toCamelCase(newName);
+
+    const oldLine = `{% elif title == "${oldCamel}" %}`;
+    const newLine = `{% elif title == "${newCamel}" %}`;
+
+    if (!content.includes(oldLine)) {
+        console.log(`[DEBUG] Layout block for "${oldCamel}" not found. Skipped.`);
+        return;
+    }
+
+    writeIncludes(content.replace(oldLine, newLine));
+    console.log(`[RENAMED] Layout block renamed from "${oldCamel}" to "${newCamel}".`);
 }
 
 module.exports = { addLayout, removeLayout, renameLayout };

package/_tools/res/templates/template.js

@@ -1,13 +1,5 @@
-//===========================
-// JAVASCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule.js';
 
-//==========================
-// PAGE CUSTOM JAVASCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", () => {
     // initExampleModule();
 });

package/_tools/res/templates/template.ts

@@ -1,13 +1,5 @@
-//===========================
-// TYPESCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule';
 
-//==========================
-// PAGE CUSTOM TYPESCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", (): void => {
     // initExampleModule();
 });

package/bin/create.js

@@ -120,7 +120,7 @@ src/backend/config.php
 
 const PROJECT_PACKAGE = {
     name:      path.basename(targetDir),
-    version:   '2.3.0',
+    version:   '2.4.1',
     private:   true,
     outputDir: 'out',
     "scripts": {

package/docs/Backend.md

@@ -1,5 +1,11 @@
 # Backend
 
+> **PHP requirement** — the backend runs only on servers with PHP support:
+> - **Apache** (shared hosting, VPS) ✅
+> - **Nginx** + PHP-FPM (VPS) ✅
+> - **IIS** + FastCGI (Windows Server) ✅
+> - **Static hosting** (Netlify, Vercel, GitHub Pages, Cloudflare Pages) ❌
+
 The backend is a PHP REST API located in `src/backend/`, copied to the output directory automatically at build time.
 
 ## Structure
@@ -30,9 +36,9 @@ return [
     'API_KEY' => 'default-key',
 
     // If you want restrict access to protected endpoints to specific clients, you can define custom keys for each endpoint
-    // For subfolder endpoints, use the relative path ('subfolder/endpoint')
     'ENDPOINT_KEYS' => [
-        'example-protected' => 'custom-key',
+    // For subfolder endpoints, use the relative path ('subfolder/endpoint')
+    // 'subfolder/endpoint'    => 'example-key',
     ],
 
     'DB_HOST' => '127.0.0.1',

package/docs/Deploy.md

@@ -0,0 +1,55 @@
+# Server Configuration
+
+Berna-Stencil includes ready-made server configuration for Apache and IIS. For Nginx, a reference config is provided in the project root.
+
+## Apache
+
+`.htaccess` files at `src/frontend/` and `src/backend/` are automatically copied to the build output by Eleventy. No additional setup required.
+
+Covers:
+- Directory listing disabled
+- 403 / 404 → `/404.html`
+- Sensitive files blocked (`web.config`, dotfiles, etc.)
+- `/api/*` → `backend/_core/index.php`
+- HTTPS redirect
+
+## IIS
+
+`web.config` files at `src/frontend/` and `src/backend/` are automatically copied to the build output by Eleventy. No additional setup required.
+
+Covers the same rules as the Apache configuration above.
+
+## Nginx
+
+Nginx does not support per-directory configuration files. The `nginx.conf` in the project root is a reference config that must be manually placed on the server.
+
+### Setup
+
+1. Copy `nginx.conf` to the server:
+```bash
+scp nginx.conf user@server:/etc/nginx/sites-available/your-site
+```
+
+2. Edit `server_name` and `root` to match your environment:
+```nginx
+server_name example.com;
+root /var/www/html/out;
+```
+
+3. Add your SSL certificate paths.
+
+4. Enable and reload:
+```bash
+ln -s /etc/nginx/sites-available/your-site /etc/nginx/sites-enabled/
+nginx -t && systemctl reload nginx
+```
+
+### PHP-FPM socket
+
+The default socket path in `nginx.conf` targets RHEL / Fedora systems. Adjust for your distro:
+
+| Distro | Path |
+|---|---|
+| RHEL / Fedora | `unix:/run/php-fpm/php-fpm.sock` |
+| Debian / Ubuntu | `unix:/run/php/php-fpm.sock` |
+| TCP fallback | `127.0.0.1:9000` |

package/docs/Javascript.md

@@ -11,19 +11,13 @@ Import only what the page needs.
 ### examplePage.js <small>(`src/frontend/js/pages/`)</small>
 
 ```js
-//===========================
-// JAVASCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule.js';
 
-//==========================
-// PAGE CUSTOM JAVASCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", () => {
     // initExampleModule();
 });
+
+// Page logic here
 ```
 
 ## Modules
@@ -39,12 +33,8 @@ Use ESM syntax — esbuild handles the bundling:
 ### exampleModule.js <small>(`src/frontend/js/modules/`)</small>
 
 ```js
-//==========================
-// EXAMPLE MODULE
-//==========================
-
 export function exampleModule() {
-    // Example module logic
+    // Module logic here
 }
 ```
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "create-berna-stencil",
-  "version": "2.3.0",
+  "version": "2.4.1",
   "description": "Eleventy boilerplate with per-page SCSS/JS pipeline, esbuild bundling, multi-framework CSS support and a built-in page management CLI",
   "keywords": [],
   "author": "Michele Garofalo",

package/src/backend/config.php

@@ -6,9 +6,9 @@ return [
     'API_KEY' => 'DEFAULT_KEY',
 
     // If you want restrict access to protected endpoints to specific clients, you can define custom keys for each endpoint
-    // For subfolder endpoints, use the relative path ('subfolder/endpoint')
     'ENDPOINT_KEYS' => [
-    'subfolder/example-protected'    => 'example-key',
+    // For subfolder endpoints, use the relative path ('subfolder/endpoint')
+    // 'subfolder/endpoint'    => 'example-key',
     ],
 
     // Database configuration

package/src/frontend/components/welcome.njk

@@ -35,6 +35,10 @@
       <input type="radio" name="guide-filter" value="backend" />
       <span class="filter-pill">Backend</span>
     </label>
+    <label>
+      <input type="radio" name="guide-filter" value="deploy" />
+      <span class="filter-pill">Deploy</span>
+    </label>
   </div>
 
   <div class="tabs-container">
@@ -90,6 +94,9 @@
     <div id="content-backend" class="tab-content markdown-body">
       {% mdFile "docs/backend.md" %}
     </div>
+    <div id="content-deploy" class="tab-content markdown-body">
+      {% mdFile "docs/deploy.md" %}
+    </div>
 
   </div>
 </div>

package/src/frontend/js/modules/exampleModule.js

@@ -1,7 +1,3 @@
-//==========================
-// EXAMPLE MODULE
-//==========================
-
 export function initExampleModule() {
-    // Example module logic
+    // Module logic here
 }

package/src/frontend/js/pages/404.js

@@ -1,13 +1,7 @@
-//===========================
-// JAVASCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule.js';
 
-//==========================
-// PAGE CUSTOM JAVASCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", () => {
     // initExampleModule();
-});
+});
+
+// Page logic here

package/src/frontend/js/pages/homepage.js

@@ -1,13 +1,7 @@
-//===========================
-// JAVASCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule.js';
 
-//==========================
-// PAGE CUSTOM JAVASCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", () => {
     // initExampleModule();
-});
+});
+
+// Page logic here

package/src/frontend/scss/modules/_global.scss

@@ -36,9 +36,9 @@
 }
 
 body {
-    min-height: 100svh;
     display: flex;
     flex-direction: column;
+    min-height: 100svh;
 }
 
 main {

package/src/frontend/scss/modules/_header.scss

@@ -8,9 +8,6 @@
 header {
     height: root.$header-height;
     width: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
     padding: root.$header-padding-y root.$header-padding-x;
     background-color: root.$primary;
     background-color: #2e7253;

package/src/frontend/ts/modules/exampleModule.ts

@@ -1,3 +1,3 @@
 export function initExampleModule(): void {
-    // Example module logic
+    // Module logic here
 }

package/src/frontend/ts/pages/404.ts

@@ -1,13 +1,7 @@
-//===========================
-// TYPESCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule';
 
-//==========================
-// PAGE CUSTOM TYPESCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", (): void => {
     // initExampleModule();
-});
+});
+
+// Page logic here

package/src/frontend/ts/pages/homepage.ts

@@ -1,13 +1,7 @@
-//===========================
-// TYPESCRIPT MODULES IMPORTS
-//===========================
-
 // import { initExampleModule } from '../modules/exampleModule';
 
-//==========================
-// PAGE CUSTOM TYPESCRIPT
-//==========================
-
 document.addEventListener("DOMContentLoaded", (): void => {
     // initExampleModule();
-});
+});
+
+// Page logic here