Giter Site home page Giter Site logo

csscms's Introduction

CSSCMS

A CMS based on stuffing everything we can into CSS and leveraging Bash tools to handle everyting else.

What?

Go take a look at the CSSCMS website to see what this looks like in practice. Inspect the HTML.

Why?

Becasue why am I using npm or GoLang or even PHP to write HTML and CSS and maybe some simple JS?

Can't I just write that HTML and CSS directly?"

Turns out I can can.

But then I have to keep track of the headers, footers, common menus and all the things from every page. The value of the CMS is that you can make those parts build dynamically. I think along the way, at some level, we want to have all this freedom to make changes quickly and iteratively, even though it is kinda rare to change certain thinks like the header and footer that much. I asked myself what if we solved this part of the CMS problem with some good old fashioned CSS.

No, really.

If you go take a look at the CSSCMS website you can see a working example of this. Made with a principle of 'if we can stuff it in the CSS we shall', I even go so far as to stuffing entire pages of content in the content:before selector.

How?

Installation

Clone this repo locally and open in your favorite IDE. Open the index.html file in a browser.

Look at the file layout

No surprises here. Index in the root and everything else in a logicial folder.

Making new posts

  1. Install the tool by running in your terminal: chmod 755 postcreator.sh
  2. Use the tool by running ./postcreator.sh name-of-new-post
    This will clone a new name-of-new-post.html and name-of-new-post.css from the src file and insert a link to the new post at the top of the list on our pageindex.html using good ol' sed.
  3. Drop your content into the content section and style that post with the css file stored over in css/post/css/name-of-new-post.css

Markdown FTW!

The fastest and best way to build out HTML, like I am doing right now, is through Markdown and a good editor. I am not building a Markdown to HTML parcer. There are a lot out there and I personally like MacDown. If they spit out HTML then they are good.

Deleting posts

  1. Install the tool by running in your terminal: chmod 755 postdeleter.sh
  2. Use the tool by running ./postdeleter.sh name-of-post-to-delete
    This deleted the html and css as well as removing the link from the postindex.html

Modifying things globally?

But what about the links in the menus and such that live outside the CSS? For that, there has been a solution for many, many years and it is called sed or awk. These tools are very well documented and can be seen in action in the postcreator.sh and postdeleter.sh tooling. Theoretically you could build a command line to rule all of this, but, hey this is a proof of concept.

Software Updates?

Nope. Not going to happen. But guess what, unless they change how the browser reads CSS and HTML this is not likely going to ever need an update. No npm libraries to keep track of, no weird dependencies opening me up for hacks.

Hosting

GithubPages is my suggestion but literally any hosting on earth is good enough for presenting a flat static site. Again, once set up, never ever worry about updating your site code again, ever, or until you want to update the content.

Is this a good idea?

Likely no. There are likely a lot of issues that I am not seeing here or thinking through and this is meant as a way to play out a thought experiment more than I think it should go into proudction for most use cases. However, there is a specific set of blogs that are basically just

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.