I did it! I finally setup a Ghost dev environment

An unapologetically self-indulgent celebratory post about me about finally getting a working development environment setup and working. Feel free to skip.

I did it! I finally setup a Ghost dev environment

This is an unapologetically self-indulgent celebratory post. Feel free to skip.

For the past month I have spent the small amount of free time that I have working on learning and setting up this website.

I wanted to learn how to create my own Ghost blog and so I started at my goal and worked my way out. So, I have been using the Ghost starter theme (demo), the official documentation and many, many google searches to learn as I go.

One of the most important aspects of learning is timely feedback so I knew that I wanted to have as close to a REPL as possible to help accelerate my learning. Meaning: I want to see the changes I make on the site as quickly as possible without constant clicking/reloading/uploading/etc or additional setup time.

I wanted a low friction learning experience.

The Setup

So a month ago I began the process of learning to setup a development environment using the Ghost starter theme, the ghost-cli VS Code,  Firefox Developer Edition, Gulp.js and browsersync.

I won't go into all of the details of this setup today, but I will in a future post.

This is just a celebratory post! I did it!

It's taken me a month of my free time to learn and understand enough to get a development setup that allows me to make ANY changes on my local theme files and have them automatically refreshed in my browser so I can see changes immediately.

The next challenge is to start experimenting with changing the layout to something more desirable and learning more about CSS Custom Properties ("CSS variables"), CSS Grid, Flexbox, border-box and a few other things along the way towards creating some semblance of a design system.

I've also reopened Marijn Haverbeke's Eloquent Javascript again.

Looking forward to what's next...