A brief introduction to tiny CMS
Tags: beginners, webdev, opensource
Published: 2019-02-02 23:47:49

I recently setup my own <a href="https://gabemade.com">blog</a> using a 'flat-file' content management system known as <a href="https://getgrav.org/">GRAV</a>. If you are unaware of what a Flat File CMS is, it's essentially a CMS like WordPress in where it uses PHP to process logic. Where it's different is in it's lack of database, for storing posts and other data it uses flat text files. It's pretty neat. In the short time since my install, I've installed five amazing small plug-ins, and have built out my own custom theme using CSS and TWIG. It's been a fun experience working with the small CMS, I've especially enjoyed having a full blog at roughly 30mb in size. It's incredibly fast. So in this post I'm going to be giving a small introduction to the CMS. 


We're going to head on over to <a href="https://getgrav.org/downloads">Grav's download page</a> and grab the 'Grav Core + Admin Plugin' bundle. Once you've downloaded and extracted the zip, you'll find the entire CMS plus the admin plugin in that 20mb folder.

## What's in the box?

I've attached a screenshot of an almost default folder structure below with the only modification being the addition of the .ddev folder.

![](https://thepracticaldev.s3.amazonaws.com/i/sncywn9tsfu5kc56ql3k.png)

### Pages
Almost everything you need is located under the user folder. That's the really neat thing about this CMS. Rather than storing your posts in a database like a traditional CMS such as WordPress or Drupal, GRAV stores them right in your users/pages directory. The pages are then organized into folders that contain their respective markdown files. 

### Themes
Themes could, and probably should, get it's own post. There's so much to go over when it comes to themes, and it's all really cool. I'm going to keep it brief for this post. Themes in GRAV are made using TWIG, a PHP template engine. For my own custom theme, I downloaded a <a href="https://github.com/steroyle/grav-blank-theme">blank starter theme</a>, and started with two template files, a 'blog.html.twig' for my blog posts and a 'default.html.twig' for any non-blog pages. In these TWIG files, there are PHP code that pull in my template partials, such as my footer, header, etc. from my partials folder and pieces them all together. I've attached a screenshot of the folder structure for the default theme, Quark to give a clearer image.

![](https://thepracticaldev.s3.amazonaws.com/i/8n0l0pko3e5m2wdtxupw.png)

## Setting up a local

In order to setup and start developing locally, we gotta do some prep work first. We need to install <a href="https://docs.docker.com/docker-for-mac/install/">Docker</a> and <a href="https://ddev.readthedocs.io/en/stable/">DDEV</a>. Docker is a straight forward install, create an account, download the DMG, slide the Docker.app into your applications folder. For DDEV, I chose to install it via <a href="https://brew.sh/">BREW</a>. Assuming you have BREW installed, we must first add the ddev repository using ```brew tap drud/ddev``` once it's added, we can run the following to install ddev onto our machine. ```brew install ddev```
We should at this point have DDEV and Docker installed, so now we're ready to get started. Let's move our Grav folder from downloads to a more secure location. I moved mine into my "Sites" folder in my home directory. Open Terminal and lets CD into our site folder. 

![](https://thepracticaldev.s3.amazonaws.com/i/6fa9n3zo0urg6xh0spme.png)

Once there, we want to run ```ddev config``` we will then be prompted to enter a name for our project. I chose grav-demo in this case.

![](https://thepracticaldev.s3.amazonaws.com/i/wqs1qqvfb7vdpwn4n8be.png)

Another prompt appears asking us the DocRoot location, leave it blank. Finally, the last prompt will ask us to enter the project type, in our case it is PHP. 

![](https://thepracticaldev.s3.amazonaws.com/i/rqygkc8jb3ji6kpgsotf.png)

And now we run ```ddev start```

This may take a bit since it's building out our container. Once it's done it should spit out a nice link where we can view our local install. 

### Admin Panel
The first screen you'll be presented with is the Admin User Creation screen, since we have the admin plug-in installed by default but no admin accounts. Create one and it'll throw you right into the admin panel.

![](https://thepracticaldev.s3.amazonaws.com/i/1ofak5k4oyta60g4lbyo.png)

Here we have a brief overview of our site's backup and update status, and the visitor count. In the sidebar, we can see quick links to our site configuration, pages, plug-ins, themes, etc. 

### Pages

If we head into pages we can see the default pages that come with GRAV, HOME and TYPOGRAPHY. Here in this section, we can add folders and pages to our site and organize them however we like.

![](https://thepracticaldev.s3.amazonaws.com/i/3w085czygx8s659ojz4t.png)

If we click on a page, we will be able to edit it via a WYSIWYG. By default it will look like the following, but you can install other <a href="https://github.com/newbthenewbd/grav-plugin-tinymce-editor">more advanced editors</a> if you so choose.

![](https://thepracticaldev.s3.amazonaws.com/i/eoacoyuq21kf1717lyks.png)

### Plug-ins

Straight forward, installed plug-ins will show up here. You can even search for new plug-ins to install right in this section via the +add button which is super convenient. 

![](https://thepracticaldev.s3.amazonaws.com/i/o89nmxcyl23tqpmhlojy.png)

### Themes

Themes you create or install will show up in this section and can be activated/deactivated, here.

![](https://thepracticaldev.s3.amazonaws.com/i/u2wiwehdcaex5l96wz1i.png)

## Final Thoughts

So there you have it, in a brief, 5 minute read - that was an intro to the tiny GRAV CMS. A small flat file CMS that can really do a lot! For me, experimenting with GRAV got me interested in other small content management systems such as <a href="https://www.wondercms.com/">WonderCMS</a> and <a href="https://octobercms.com/">OctoberCMS</a>. So far I've played around with WonderCMS, but am very curious to try out October for its Laravel framework. For now, I'll stick to working on my current GRAV install and experiment with the theming.