Why would anyone want to do this?
I wanted to start practicing writing a dev blog for my various interests. While my homepage is built on netlify and gatsby I didn’t want to scale out each potential project in my github account with with a deployment pipeline and have the nightmare of mainting it and applying security patches (I’ve had to update my homepage project several times after running
npm audit fix).
While I appreciate github alerting me when ther is a new security vunerablity and I have a duty as an software engineer to respond . I want to write, create, and explore my interests for fun, not another job (One reason I never seriously considered playing Death Stranding).
Therefore I started exploring – or rather rediscovering – using github pages and jekyll. However, it became appartent that I needed to develop a way to see my changes while I was making edits to my posts.
A typical development cycle is to install jekyll on your workstation and run it locally. I typically like to keep my development free of installed packages. I also tend to hop from machine to machine and from project to project. My common practice is to create an single entrypoint in the project to boostrap everything a contributor would need to start coding right away.
- Clone the repository
- Run the entrypoint script (in this case Make)
- Start coding
As a bonus, this is a fun little meta post on how I finally getting started on a project rather than thinking about starting a project.
Running jekyll in a container
Docker hub provided an image
jekyll/jekyll that you can use to generate and serve files from your project.
docker run -p 4000:4000 jekyll/jekyll jekyll serve
Since I didn’t want to remember that command I wrote a small docker-compose file to simplify my development environment.
Running the command
docker-compose up will start the services and you should see the following output in your terminal:
ʕ •ᴥ•ʔ docker-compose up
Starting alexjpazgithubcom_jekyll_1 ... done
Attaching to alexjpazgithubcom_jekyll_1
jekyll_1 | ruby 2.6.5p114 (2019-10-01 revision 67812) [x86_64-linux-musl]
jekyll_1 | Configuration file: /srv/jekyll/_config.yml
jekyll_1 | Source: /srv/jekyll
jekyll_1 | Destination: /srv/jekyll/_site
jekyll_1 | Incremental build: disabled. Enable with --incremental
jekyll_1 | Generating...
jekyll_1 | Jekyll Feed: Generating feed for posts
jekyll_1 | done in 0.709 seconds.
jekyll_1 | Auto-regeneration: enabled for '/srv/jekyll'
jekyll_1 | Server address: http://0.0.0.0:4000
jekyll_1 | Server running... press ctrl-c to stop.
You can then open your browser to
http://localhost:4000 and you should see your generated site!
NOTE It turns own that jekyll has it’s own live reload flag. Simply adding
-l to the command watches the files and reloads the page!
Typically with web frameworks such as
webpack and command-line tools like
entr there is the concept of “live reloading” or reloading the application when there is changes made to a project.
Doing a quick search I landed on
livejs and including this in my layouts for jekyll
What is next?
I’m going to try and keep writing and hopefully I start improving my writing skills. I’m hoping to start another article about creating a game in the browser or pico-8.