Muhannad Alrisi
Home HOW I CREATE MY SITE

My WebSite is Static

Yes ! this site is a static website and the question is why? 😸 I was thinking how to create my site and there are many ideas came to mind

but most of them are bigger to be used for my own site. There is no need to make complex site, or use a complete CMS for this purpose.

The Plan

I was aiming to use Drupal at the begging but then I realized that I do not need to have a great Framework for simple site.

Then I came to see find this amazing Klein.php

and it was the right choice to use with twig & parsedown

and this post is Markdown file, a static website with routing FTW ✋

Still Under Development

I had to lunch the site ASAP and the site, features going to be added, and I 'm focusing to keep this site static and use work round solution to maintain the bandwidth/ performance

Let's Get Technical

list of the frameworks/library used

Bootstrap v5

I think the reason that I chose to Bootstrap is because I'm familiar with it and the version 5 is great. I find the utility classes are helpful such as .font-weight-bold or mt-4 and the grid system.

Klein.php

I found this by luck and I liked it fit my needs.

Twig

Altought Klein has a template engine functionality I do not know why I integrate twig in this project ❓

ParseDown & ParseDown-checklist

So I can write my content as markdown files

some tweaks

I had to add <hr> to to the heading and that's not included with the parser So do it with javascript

let heading  = document.querySelectorAll(".blog-content h1,h2,h3,h4,h5,h6"); 
heading.forEach(node => { 
   node.after(document.createElement('hr'))
}); 

add global function in twig to access the assets

$twigAssetFunction = new \Twig\TwigFunction('asset' , function($path){
    return SITE_URL.$path; 
}); 
$twig->addFunction($twigAssetFunction);