The GodiSittes website is built as a static site, enhanced with dynamic language support through JavaScript and pre-rendered localized HTML files.
-
No CMS, no server-side logic.
Everything is processed at build time – the result is a fast, SEO-friendly, 100% static site. -
One source HTML per page.
The source HTML is written in Hungarian, with all translatable text marked usingdata-i18nattributes. -
One
translations.jsfile
This flat object contains key-value pairs for each language. During build, the keys are injected based ondata-i18nattributes and metadata (title, meta description, etc.). -
Language-specific folders (
/hu,/en,/de)
The deploy script creates a localized version of each page under each language folder, maintaining clean URLs and proper<html lang="">attributes. -
SEO-friendly routing
Canonical URLs,hreflangtags, and translated meta content are generated automatically for each language version. -
Blog support
Blog posts are treated like static HTML pages, but translated using the samedata-i18nsystem. Simple, yet scalable. -
Easy to maintain
You write content once, mark it properly, and the deploy script does the rest. No complex frameworks, no build chains from hell.
Because sometimes… simple is smart.
This setup gives you:
- Fast page loads
- Full control over every byte
- Great SEO out of the box
- Easy versioning and deployment
- Peace of mind (no runtime errors or dependencies)
No database. No backend. Just pure HTML, JS, and love.
– Zsákos Dzsoni ❤️
This project uses the deploy.js script to automate the entire build and internationalization pipeline for the static site. It processes translations, minifies assets, builds multilingual HTML files, and generates sitemap and robots.txt.
- Builds
translations.node.jsfor internal JS usage. - Minifies translation files →
translations.min.js - Minifies JavaScript →
script.min.js - Minifies CSS →
style.min.css - Copies all minified assets to the
/distdirectory. - Processes HTML files (including blog posts):
- Injects correct translations from
translations.js - Rewrites titles, meta tags, and canonical URLs
- Handles language-specific link rewrites and text replacements
- Supports fallback translation mapping based on original
HUstrings
- Injects correct translations from
- Generates localized versions of every HTML file in
hu,en, anddesubfolders. - Copies static assets, including:
- The
/imagesfolder - Optional
site.webmanifest - Everything inside
/favicons/→ copied flat to/dist
- The
- Generates
sitemap.xmlwith entries for every language and page - Generates
robots.txt - Logs missing translation keys per file and language
- Logs unused translation keys to help clean up
translations.js - Updates language dropdowns dynamically
ℹ️ The contents of
/favicons/(such asfavicon.ico,apple-touch-icon.png, etc.) are copied directly to the root of the/distfolder.
This ensures proper referencing by browsers and social platforms.
godisittes/
├── .ddev/ # DDEV config (optional)
├── blog/ # Source blog articles (HTML)
├── dist/ # Final output generated by deploy.js
├── favicons/ # Favicons to be copied into dist/
├── images/ # Static image assets
├── node_modules/ # Installed dependencies
├── .htaccess.template # Apache config (template)
├── 404.html # Custom 404 page
├── blog.html # Blog post listing page
├── deploy.js # Deployment script (magic happens here)
├── index.html # Main entry point
├── koszonjuk.html # Thank-you/confirmation page
├── package.json # Project config & dependencies
├── package-lock.json # Dependency lock file
├── README.md # This file
├── robots.txt # Basic robots rules (generated too)
├── script.js # Raw JavaScript
├── speechtexts.js # Voice message strings
├── style.css # Raw CSS
├── translations.js # Translations (editable)
├── translations.node.js # Auto-generated version for node usage
├── watch.js # Local dev watcher (optional)💡 The system prioritizes simplicity. There’s no build framework, no bundlers – just vanilla HTML + CSS + JS + a powerful Node.js deploy script.
This keeps deployment blazing fast and ultra-portable (great for shared hosting or basic Apache setups).
Before getting started, make sure Node.js is installed on your system.
Then, install the necessary modules by running:
npm installTo deploy, run:
node deploy.jsTo serve the GodiSittes static website correctly with language fallback, proper routing, and cache headers, you'll need some custom Apache configuration.
The generated .htaccess file (copied automatically to /dist) enables:
- Pretty URLs (e.g.
/hu/blog.htmlloads cleanly) - Language fallback using
/hu,/en,/defolders - Static file cache headers
- 404 fallback to a custom page (
/404.html)
Example logic in .htaccess:
# Redirect trailing slash to index.html
RewriteEngine On
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.+)/$ /$1/index.html [L]
# Fallback to 404.html for missing files
ErrorDocument 404 /404.htmlThis is generated by the
deploy.jsscript – you don’t need to write it manually.
Here is a basic VirtualHost setup that works well with the /dist output:
<VirtualHost *:443>
ServerName godisittes.hu
DocumentRoot /var/www/godisittes/dist
SSLEngine on
SSLCertificateFile /etc/letsencrypt/live/godisittes.hu/fullchain.pem
SSLCertificateKeyFile /etc/letsencrypt/live/godisittes.hu/privkey.pem
Include /etc/letsencrypt/options-ssl-apache.conf
<Directory /var/www/godisittes/dist>
Options -Indexes +FollowSymLinks
AllowOverride All
Require all granted
</Directory>
# Compression
<IfModule mod_deflate.c>
AddOutputFilterByType DEFLATE text/html text/plain text/css application/javascript
</IfModule>
# Cache control
<IfModule mod_expires.c>
ExpiresActive on
ExpiresDefault "access plus 5 days"
ExpiresByType text/css "access plus 1 year"
ExpiresByType application/javascript "access plus 1 year"
ExpiresByType image/webp "access plus 1 year"
ExpiresByType image/png "access plus 1 year"
</IfModule>
# Security headers
Header always set Strict-Transport-Security "max-age=63072000; includeSubDomains; preload"
Header always set X-Content-Type-Options "nosniff"
Header always set X-Frame-Options "SAMEORIGIN"
Header always set X-XSS-Protection "1; mode=block"
Header always set Referrer-Policy "strict-origin-when-cross-origin"
</VirtualHost>✅ Tip: For full redirect logic (e.g. from www. and http to https://godisittes.hu), check out the included vhost.conf in the project.
The deploy script expects
/distto be the document root. Make sure Apache points there.
And that’s it! 🎉 You now have a fully internationalized, ultra-fast static website with server-side support – no framework bloat required.
These two pages inspired the visual style:
- https://codepen.io/kathykato/pen/wvgNVeJ
- https://speckyboy.com/comic-inspired-css-javascript-snippets/
Special thanks to:
- Stephanie Eckles → Twitter: @5t3ph
This project is released under a permissive open license.
You are free to:
- Use it
- Modify it
- Distribute it
- Integrate it into your own projects
…as long as you credit the original author.
Please include the following attribution somewhere in your project or documentation:
Created by Zoltán Horváth – https://beyondstart.solutions/
Let’s keep the web simple, fast, and clean – together.