10/15/2015

website updates

I've just completed a much needed refresh of this page. The old version of this website didn't even have pagination, all of the entries were placed on one super long home page that had a massive page size (100's of MB).

I've completely rewritten the back-end. It's not longer purely folder based, but instead a simple .json file holds all of the information about entries. It's essentially a database in a file. I figured there's no need for a full fledged database engine if I'm just storing a list of things I want to show up.

While fun, I've decided not to roll all of my own CSS this time, instead using the wonderful Bootstrap framework. It's kind of cheating, but it does a lot of the responsive gruntwork that I didn't want to deal with this time. The old website was an awful experience on mobile with my fixed width design. Here's a comparison.

image

The menu on the old website was just a right float'd div and would gladly just lay on top of the main content frame when it needed to. The rest of the page would keep it's same static width (set in pixels). The new menu is using the Bootstrap menu component. It conforms the page size nicely and turns into a drop-down on small widths.

On that note, everything is nice and responsive now. Images and videos embed into the page at all screen widths, and they're lazy loaded too, which means the initial download size of the page is only a few kilobytes until some images are scrolled by.

I added two completely new sections. The projects section groups some related articles together regarding different projects I'm working / have worked on. This way if entries come between project entries they can all be found in a central location. Image headers are specified in the db.json along with a CSS background position that is used to position them. I know it's crudgy to be updating this file myself, but for now it's a perfectly minimal solution that works well.

"projects" : [
    {
        "id"            : 0,
        "title"         : "pallet desk",
        "date_str"      : "2015-01-29",
        "imageURL"      : "/static/files/project-headers/pallet-desk.jpg",
        "imagePosition" : "initial",
        "description"   : "A stylish desk, created with wood from dumpster-find pallets."
    }...
]

I also added an all entries page, which lists all of the entries I've made with a little subheading to draw you into actually reading it, along with some little tags that signify what the entry involves. This also means that now there is a way to link to a singular entry, on the off chance that someone actually wants to share a link to a specific entry on this website.

image

So, overall, I think it's a much needed update and I'm really happy with how it turned out. There are still probably a few bugs that need to be worked out, and some features that I'd still like to add, but it's a huge improvement over what I had before and I'm excited to keep writing more stuff to put here. Let me know if there's anything I should fix or add.